Add military-aphorisms page and image
ยท 4 months ago
97a5a929b530deacf34156b6ba080cc4516e2f39
Parent:
cbd267cdf
Add new cheatsheet page (military-aphorisms.html) containing a curated collection of military aphorisms organized by United States branches, international wisdom, Murphy's Laws, and strategy/ancient quotes. Includes Bootstrap layout, custom styles, Google fonts, JSON-LD metadata, OG/Twitter tags, search filtering, and copy-to-clipboard functionality. Also add images/military-aphorisms.png referenced for social previews.
2 files changed +860 โ0
- images/military-aphorisms.png binary
- military-aphorisms.html +860 โ0
Diff
Binary files /dev/null and b/images/military-aphorisms.png differ --- /dev/null +++ b/military-aphorisms.html @@ -0,0 +1,860 @@ +<!DOCTYPE html> +<html data-bs-theme="dark" lang="en"> + <head> + <meta charset="utf-8"/> + <meta content="width=device-width, initial-scale=1.0" name="viewport"/> + <!-- ESSENTIAL SEO TAGS --> + <title> + Military Aphorisms: Tactical Wisdom & Maxims Cheatsheet + </title> + <meta content="A comprehensive collection of military aphorisms, tactical maxims, and combat laws categorized by country and service branch. Includes 'Slow is smooth', Murphy's Laws, and international wisdom." name="description"> + <meta content="military aphorisms, tactical wisdom, army quotes, navy seal maxims, murphy's laws of combat, slow is smooth smooth is fast, sun tzu, usmc quotes" name="keywords"> + <link href="https://cheatsheets.davidveksler.com/military-aphorisms.html" rel="canonical"/> + <!-- OPEN GRAPH TAGS --> + <meta content="Military Aphorisms & Tactical Wisdom" property="og:title"/> + <meta content="From 'Slow is smooth' to 'Who Dares Wins' โ a curated list of combat maxims organized by branch and nation." property="og:description"/> + <meta content="https://cheatsheets.davidveksler.com/military-aphorisms.html" property="og:url"/> + <meta content="images/military-aphorisms.png" property="og:image"/> + <meta content="Tactical map background with military quotes overlay" property="og:image:alt"/> + <!-- TWITTER CARD TAGS --> + <meta content="summary_large_image" name="twitter:card"/> + <meta content="Military Aphorisms & Tactical Wisdom" name="twitter:title"/> + <meta content="Comprehensive guide to military maxims, rules of engagement, and historical strategy." name="twitter:description"/> + <meta content="images/military-aphorisms.png" name="twitter:image"/> + <meta content="@heroiclife" name="twitter:creator"/> + <!-- BOOTSTRAP 5.3.3 CSS --> + <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet"/> + <link href="https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap-icons.min.css" rel="stylesheet"/> + <!-- GOOGLE FONTS --> + <link href="https://fonts.googleapis.com" rel="preconnect"/> + <link crossorigin="" href="https://fonts.gstatic.com" rel="preconnect"/> + <link href="https://fonts.googleapis.com/css2?family=Black+Ops+One&family=Roboto+Mono:wght@400;700&family=Roboto:wght@400;500;700&display=swap" rel="stylesheet"/> + <!-- JSON-LD STRUCTURED DATA --> + <script type="application/ld+json"> + { + "@context": "https://schema.org", + "@type": "TechArticle", + "headline": "Military Aphorisms & Tactical Wisdom v1.0", + "description": "A structured collection of military maxims, combat laws, and strategic quotes categorized by service branch and country of origin.", + "author": { + "@type": "Person", + "name": "David Veksler (AI Generated)" + }, + "publisher": { + "@type": "Organization", + "name": "David Veksler Cheatsheets" + }, + "datePublished": "2026-02-01", + "dateModified": "2026-02-01", + "keywords": "military, strategy, tactics, quotes, maxims, history" + } + </script> + <style> + :root { + --us-army: #4b5320; + --us-navy: #000080; + --usmc: #990000; + --us-airforce: #00308F; + --camo-green: #3f4a3c; + --tactical-sand: #d2b48c; + --accent-gold: #FFD700; + } + + body { + font-family: 'Roboto', sans-serif; + background-color: #1a1a1a; + color: #e0e0e0; + } + + h1, h2, h3 { + font-family: 'Black Ops One', system-ui; + text-transform: uppercase; + letter-spacing: 1px; + } + + .hero-section { + background: linear-gradient(rgba(0,0,0,0.7), rgba(0,0,0,0.7)), url('data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSI0MCIgaGVpZ2h0PSI0MCIgdmlld0JveD0iMCAwIDQwIDQwIj48ZyBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxwYXRoIGQ9Ik0wIDQwaDQwVjBIMHY0MHptMjAgMjBoMjB2MjBIMjBWNjB6TTAgODBocjB2MjBIMHYtMjB6IiBmaWxsPSIjMzMzIiBmaWxsLW9wYWNpdHk9IjAuMSIvPjwvZz48L3N2Zz4='); + padding: 4rem 1rem; + border-bottom: 4px solid var(--accent-gold); + margin-bottom: 2rem; + } + + .quote-card { + border: 1px solid rgba(255,255,255,0.1); + background: #252525; + transition: transform 0.2s, box-shadow 0.2s; + height: 100%; + position: relative; + overflow: hidden; + } + + .quote-card:hover { + transform: translateY(-3px); + box-shadow: 0 5px 15px rgba(0,0,0,0.3); + border-color: rgba(255,255,255,0.3); + } + + .quote-text { + font-size: 1.25rem; + font-weight: 500; + margin-bottom: 1rem; + border-left: 3px solid var(--accent-gold); + padding-left: 1rem; + } + + .quote-meaning { + font-size: 0.9rem; + color: #aaa; + font-family: 'Roboto Mono', monospace; + } + + /* Branch Specific Accents */ + .border-navy { border-top: 4px solid var(--us-navy) !important; } + .border-army { border-top: 4px solid var(--us-army) !important; } + .border-usmc { border-top: 4px solid var(--usmc) !important; } + .border-af { border-top: 4px solid var(--us-airforce) !important; } + .border-intl { border-top: 4px solid #555 !important; } + + .badge-branch { + position: absolute; + top: 10px; + right: 10px; + opacity: 0.8; + font-size: 0.7rem; + text-transform: uppercase; + } + + .section-header { + border-bottom: 2px solid #444; + padding-bottom: 0.5rem; + margin-bottom: 1.5rem; + display: flex; + align-items: center; + gap: 10px; + } + + .copy-btn { + position: absolute; + bottom: 10px; + right: 10px; + background: transparent; + border: none; + color: #666; + cursor: pointer; + transition: color 0.2s; + } + .copy-btn:hover { color: var(--accent-gold); } + + /* Search styling */ + #searchInput { + background-color: #333; + border: 1px solid #555; + color: white; + font-family: 'Roboto Mono', monospace; + } + #searchInput:focus { + box-shadow: 0 0 0 0.25rem rgba(210, 180, 140, 0.25); + border-color: var(--tactical-sand); + } + + @media print { + .hero-section { padding: 1rem; background: none; color: black; } + body { background: white; color: black; } + .quote-card { border: 1px solid #ccc; break-inside: avoid; } + .btn-group, #searchInput { display: none; } + } + </style> + </meta> + </meta> + <meta content="website" property="og:type"/> + </head> + <body> + <!-- Header --> + <header class="hero-section text-center"> + <div class="container"> + <h1 class="display-4 mb-2"> + <i class="bi bi-shield-shaded me-2"> + </i> + Military Aphorisms + </h1> + <p class="lead text-secondary mb-4"> + Tactical Wisdom, Combat Laws & Strategic Maxims + </p> + <!-- Search & Filter --> + <div class="row justify-content-center"> + <div class="col-md-8 col-lg-6"> + <div class="input-group mb-3"> + <span class="input-group-text bg-dark border-secondary text-light"> + <i class="bi bi-search"> + </i> + </span> + <input class="form-control" id="searchInput" placeholder="Search for maxims, meanings, or branches..." type="text"/> + </div> + </div> + </div> + <!-- Navigation --> + <div class="d-flex justify-content-center gap-2 flex-wrap"> + <a class="btn btn-outline-light btn-sm" href="#usa"> + <i class="bi bi-flag-fill me-1"> + </i> + United States + </a> + <a class="btn btn-outline-light btn-sm" href="#international"> + <i class="bi bi-globe me-1"> + </i> + International + </a> + <a class="btn btn-outline-light btn-sm" href="#murphy"> + <i class="bi bi-exclamation-triangle-fill me-1"> + </i> + Murphy's Laws + </a> + <a class="btn btn-outline-light btn-sm" href="#strategy"> + <i class="bi bi-book-half me-1"> + </i> + Strategy + </a> + </div> + </div> + </header> + <div class="container pb-5"> + <!-- SECTION: UNITED STATES --> + <div class="mb-5" id="usa"> + <div class="section-header"> + <h2 class="text-light"> + <i class="bi bi-flag text-danger"> + </i> + United States Service Branches + </h2> + </div> + <div class="row g-4"> + <!-- SPECIAL OPERATIONS / NAVY --> + <div class="col-md-6 col-lg-4 quote-item" data-tags="navy seal cqb specops usa"> + <div class="card quote-card border-navy"> + <div class="card-body"> + <span class="badge bg-primary badge-branch"> + <i class="bi bi-water"> + </i> + Navy / SOF + </span> + <div class="quote-text"> + "Slow is smooth, smooth is fast." + </div> + <p class="quote-meaning"> + Rushing leads to mistakes. Deliberate, perfect execution eliminates wasted movement, ultimately resulting in the fastest speed. + </p> + <button class="copy-btn" title="Copy"> + <i class="bi bi-clipboard"> + </i> + </button> + </div> + </div> + </div> + <div class="col-md-6 col-lg-4 quote-item" data-tags="navy seal resilience usa"> + <div class="card quote-card border-navy"> + <div class="card-body"> + <span class="badge bg-primary badge-branch"> + <i class="bi bi-water"> + </i> + Navy SEALs + </span> + <div class="quote-text"> + "The only easy day was yesterday." + </div> + <p class="quote-meaning"> + Expect challenges to increase. Emphasizes constant self-improvement and resilience. + </p> + <button class="copy-btn" title="Copy"> + <i class="bi bi-clipboard"> + </i> + </button> + </div> + </div> + </div> + <div class="col-md-6 col-lg-4 quote-item" data-tags="navy seal preparedness usa"> + <div class="card quote-card border-navy"> + <div class="card-body"> + <span class="badge bg-primary badge-branch"> + <i class="bi bi-water"> + </i> + Navy / Tactical + </span> + <div class="quote-text"> + "Two is one, and one is none." + </div> + <p class="quote-meaning"> + Redundancy is life. If you have only one critical item and it breaks, you have zero. + </p> + <button class="copy-btn" title="Copy"> + <i class="bi bi-clipboard"> + </i> + </button> + </div> + </div> + </div> + <!-- USMC --> + <div class="col-md-6 col-lg-4 quote-item" data-tags="marines usmc pain usa"> + <div class="card quote-card border-usmc"> + <div class="card-body"> + <span class="badge bg-danger badge-branch"> + <i class="bi bi-shield-fill"> + </i> + USMC + </span> + <div class="quote-text"> + "Pain is weakness leaving the body." + </div> + <p class="quote-meaning"> + Physical suffering during training is a necessary process of becoming stronger. + </p> + <button class="copy-btn" title="Copy"> + <i class="bi bi-clipboard"> + </i> + </button> + </div> + </div> + </div> + <div class="col-md-6 col-lg-4 quote-item" data-tags="marines usmc rules mattis usa"> + <div class="card quote-card border-usmc"> + <div class="card-body"> + <span class="badge bg-danger badge-branch"> + <i class="bi bi-shield-fill"> + </i> + USMC + </span> + <div class="quote-text"> + "Be polite, be professional, but have a plan to kill everyone you meet." + </div> + <p class="quote-meaning"> + Attributed to Gen. Mattis. Maintain courtesy but never drop your tactical guard or situational awareness. + </p> + <button class="copy-btn" title="Copy"> + <i class="bi bi-clipboard"> + </i> + </button> + </div> + </div> + </div> + <!-- ARMY / JOINT --> + <div class="col-md-6 col-lg-4 quote-item" data-tags="army joint stoicism usa"> + <div class="card quote-card border-army"> + <div class="card-body"> + <span class="badge bg-success badge-branch"> + <i class="bi bi-person-badge"> + </i> + Army / Joint + </span> + <div class="quote-text"> + "Embrace the suck." + </div> + <p class="quote-meaning"> + A stoic acceptance of miserable conditions. Stop complaining and mentally accept the hardship to get the job done. + </p> + <button class="copy-btn" title="Copy"> + <i class="bi bi-clipboard"> + </i> + </button> + </div> + </div> + </div> + <div class="col-md-6 col-lg-4 quote-item" data-tags="army safety awareness usa"> + <div class="card quote-card border-army"> + <div class="card-body"> + <span class="badge bg-success badge-branch"> + <i class="bi bi-person-badge"> + </i> + Army / FOB + </span> + <div class="quote-text"> + "Complacency kills." + </div> + <p class="quote-meaning"> + Relaxing after routine repetition leads to missed danger indicators and death. + </p> + <button class="copy-btn" title="Copy"> + <i class="bi bi-clipboard"> + </i> + </button> + </div> + </div> + </div> + <div class="col-md-6 col-lg-4 quote-item" data-tags="army tactical movement usa"> + <div class="card quote-card border-army"> + <div class="card-body"> + <span class="badge bg-success badge-branch"> + <i class="bi bi-person-badge"> + </i> + Army / Tactical + </span> + <div class="quote-text"> + "Get off the X." + </div> + <p class="quote-meaning"> + The point of attack (ambush/explosion) is "The X". You must move immediately to survive; never remain static in the kill zone. + </p> + <button class="copy-btn" title="Copy"> + <i class="bi bi-clipboard"> + </i> + </button> + </div> + </div> + </div> + <!-- AIR FORCE / AVIATION --> + <div class="col-md-6 col-lg-4 quote-item" data-tags="air force aviation speed usa"> + <div class="card quote-card border-af"> + <div class="card-body"> + <span class="badge bg-info text-dark badge-branch"> + <i class="bi bi-airplane-fill"> + </i> + Aviation + </span> + <div class="quote-text"> + "Speed is life." + </div> + <p class="quote-meaning"> + Kinetic energy allows you to maneuver, attack, or escape. Being slow makes you a target. + </p> + <button class="copy-btn" title="Copy"> + <i class="bi bi-clipboard"> + </i> + </button> + </div> + </div> + </div> + <div class="col-md-6 col-lg-4 quote-item" data-tags="air force aviation awareness usa"> + <div class="card quote-card border-af"> + <div class="card-body"> + <span class="badge bg-info text-dark badge-branch"> + <i class="bi bi-airplane-fill"> + </i> + Aviation + </span> + <div class="quote-text"> + "Check six." + </div> + <p class="quote-meaning"> + Check your 6 o'clock position (directly behind you). Watch your blind spot. + </p> + <button class="copy-btn" title="Copy"> + <i class="bi bi-clipboard"> + </i> + </button> + </div> + </div> + </div> + </div> + </div> + <!-- SECTION: INTERNATIONAL --> + <div class="mb-5" id="international"> + <div class="section-header"> + <h2 class="text-light"> + <i class="bi bi-globe-americas text-primary"> + </i> + International Wisdom + </h2> + </div> + <div class="row g-4"> + <!-- UK --> + <div class="col-md-6 col-lg-4 quote-item" data-tags="uk sas british special forces"> + <div class="card quote-card border-intl"> + <div class="card-body"> + <span class="badge bg-secondary badge-branch"> + ๐ฌ๐ง UK SAS + </span> + <div class="quote-text"> + "Who Dares Wins." + </div> + <p class="quote-meaning"> + Success favors those willing to take the highest calculated risks. + </p> + <button class="copy-btn" title="Copy"> + <i class="bi bi-clipboard"> + </i> + </button> + </div> + </div> + </div> + <div class="col-md-6 col-lg-4 quote-item" data-tags="uk british preparation"> + <div class="card quote-card border-intl"> + <div class="card-body"> + <span class="badge bg-secondary badge-branch"> + ๐ฌ๐ง British Army + </span> + <div class="quote-text"> + "Time spent in reconnaissance is seldom wasted." + </div> + <p class="quote-meaning"> + Never rush into an attack without knowing what is ahead. Information is ammo. + </p> + <button class="copy-btn" title="Copy"> + <i class="bi bi-clipboard"> + </i> + </button> + </div> + </div> + </div> + <!-- ISRAEL --> + <div class="col-md-6 col-lg-4 quote-item" data-tags="israel idf leadership"> + <div class="card quote-card border-intl"> + <div class="card-body"> + <span class="badge bg-secondary badge-branch"> + ๐ฎ๐ฑ Israel (IDF) + </span> + <div class="quote-text"> + "Aharai!" (Follow me!) + </div> + <p class="quote-meaning"> + Officers do not order men forward from the rear; they cross the line first and expect men to follow. + </p> + <button class="copy-btn" title="Copy"> + <i class="bi bi-clipboard"> + </i> + </button> + </div> + </div> + </div> + <div class="col-md-6 col-lg-4 quote-item" data-tags="israel idf training"> + <div class="card quote-card border-intl"> + <div class="card-body"> + <span class="badge bg-secondary badge-branch"> + ๐ฎ๐ฑ Israel (IDF) + </span> + <div class="quote-text"> + "Hard in training, easy in battle." + </div> + <p class="quote-meaning"> + Also attributed to Russian Gen. Suvorov. Rigorous preparation makes actual combat manageable. + </p> + <button class="copy-btn" title="Copy"> + <i class="bi bi-clipboard"> + </i> + </button> + </div> + </div> + </div> + <!-- GERMANY --> + <div class="col-md-6 col-lg-4 quote-item" data-tags="germany blitzkrieg force"> + <div class="card quote-card border-intl"> + <div class="card-body"> + <span class="badge bg-secondary badge-branch"> + ๐ฉ๐ช Germany + </span> + <div class="quote-text"> + "Klotzen, nicht kleckern." + </div> + <p class="quote-meaning"> + "Boot 'em, don't spatter 'em." Use maximum concentrated force to smash the enemy rather than poking with small units. + </p> + <button class="copy-btn" title="Copy"> + <i class="bi bi-clipboard"> + </i> + </button> + </div> + </div> + </div> + <div class="col-md-6 col-lg-4 quote-item" data-tags="germany staff reporting"> + <div class="card quote-card border-intl"> + <div class="card-body"> + <span class="badge bg-secondary badge-branch"> + ๐ฉ๐ช Germany + </span> + <div class="quote-text"> + "Melden macht frei." + </div> + <p class="quote-meaning"> + "Reporting makes you free." Reporting a situation shifts the burden of decision-making to the superior. + </p> + <button class="copy-btn" title="Copy"> + <i class="bi bi-clipboard"> + </i> + </button> + </div> + </div> + </div> + <!-- FRANCE --> + <div class="col-md-6 col-lg-4 quote-item" data-tags="france legion loyalty"> + <div class="card quote-card border-intl"> + <div class="card-body"> + <span class="badge bg-secondary badge-branch"> + ๐ซ๐ท Foreign Legion + </span> + <div class="quote-text"> + "Legio Patria Nostra." + </div> + <p class="quote-meaning"> + "The Legion is our Fatherland." Legionnaires cut ties with their old nations; their loyalty is solely to the unit. + </p> + <button class="copy-btn" title="Copy"> + <i class="bi bi-clipboard"> + </i> + </button> + </div> + </div> + </div> + <!-- RUSSIA --> + <div class="col-md-6 col-lg-4 quote-item" data-tags="russia aggression suvorov"> + <div class="card quote-card border-intl"> + <div class="card-body"> + <span class="badge bg-secondary badge-branch"> + ๐ท๐บ Russia + </span> + <div class="quote-text"> + "The bullet is a fool, the bayonet is a fine chap." + </div> + <p class="quote-meaning"> + Suvorov's maxim. Firepower is unreliable; aggressive will to close with the enemy is decisive. + </p> + <button class="copy-btn" title="Copy"> + <i class="bi bi-clipboard"> + </i> + </button> + </div> + </div> + </div> + <!-- FINLAND --> + <div class="col-md-6 col-lg-4 quote-item" data-tags="finland grit resilience"> + <div class="card quote-card border-intl"> + <div class="card-body"> + <span class="badge bg-secondary badge-branch"> + ๐ซ๐ฎ Finland + </span> + <div class="quote-text"> + "Sisu" + </div> + <p class="quote-meaning"> + Grim, gritty determination. Fighting against overwhelming odds after your reserves are depleted. + </p> + <button class="copy-btn" title="Copy"> + <i class="bi bi-clipboard"> + </i> + </button> + </div> + </div> + </div> + <!-- CHINA --> + <div class="col-md-6 col-lg-4 quote-item" data-tags="china sun tzu deception"> + <div class="card quote-card border-intl"> + <div class="card-body"> + <span class="badge bg-secondary badge-branch"> + ๐จ๐ณ China (Sun Tzu) + </span> + <div class="quote-text"> + "Appear weak when you are strong, and strong when you are weak." + </div> + <p class="quote-meaning"> + Deception is the essence of warfare. Never let the enemy know your true capability. + </p> + <button class="copy-btn" title="Copy"> + <i class="bi bi-clipboard"> + </i> + </button> + </div> + </div> + </div> + </div> + </div> + <!-- SECTION: MURPHY'S LAWS & HUMOR --> + <div class="mb-5" id="murphy"> + <div class="section-header"> + <h2 class="text-light"> + <i class="bi bi-exclamation-triangle text-warning"> + </i> + Murphy's Laws of Combat + </h2> + </div> + <div class="row g-3"> + <div class="col-lg-6 quote-item" data-tags="murphy chaos humor"> + <div class="list-group"> + <div class="list-group-item bg-dark text-light border-secondary"> + <div class="d-flex w-100 justify-content-between"> + <h5 class="mb-1 text-warning"> + First Contact + </h5> + </div> + <p class="mb-1"> + "No plan survives first contact with the enemy." + </p> + <small class="text-muted"> + Variation of von Moltke. + </small> + </div> + <div class="list-group-item bg-dark text-light border-secondary"> + <h5 class="mb-1 text-warning"> + Friendly Fire + </h5> + <p class="mb-1"> + "Friendly fire isn't." + </p> + <small class="text-muted"> + And incoming fire has the right of way. + </small> + </div> + <div class="list-group-item bg-dark text-light border-secondary"> + <h5 class="mb-1 text-warning"> + Visibility + </h5> + <p class="mb-1"> + "Tracers work both ways." + </p> + <small class="text-muted"> + If you can see them, they can see you. + </small> + </div> + <div class="list-group-item bg-dark text-light border-secondary"> + <h5 class="mb-1 text-warning"> + Innovation + </h5> + <p class="mb-1"> + "If itโs stupid but it works, it isnโt stupid." + </p> + </div> + </div> + </div> + <div class="col-lg-6 quote-item" data-tags="rules gunfighting humor"> + <div class="list-group"> + <div class="list-group-item bg-dark text-light border-secondary"> + <h5 class="mb-1 text-info"> + Rules of Gunfighting #1 + </h5> + <p class="mb-1"> + "Bring a gun. Preferably two. Bring all your friends who have guns." + </p> + </div> + <div class="list-group-item bg-dark text-light border-secondary"> + <h5 class="mb-1 text-info"> + Rules of Gunfighting #2 + </h5> + <p class="mb-1"> + "Anything worth shooting is worth shooting twice." + </p> + </div> + <div class="list-group-item bg-dark text-light border-secondary"> + <h5 class="mb-1 text-info"> + Rules of Gunfighting #3 + </h5> + <p class="mb-1"> + "If you are not shooting, you should be communicating or reloading." + </p> + </div> + <div class="list-group-item bg-dark text-light border-secondary"> + <h5 class="mb-1 text-info"> + Aviation Wisdom + </h5> + <p class="mb-1"> + "There are old pilots and there are bold pilots, but there are no old, bold pilots." + </p> + </div> + </div> + </div> + </div> + </div> + <!-- SECTION: STRATEGY & ANCIENT --> + <div class="mb-5" id="strategy"> + <div class="section-header"> + <h2 class="text-light"> + <i class="bi bi-bank2 text-secondary"> + </i> + Strategic & Ancient Wisdom + </h2> + </div> + <div class="row g-4"> + <div class="col-md-4 quote-item" data-tags="sparta ancient greek"> + <div class="card quote-card border-intl"> + <div class="card-body"> + <span class="badge bg-secondary badge-branch"> + ๐๏ธ Sparta + </span> + <div class="quote-text"> + "Molon Labe." + </div> + <p class="quote-meaning"> + "Come and take them." King Leonidas' reply to the demand to surrender arms. + </p> + </div> + </div> + </div> + <div class="col-md-4 quote-item" data-tags="napoleon logistics food"> + <div class="card quote-card border-intl"> + <div class="card-body"> + <span class="badge bg-secondary badge-branch"> + ๐ซ๐ท Napoleon + </span> + <div class="quote-text"> + "An army marches on its stomach." + </div> + <p class="quote-meaning"> + Logistics dictates strategy. Without food/fuel, the army cannot move. + </p> + </div> + </div> + </div> + <div class="col-md-4 quote-item" data-tags="musashi japan focus"> + <div class="card quote-card border-intl"> + <div class="card-body"> + <span class="badge bg-secondary badge-branch"> + ๐ฏ๐ต Musashi + </span> + <div class="quote-text"> + "Do nothing which is of no use." + </div> + <p class="quote-meaning"> + Efficiency is paramount. Any action not contributing to victory creates an opening for the enemy. + </p> + </div> + </div> + </div> + </div> + </div> + </div> + <!-- FOOTER --> + <footer class="bg-black text-center py-4 border-top border-secondary"> + <div class="container"> + <p class="text-muted mb-0"> + Designed for Educational & Historical Reference. + </p> + <small class="text-secondary"> + David Veksler Cheatsheets ยฉ 2026 + </small> + </div> + </footer> + <!-- SCRIPTS --> + <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"> + </script> + <script> + // Search Functionality + document.getElementById('searchInput').addEventListener('keyup', function() { + const searchText = this.value.toLowerCase(); + const quotes = document.querySelectorAll('.quote-item'); + + quotes.forEach(quote => { + const text = quote.innerText.toLowerCase(); + const tags = quote.getAttribute('data-tags') || ''; + + if (text.includes(searchText) || tags.includes(searchText)) { + quote.style.display = ''; + } else { + quote.style.display = 'none'; + } + }); + }); + + // Copy to Clipboard + document.querySelectorAll('.copy-btn').forEach(btn => { + btn.addEventListener('click', function() { + const cardBody = this.closest('.card-body'); + const quoteText = cardBody.querySelector('.quote-text').innerText; + const quoteMeaning = cardBody.querySelector('.quote-meaning').innerText; + const fullText = `${quoteText}\n\nMeaning: ${quoteMeaning}`; + + navigator.clipboard.writeText(fullText).then(() => { + const originalIcon = this.innerHTML; + this.innerHTML = '<i class="bi bi-check2 text-success"></i>'; + setTimeout(() => { + this.innerHTML = originalIcon; + }, 2000); + }); + }); + }); + </script> + </body> +</html>