From e6206a94cf17a6b77386a59f64f619355e2aaadf Mon Sep 17 00:00:00 2001 From: Samuel McCann Date: Fri, 5 Jun 2026 11:17:53 +0000 Subject: [PATCH] wip: new site files --- arcade.html | 233 ++++++++++++ board-games.html | 232 ++++++++++++ book-now/arcade.html | 200 +++++++++++ book-now/dnd.html | 182 ++++++++++ book-now/index.html | 139 ++++++++ book-now/table-games.html | 198 ++++++++++ css/style.css | 733 ++++++++++++++++++++++++++++++++++++++ events.html | 389 ++++++++++++++++++++ find-us.html | 204 +++++++++++ index.html | 237 ++++++++++++ js/main.js | 73 ++++ 11 files changed, 2820 insertions(+) create mode 100644 arcade.html create mode 100644 board-games.html create mode 100644 book-now/arcade.html create mode 100644 book-now/dnd.html create mode 100644 book-now/index.html create mode 100644 book-now/table-games.html create mode 100644 css/style.css create mode 100644 events.html create mode 100644 find-us.html create mode 100644 index.html create mode 100644 js/main.js diff --git a/arcade.html b/arcade.html new file mode 100644 index 0000000..4d4dcfd --- /dev/null +++ b/arcade.html @@ -0,0 +1,233 @@ + + + + + +Retro Arcade — The Fat Dragon + + + + + + + + + +
+
+ Retro Arcade +

🕹ī¸ Play Against Friends and Rivals

+

+ Relive the golden age of gaming with our hand-picked collection of classic arcade + cabinets. Challenge friends head-to-head or prove yourself against the machine. +

+
+
+ + +
+
+
+
+
+
+
FAT DRAGON
+
Arcade · Est. 2026
+
Insert Coin to Continue
+
+
+
+
+
+
+
+
+
+
+
+ Our Cabinets +

The Golden Age Lives On

+

+ Every machine in our collection is a hand-picked classic, lovingly restored + and ready to play. From legendary fighting games to timeless shoot-'em-ups, + the high score board is waiting for your name. +

+
+ Mortal Kombat II + Mortal Kombat III + Street Fighter II + Street Fighter III + Time Crisis + Marvel vs. Capcom + Pac-Man + Space Invaders +
+
+
+
+
+ + +
+
+
+ Fighting Games +

Head-to-Head Combat

+

+ Our fighting game lineup is the beating heart of the arcade. Gather a crowd, + run a tournament, or just grind your way up the leaderboard. +

+
+
+ +
+
đŸĨŠ
+
Mortal Kombat II & III
+

+ The defining fighting series of the 90s. Finish him. High-score leaderboard active on both cabinets. +

+
+ +
+
đŸĨ‹
+
Street Fighter II & III
+

+ Hadouken your way to glory. Weekly ranked tournaments on the second Saturday of every month. +

+
+ +
+
⚡
+
Marvel vs. Capcom
+

+ Superheroes meet Street Warriors. The ultimate tag-team brawler — assemble your squad. +

+
+ +
+
+
+ + +
+
+
+
+
+ 👾 + Timeless Classics +
+
+
+ Classic Cabinets +

Timeless Classics

+

+ Between the fighting game sessions, kick back with the games that started it all. + These cabinets have history — and now they have a home. +

+
    +
  • + đŸ”Ģ +
    +
    Time Crisis
    +
    Light-gun classic. Cover system, reload under pressure.
    +
    +
    • +
  • + 🟡 +
    +
    Pac-Man
    +
    The icon. Chomping dots since 1980. Your gran can play this.
    +
    +
    • +
  • + 🚀 +
    +
    Space Invaders
    +
    Defend Earth. Perpetually. Can you outlast the swarm?
    +
    +
    • +
+
+
+
+
+ + +
+
+ Tournaments +

Retro Arcade Tournaments

+

+ Every second Saturday: 12 players, single-elimination brackets, Street Fighter and + Mortal Kombat alternating by week. Doors open at 9 AM, first match at 9:30 AM. +

+
+ View Tournament Schedule + Book a Machine → +
+
+
+ + + + + + diff --git a/board-games.html b/board-games.html new file mode 100644 index 0000000..bbb2fec --- /dev/null +++ b/board-games.html @@ -0,0 +1,232 @@ + + + + + +Board & Card Games — The Fat Dragon + + + + + + + + + +
+
+ Board & Card Games +

🎲 Gather Around the Table

+

+ Our goal is to provide a space for social and competitive board game play. + Bring some friends, or join a scheduled game — everyone is welcome at the table. +

+
+
+ + +
+
+
+
+ Strategy Games +

Think Three Moves Ahead

+

+ From the rolling hills of Catan to the treacherous politics of Dune, our strategy + library rewards cunning, planning, and just the right amount of betrayal. +

+
+ +
+ 🌾 +
+
Catan
+
Settle. Trade. Build. 3-4 players. Classic gateway strategy.
+
+
+ +
+ 🚂 +
+
Ticket to Ride
+
Claim routes across Europe. 2-5 players. Easy to learn, hard to master.
+
+
+ +
+ 🏘ī¸ +
+
Village
+
Build a legacy across generations. 2-4 players. Spiel des Jahres winner.
+
+
+ +
+ 🏜ī¸ +
+
Dune
+
Control the spice. Control the universe. 2-6 players. Epic political warfare.
+
+
+ +
+
+
+
+ ♟ī¸ + Strategy Games +
+
+
+
+
+ + +
+
+
+
+
+ 🃏 + Tabletop Card Games +
+
+
+ Tabletop Card Games +

Build Your Deck. Rule the Table.

+

+ Whether you’re a seasoned planeswalker or just opening your first booster pack, + there’s a table for you. Casual play every day; tournaments on the third Saturday of each month. +

+ +
+ +
+ ⚔ī¸ +
+
Magic: The Gathering
+
Commander, Standard, Draft. Bring your deck or borrow one of ours. Monthly unofficial tournaments.
+
+
+ +
+ ⚡ +
+
Pokémon TCG
+
Standard and casual formats. Great for all ages. Monthly tournaments alternating with MTG.
+
+
+ +
+ 🌀 +
+
Yu-Gi-Oh!
+
Casual dueling always welcome. Competitive play for those who dare.
+
+
+ +
+
+
+
+
+ + +
+
+
+ Dungeons & Dragons +

Roll for Initiative

+

+ D&D sessions are available to book right now — even before we open our doors. + Fridays 6–10 PM, Saturdays 5–9 PM, and Sundays 2–6 PM. + Max 4 players per session. +

+
+ Fridays 6 PM – 10 PM + Saturdays 5 PM – 9 PM + Sundays 2 PM – 6 PM + Max 4 Players + Dunshaughlin + Ratoath + Ashbourne + Finglas North +
+ ⚔ī¸ Book a D&D Session → +
+
+
+ + +
+
+
+

Ready to Play?

+

Book a table for board games, card games, and casual play. Opening July 2026.

+ Book a Table → +
+
+
+ + + + + + diff --git a/book-now/arcade.html b/book-now/arcade.html new file mode 100644 index 0000000..6120138 --- /dev/null +++ b/book-now/arcade.html @@ -0,0 +1,200 @@ + + + + + +Book the Arcade — The Fat Dragon + + + + + + + + + +
+
+ Retro Arcade +

🕹ī¸ Reserve a Machine

+

Step back into the golden age of arcade gaming. Opens July 2026.

+
+
+ +
+
+
+ +
+ + Opens July 2026 + +

Reserve Your Cabinet

+

+ Reserve a machine and step back into the golden age of arcade gaming. + Choose your game, pick your session length, and bring your rivals. +

+
    +
  • Available daily from July 2026
    • +
  • 30-minute and 1-hour sessions
    • +
  • Up to 8 guests per booking
    • +
  • All cabinets included in booking
    • +
+
+
Available Cabinets
+
+ Mortal Kombat II + Mortal Kombat III + Street Fighter II + Street Fighter III + Time Crisis + Marvel vs. Capcom + Pac-Man + Space Invaders +
+
+
+ +
+

Request a Booking

+
+
+ + +
+
+ + +
+
+
+ + +
+
+ + +
+
+
+
+ + +
+
+ + +
+
+ +
+ +
+
🕹ī¸
+

Booking Request Sent!

+

We’ll confirm your arcade session within 24 hours. Insert coin — you’re in.

+
+ +

+ Booking requests open now; sessions begin July 2026. + Questions? hello@denofdragons.com +

+
+ +
+
+
+ + + + + + diff --git a/book-now/dnd.html b/book-now/dnd.html new file mode 100644 index 0000000..6298f66 --- /dev/null +++ b/book-now/dnd.html @@ -0,0 +1,182 @@ + + + + + +Book a D&D Session — The Fat Dragon + + + + + + + + + +
+
+ D&D Sessions +

⚔ī¸ Book a D&D Session

+

Dungeons & Dragons sessions available now, before we even open our doors. Roll for initiative.

+
+
+ +
+
+
+ +
+ Session Details +

Everything You Need to Know

+

+ Book a D&D session with us. Sessions run across multiple locations with an experienced + Dungeon Master. Perfect for beginners and veterans alike — max 4 players per night. +

+
    +
  • Fridays: 6:00 PM – 10:00 PM
    • +
  • Saturdays: 5:00 PM – 9:00 PM
    • +
  • Sundays: 2:00 PM – 6:00 PM
    • +
  • Max 4 players per session
    • +
  • Dice and character sheets provided
    • +
  • All experience levels welcome
    • +
+
+
Available Locations
+
+ Dunshaughlin + Ratoath + Ashbourne + Finglas North +
+
+
+ +
+

Request a Booking

+
+
+ + +
+
+ + +
+
+
+ + +
+
+ + +
+
+
+
+ + +
+
+ + +
+
+ +
+ +
+
🐉
+

Booking Request Sent!

+

We’ll be in touch within 24 hours to confirm your session details. Roll for initiative!

+
+ +

+ This is a booking request. We’ll confirm via email within 24 hours. + Questions? hello@denofdragons.com +

+
+ +
+
+
+ + + + + + diff --git a/book-now/index.html b/book-now/index.html new file mode 100644 index 0000000..bd7fbbd --- /dev/null +++ b/book-now/index.html @@ -0,0 +1,139 @@ + + + + + +Book Now — The Fat Dragon + + + + + + + + + +
+
+ Bookings +

Book Your Experience

+

+ D&D sessions are available to book right now. Arcade and tabletop bookings open at our July 2026 launch. +

+
+
+ +
+
+
+ + +
⚔ī¸
+
D&D Sessions
+

+ Book a Dungeons & Dragons session. Fridays, Saturdays, and Sundays. + Up to 4 players per night. Multiple locations available. +

+ Bookings Open Now + + + +
🕹ī¸
+
Retro Arcade
+

+ Reserve a machine and step back into the golden age of arcade gaming. + 30 min or 1 hour sessions, up to 8 guests. +

+ Opens July 2026 + + + +
🎲
+
Table Top Games
+

+ Book a table for board games, card games, and casual play. + Bring your group, or join a public session. +

+ Opens July 2026 + + +
+
+
+ +
+
+ Questions? +

Get in Touch

+

+ Not sure which booking is right for you? Drop us a message and we’ll help you out. +

+
+ ✉ī¸ hello@denofdragons.com + 📞 089 940 9075 +
+
+
+ + + + + + diff --git a/book-now/table-games.html b/book-now/table-games.html new file mode 100644 index 0000000..1430690 --- /dev/null +++ b/book-now/table-games.html @@ -0,0 +1,198 @@ + + + + + +Book a Table — The Fat Dragon + + + + + + + + + +
+
+ Table Top Games +

🎲 Book a Table

+

Book a table for board games, card games, and casual play. Opens July 2026.

+
+
+ +
+
+
+ +
+ + Opens July 2026 + +

Gather Around the Table

+

+ Book a table for board games, card games, and casual play. Bring some friends or + join a public session — we’ll find a spot for everyone. +

+
    +
  • Available daily from July 2026
    • +
  • 30-minute and 1-hour sessions
    • +
  • Up to 8 guests per booking
    • +
  • Full game library included
    • +
  • Rules explanation available on request
    • +
+
+
What’s Available
+
+ Catan + Ticket to Ride + Village + Dune + Magic: The Gathering + Pokémon TCG + Yu-Gi-Oh! +
+
+
+ +
+

Request a Booking

+
+
+ + +
+
+ + +
+
+
+ + +
+
+ + +
+
+
+
+ + +
+
+ + +
+
+ +
+ +
+
🎲
+

Booking Request Sent!

+

We’ll confirm your table within 24 hours. Time to roll some dice.

+
+ +

+ Booking requests open now; sessions begin July 2026. + Questions? hello@denofdragons.com +

+
+ +
+
+
+ + + + + + diff --git a/css/style.css b/css/style.css new file mode 100644 index 0000000..afa4583 --- /dev/null +++ b/css/style.css @@ -0,0 +1,733 @@ +/* ── RESET ──────────────────────────────────────────── */ +*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } +img { display: block; max-width: 100%; } +a { color: inherit; } +button, input, select, textarea { + font-family: inherit; font-size: inherit; color: inherit; + background: none; border: none; outline: none; +} + +/* ── TOKENS ─────────────────────────────────────────── */ +:root { + --bg: #0c0a08; + --bg-2: #131008; + --bg-card: #1c1710; + --bg-form: #221c14; + --border: #2e2418; + --border-lt: #3e3428; + --gold: #d4900a; + --gold-lt: #f0b428; + --gold-dk: #9a6a08; + --gold-glow: rgba(212,144,10,.18); + --crimson: #b83020; + --amber: #e07818; + --text: #ede8e2; + --text-2: #c0b8ae; + --muted: #8a8078; + --radius: 6px; + --radius-lg: 10px; + --shadow: 0 4px 24px rgba(0,0,0,.5); + --font-brand: 'Cinzel Decorative', serif; + --font-ui: 'Orbitron', monospace; + --font-body: 'Inter', system-ui, sans-serif; + --nav-h: 64px; +} + +/* ── BASE ────────────────────────────────────────────── */ +html { scroll-behavior: smooth; } +body { + background: var(--bg); + color: var(--text); + font-family: var(--font-body); + font-size: 1rem; + line-height: 1.65; + overflow-x: hidden; +} + +/* ── TYPOGRAPHY ─────────────────────────────────────── */ +h1, h2, h3 { line-height: 1.2; } +.brand-font { font-family: var(--font-brand); } +.ui-font { font-family: var(--font-ui); } + +.label { + font-family: var(--font-ui); + font-size: .6rem; letter-spacing: .3em; text-transform: uppercase; + color: var(--gold); display: block; margin-bottom: .5rem; +} + +.page-title { + font-family: var(--font-brand); + font-size: clamp(1.8rem, 5vw, 3rem); + color: var(--text); +} + +.section-title { + font-family: var(--font-brand); + font-size: clamp(1.5rem, 3.5vw, 2.4rem); + color: var(--text); + margin-bottom: .75rem; +} + +.section-desc { + color: var(--text-2); + font-size: .97rem; + line-height: 1.75; + max-width: 500px; +} + +/* ── LAYOUT ──────────────────────────────────────────── */ +.container { max-width: 1120px; margin: 0 auto; padding: 0 2rem; } +.section { padding: 5rem 2rem; } +.section--alt { background: var(--bg-2); } +.section--border { + border-top: 1px solid var(--border); + border-bottom: 1px solid var(--border); +} + +.two-col { + display: grid; + grid-template-columns: 1fr 1fr; + gap: 3.5rem; + align-items: center; +} +.two-col--reverse { direction: rtl; } +.two-col--reverse > * { direction: ltr; } + +/* ── NAV ─────────────────────────────────────────────── */ +.nav { + position: sticky; top: 0; z-index: 300; + height: var(--nav-h); + display: flex; align-items: center; justify-content: space-between; + padding: 0 2.5rem; + background: rgba(12,10,8,.88); + backdrop-filter: blur(16px); + border-bottom: 1px solid var(--border); +} + +.nav-logo { + text-decoration: none; + font-family: var(--font-brand); + font-size: .95rem; + color: var(--gold); + letter-spacing: .04em; + display: flex; align-items: center; gap: .5rem; + white-space: nowrap; +} +.nav-logo .dragon { font-size: 1.5rem; } + +.nav-links { + display: flex; align-items: center; gap: 2rem; + list-style: none; +} +.nav-links a { + text-decoration: none; + font-size: .78rem; font-weight: 500; + letter-spacing: .1em; text-transform: uppercase; + color: var(--text-2); + transition: color .18s; +} +.nav-links a:hover, +.nav-links a[aria-current="page"] { color: var(--gold); } + +.nav-right { + display: flex; align-items: center; gap: 1.25rem; +} + +.nav-find { + text-decoration: none; + font-size: .78rem; color: var(--muted); + transition: color .18s; +} +.nav-find:hover { color: var(--gold); } + +/* hamburger */ +.nav-toggle { + display: none; + flex-direction: column; gap: 5px; + cursor: pointer; padding: 4px; + background: none; border: none; +} +.nav-toggle span { + display: block; width: 22px; height: 2px; + background: var(--text-2); + transition: all .2s; +} +.nav-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); } +.nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; } +.nav-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); } + +/* ── BUTTONS ─────────────────────────────────────────── */ +.btn { + display: inline-flex; align-items: center; gap: .45rem; + padding: .7rem 1.5rem; border-radius: var(--radius); + font-size: .82rem; font-weight: 600; + letter-spacing: .08em; text-transform: uppercase; + text-decoration: none; cursor: pointer; + transition: all .2s; +} +.btn-gold { + background: var(--gold); color: #000; +} +.btn-gold:hover { + background: var(--gold-lt); + transform: translateY(-2px); + box-shadow: 0 6px 20px rgba(212,144,10,.4); +} +.btn-outline { + background: transparent; color: var(--text); + border: 1px solid var(--border-lt); +} +.btn-outline:hover { + border-color: var(--gold); color: var(--gold); + transform: translateY(-2px); +} +.btn-sm { padding: .45rem 1rem; font-size: .75rem; } + +/* ── BADGE / PILL ────────────────────────────────────── */ +.badge { + display: inline-block; + font-family: var(--font-ui); + font-size: .58rem; letter-spacing: .25em; text-transform: uppercase; + padding: .3rem .9rem; border-radius: 3px; +} +.badge-gold { + background: rgba(212,144,10,.1); + border: 1px solid rgba(212,144,10,.35); + color: var(--gold); +} +.badge-purple { + background: rgba(109,40,217,.12); + border: 1px solid rgba(109,40,217,.35); + color: #b8a0f8; +} +.badge-red { + background: rgba(184,48,32,.12); + border: 1px solid rgba(184,48,32,.35); + color: #f08070; +} + +/* ── HERO ────────────────────────────────────────────── */ +.hero { + position: relative; + min-height: 100vh; + display: flex; align-items: center; justify-content: center; text-align: center; + padding: calc(var(--nav-h) + 4rem) 1.5rem 5rem; + overflow: hidden; +} + +.hero-bg { + position: absolute; inset: 0; z-index: 0; + background: + radial-gradient(ellipse 70% 50% at 50% 110%, rgba(109,40,217,.16) 0%, transparent 68%), + radial-gradient(ellipse 50% 40% at 10% 60%, rgba(184,48,32,.1) 0%, transparent 65%), + radial-gradient(ellipse 50% 40% at 90% 60%, rgba(212,144,10,.07) 0%, transparent 65%), + linear-gradient(180deg, #0c0a08 0%, #100e06 55%, #0c0a08 100%); +} +.hero-bg::after { + content: ''; + position: absolute; inset: 0; + background-image: + radial-gradient(circle, rgba(212,144,10,.5) 1px, transparent 1px), + radial-gradient(circle, rgba(212,144,10,.2) 1px, transparent 1px); + background-size: 52px 52px, 88px 88px; + background-position: 0 0, 26px 26px; + opacity: .1; + animation: drift 35s linear infinite; +} +@keyframes drift { to { transform: translateY(-80px); } } + +.hero-body { position: relative; z-index: 1; max-width: 820px; } + +.hero-icon { + font-size: 5rem; line-height: 1; display: block; + margin-bottom: 1rem; + filter: drop-shadow(0 0 24px rgba(212,144,10,.5)); + animation: glow 3.5s ease-in-out infinite; +} +@keyframes glow { + 0%,100% { filter: drop-shadow(0 0 18px rgba(212,144,10,.4)); } + 50% { filter: drop-shadow(0 0 44px rgba(212,144,10,.85)) drop-shadow(0 0 60px rgba(184,48,32,.3)); } +} + +.hero-title { + font-family: var(--font-brand); + font-size: clamp(2.5rem, 8vw, 5rem); + color: var(--gold); + text-shadow: 0 0 50px rgba(212,144,10,.3); + margin-bottom: .4rem; +} +.hero-place { + font-family: var(--font-ui); + font-size: clamp(.68rem, 1.6vw, .9rem); + color: var(--muted); + letter-spacing: .35em; text-transform: uppercase; + margin-bottom: 1.5rem; +} +.hero-copy { + font-size: 1.05rem; color: var(--text-2); + max-width: 540px; margin: 0 auto 1rem; + line-height: 1.8; +} +.hero-note { + display: inline-block; + font-size: .78rem; color: #b8a0f8; + border: 1px solid rgba(109,40,217,.35); + background: rgba(109,40,217,.1); + padding: .36rem 1rem; border-radius: 3px; + margin-bottom: 2.5rem; +} +.hero-ctas { + display: flex; flex-wrap: wrap; gap: .9rem; justify-content: center; +} + +/* ── PAGE HERO (subpages) ────────────────────────────── */ +.page-hero { + padding: calc(var(--nav-h) + 3rem) 2rem 3rem; + text-align: center; + background: + radial-gradient(ellipse 60% 60% at 50% 0%, rgba(212,144,10,.08) 0%, transparent 70%), + var(--bg); + border-bottom: 1px solid var(--border); +} +.page-hero .label { justify-content: center; display: flex; } +.page-hero .page-title { margin-bottom: .75rem; } +.page-hero .section-desc { margin: 0 auto; text-align: center; } + +/* ── GAME TAG ────────────────────────────────────────── */ +.tag-list { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1.5rem; } +.tag { + font-family: var(--font-ui); + font-size: .58rem; letter-spacing: .06em; + padding: .32rem .75rem; border-radius: 3px; + background: var(--bg-card); border: 1px solid var(--border); + color: var(--muted); + transition: border-color .18s, color .18s; +} +.tag:hover { border-color: var(--gold); color: var(--gold); } + +/* ── VISUAL PANELS ───────────────────────────────────── */ +.panel { + background: var(--bg-card); + border: 1px solid var(--border); + border-radius: var(--radius-lg); + overflow: hidden; +} + +/* arcade cabinet mock */ +.cabinet { + aspect-ratio: 3/4; + display: flex; flex-direction: column; +} +.cabinet-screen-wrap { + flex: 1; + background: linear-gradient(135deg, #100e06 0%, #1c1810 100%); + display: flex; align-items: center; justify-content: center; + padding: 2rem 1.5rem; +} +.cabinet-screen { + background: rgba(0,0,0,.7); + border: 2px solid var(--gold-dk); + border-radius: 4px; + padding: 1.5rem 2rem; + text-align: center; width: 100%; + box-shadow: 0 0 20px rgba(212,144,10,.15), inset 0 0 18px rgba(0,0,0,.4); +} +.screen-title { + font-family: var(--font-ui); + font-size: 1.3rem; letter-spacing: .2em; + color: var(--gold); + animation: pulse 2.2s ease-in-out infinite; + margin-bottom: .2rem; +} +@keyframes pulse { + 0%,100% { text-shadow: 0 0 6px var(--gold); } + 50% { text-shadow: 0 0 24px var(--gold), 0 0 46px rgba(212,144,10,.5); } +} +.screen-sub { + font-family: var(--font-ui); font-size: .5rem; + letter-spacing: .28em; text-transform: uppercase; + color: var(--crimson); margin-bottom: 1rem; +} +.screen-insert { + font-family: var(--font-ui); font-size: .48rem; + letter-spacing: .22em; text-transform: uppercase; + color: var(--muted); + animation: blink 1.3s step-end infinite; +} +@keyframes blink { 0%,100% { opacity:1; } 50% { opacity:0; } } +.cabinet-controls { + background: #1a1610; + border-top: 1px solid var(--border); + padding: .9rem 1.5rem; + display: flex; align-items: center; justify-content: center; gap: .6rem; +} +.stick { + width: 18px; height: 18px; border-radius: 50%; + background: #282218; border: 2px solid #383228; +} +.btn-ab { + width: 13px; height: 13px; border-radius: 50%; + border: 1px solid rgba(255,255,255,.15); +} + +/* board game visual */ +.board-visual { + aspect-ratio: 4/3; + display: flex; align-items: center; justify-content: center; + position: relative; overflow: hidden; +} +.board-visual::before { + content: ''; + position: absolute; inset: 0; + background: + radial-gradient(circle at 35% 35%, rgba(109,40,217,.12) 0%, transparent 60%), + radial-gradient(circle at 72% 72%, rgba(14,116,144,.08) 0%, transparent 60%); +} +.board-art { position: relative; z-index: 1; text-align: center; } +.board-art .icon { font-size: 4rem; display: block; margin-bottom: .5rem; } +.board-art .caption { + font-family: var(--font-ui); font-size: .58rem; + letter-spacing: .28em; text-transform: uppercase; + color: var(--muted); +} + +/* ── GAME CATEGORY CARDS ─────────────────────────────── */ +.game-cats { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-top: 1.5rem; } +.game-cat { + background: var(--bg-card); border: 1px solid var(--border); + border-radius: var(--radius); padding: 1rem 1.2rem; + transition: border-color .18s; +} +.game-cat:hover { border-color: var(--gold-glow); } +.cat-title { + font-family: var(--font-ui); font-size: .58rem; + letter-spacing: .2em; text-transform: uppercase; + color: var(--gold); margin-bottom: .6rem; +} +.cat-games { list-style: none; } +.cat-games li { + font-size: .87rem; color: var(--text-2); + padding: .18rem 0 .18rem 1rem; position: relative; +} +.cat-games li::before { + content: '▸'; position: absolute; left: 0; + color: var(--gold-dk); font-size: .65rem; + top: 50%; transform: translateY(-50%); +} + +/* ── EVENTS ──────────────────────────────────────────── */ +.events-intro { + text-align: center; max-width: 600px; margin: 0 auto 3.5rem; + color: var(--text-2); +} + +.month-group { margin-bottom: 3rem; } +.month-heading { + font-family: var(--font-ui); + font-size: .68rem; letter-spacing: .3em; text-transform: uppercase; + color: var(--gold); + padding-bottom: .75rem; + border-bottom: 1px solid var(--border); + margin-bottom: 1rem; +} + +.events-grid { display: grid; gap: .75rem; } + +.event-card { + background: var(--bg-card); border: 1px solid var(--border); + border-radius: var(--radius); overflow: hidden; + transition: border-color .2s; +} +.event-card:hover { border-color: var(--border-lt); } +.event-card.special { border-color: rgba(212,144,10,.3); } + +.event-summary { + display: grid; + grid-template-columns: 56px 1fr auto; + align-items: center; gap: 1rem; + padding: 1rem 1.25rem; + cursor: pointer; + user-select: none; +} +.event-date-box { + background: var(--bg-2); border: 1px solid var(--border); + border-radius: 4px; text-align: center; + padding: .4rem .2rem; +} +.event-date-box .day { + font-family: var(--font-ui); font-size: 1.3rem; + color: var(--gold); line-height: 1; display: block; +} +.event-date-box .weekday { + font-family: var(--font-ui); font-size: .48rem; + letter-spacing: .18em; text-transform: uppercase; + color: var(--muted); +} +.event-meta { min-width: 0; } +.event-name { + font-weight: 600; font-size: .95rem; + color: var(--text); margin-bottom: .15rem; + white-space: nowrap; overflow: hidden; text-overflow: ellipsis; +} +.event-time { + font-family: var(--font-ui); font-size: .58rem; + letter-spacing: .1em; color: var(--muted); +} +.event-chevron { + color: var(--muted); font-size: .75rem; + transition: transform .2s; + flex-shrink: 0; +} +.event-card.open .event-chevron { transform: rotate(180deg); } +.event-detail { + display: none; + padding: 0 1.25rem 1.25rem; + border-top: 1px solid var(--border); +} +.event-card.open .event-detail { display: block; } +.event-detail p { color: var(--text-2); font-size: .92rem; margin-bottom: .75rem; } +.event-detail .btn { margin-top: .5rem; } + +/* ── FIND US / MAP ───────────────────────────────────── */ +.find-grid { + display: grid; + grid-template-columns: 1fr 1fr; + gap: 3rem; + align-items: start; +} +.map-embed { + aspect-ratio: 4/3; + border-radius: var(--radius-lg); + overflow: hidden; + border: 1px solid var(--border); + background: var(--bg-card); +} +.map-embed iframe { width: 100%; height: 100%; border: none; } + +.info-block { margin-bottom: 2rem; } +.info-block .label { margin-bottom: .75rem; } +.hours-list { list-style: none; } +.hours-list li { + display: flex; justify-content: space-between; gap: 1rem; + font-size: .88rem; color: var(--text-2); + padding: .3rem 0; + border-bottom: 1px solid var(--border); +} +.hours-list li:last-child { border-bottom: none; } +.hours-list .day { color: var(--text); font-weight: 500; } +.contact-list { list-style: none; } +.contact-list li { + display: flex; align-items: center; gap: .65rem; + font-size: .9rem; color: var(--text-2); + padding: .35rem 0; +} +.contact-list a { text-decoration: none; transition: color .18s; } +.contact-list a:hover { color: var(--gold); } +.contact-icon { font-size: 1rem; flex-shrink: 0; } + +/* ── BOOKING HUB ─────────────────────────────────────── */ +.booking-cards { + display: grid; grid-template-columns: repeat(3, 1fr); + gap: 1.5rem; margin-top: 2.5rem; +} +.booking-card { + background: var(--bg-card); border: 1px solid var(--border); + border-radius: var(--radius-lg); padding: 2rem 1.75rem; + text-decoration: none; display: block; + transition: border-color .2s, transform .2s, box-shadow .2s; +} +.booking-card:hover { + border-color: var(--gold); + transform: translateY(-4px); + box-shadow: 0 10px 30px rgba(0,0,0,.4); +} +.booking-card .icon { font-size: 2.5rem; margin-bottom: 1rem; } +.booking-card .title { + font-family: var(--font-brand); font-size: 1.2rem; + color: var(--text); margin-bottom: .5rem; +} +.booking-card .desc { font-size: .88rem; color: var(--text-2); line-height: 1.6; } +.booking-card .avail { + display: inline-block; margin-top: 1rem; + font-family: var(--font-ui); font-size: .55rem; + letter-spacing: .2em; text-transform: uppercase; + padding: .25rem .75rem; border-radius: 3px; +} +.avail-open { background: rgba(34,197,94,.1); color: #4ade80; border: 1px solid rgba(34,197,94,.25); } +.avail-soon { background: rgba(212,144,10,.1); color: var(--gold); border: 1px solid rgba(212,144,10,.25); } + +/* ── FORMS ───────────────────────────────────────────── */ +.booking-layout { + display: grid; grid-template-columns: 1fr 1fr; + gap: 3rem; align-items: start; + max-width: 900px; margin: 0 auto; +} +.booking-info .label { margin-bottom: .5rem; } +.booking-info h2 { font-family: var(--font-brand); font-size: 1.6rem; color: var(--text); margin-bottom: .75rem; } +.booking-info p { color: var(--text-2); font-size: .93rem; line-height: 1.7; margin-bottom: 1rem; } +.booking-info .detail-list { list-style: none; } +.booking-info .detail-list li { + display: flex; align-items: center; gap: .6rem; + color: var(--text-2); font-size: .88rem; padding: .28rem 0; +} +.detail-list .dot { + width: 6px; height: 6px; border-radius: 50%; + background: var(--gold); flex-shrink: 0; +} + +.form-card { + background: var(--bg-form); + border: 1px solid var(--border); + border-radius: var(--radius-lg); + padding: 2rem; +} +.form-card h3 { + font-family: var(--font-brand); font-size: 1.1rem; + color: var(--text); margin-bottom: 1.5rem; + padding-bottom: .75rem; border-bottom: 1px solid var(--border); +} +.field { margin-bottom: 1.1rem; } +.field label { + display: block; + font-family: var(--font-ui); font-size: .58rem; + letter-spacing: .18em; text-transform: uppercase; + color: var(--muted); margin-bottom: .4rem; +} +.field input, +.field select { + width: 100%; + background: var(--bg-card); border: 1px solid var(--border); + border-radius: var(--radius); padding: .65rem .85rem; + color: var(--text); font-size: .9rem; + transition: border-color .18s; + appearance: none; + -webkit-appearance: none; +} +.field input:focus, +.field select:focus { border-color: var(--gold); } +.field input::placeholder { color: var(--muted); } + +.field-row { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; } + +.form-btn { + width: 100%; margin-top: .5rem; + background: var(--gold); color: #000; + padding: .8rem; border-radius: var(--radius); + font-size: .85rem; font-weight: 700; + letter-spacing: .1em; text-transform: uppercase; + cursor: pointer; + transition: background .18s, transform .1s; +} +.form-btn:hover { background: var(--gold-lt); transform: translateY(-1px); } + +.form-success { + display: none; + text-align: center; padding: 2rem 1rem; +} +.form-success .icon { font-size: 3rem; margin-bottom: 1rem; } +.form-success h3 { font-family: var(--font-brand); color: var(--gold); margin-bottom: .5rem; } +.form-success p { color: var(--text-2); font-size: .9rem; } + +/* ── FOOTER ──────────────────────────────────────────── */ +footer { + background: #080605; + border-top: 1px solid var(--border); + padding: 3.5rem 2rem 2rem; +} +.footer-inner { max-width: 1120px; margin: 0 auto; } +.footer-grid { + display: grid; + grid-template-columns: 2fr 1fr 1fr 1fr; + gap: 2.5rem; + margin-bottom: 2.5rem; +} +.footer-brand { + font-family: var(--font-brand); font-size: 1rem; + color: var(--gold); + display: flex; align-items: center; gap: .45rem; + margin-bottom: .6rem; +} +.footer-tagline { color: var(--muted); font-size: .85rem; line-height: 1.65; margin-bottom: 1rem; } +.footer-contact a, .footer-contact span { + display: flex; align-items: center; gap: .5rem; + color: var(--muted); font-size: .82rem; text-decoration: none; + margin-bottom: .35rem; transition: color .18s; +} +.footer-contact a:hover { color: var(--gold); } +.footer-col-head { + font-family: var(--font-ui); font-size: .58rem; + letter-spacing: .22em; text-transform: uppercase; + color: var(--gold); margin-bottom: .8rem; +} +.footer-links { list-style: none; } +.footer-links li { margin-bottom: .35rem; } +.footer-links a { + color: var(--muted); font-size: .82rem; text-decoration: none; + transition: color .18s; +} +.footer-links a:hover { color: var(--gold); } +.footer-hours { list-style: none; } +.footer-hours li { + display: flex; justify-content: space-between; + font-size: .82rem; color: var(--muted); + padding: .18rem 0; +} +.footer-hours .day { color: var(--text-2); } +.footer-bottom { + border-top: 1px solid var(--border); + padding-top: 1.25rem; + display: flex; justify-content: space-between; align-items: center; + flex-wrap: wrap; gap: .5rem; +} +.footer-copy { font-size: .78rem; color: var(--muted); } +.footer-legal { display: flex; gap: 1.25rem; } +.footer-legal a { font-size: .78rem; color: var(--muted); text-decoration: none; } +.footer-legal a:hover { color: var(--gold); } + +/* ── MISC ────────────────────────────────────────────── */ +.divider { border: none; border-top: 1px solid var(--border); margin: 0; } + +.cta-strip { + background: linear-gradient(135deg, #1c1710, #221a10); + border: 1px solid var(--border); + border-radius: var(--radius-lg); + padding: 2.5rem; + text-align: center; +} +.cta-strip h2 { font-family: var(--font-brand); color: var(--text); margin-bottom: .5rem; font-size: 1.6rem; } +.cta-strip p { color: var(--text-2); margin-bottom: 1.5rem; font-size: .95rem; } + +/* ── RESPONSIVE ──────────────────────────────────────── */ +@media (max-width: 900px) { + .nav { padding: 0 1.5rem; } + .nav-links, .nav-find { display: none; } + .nav-toggle { display: flex; } + .nav.menu-open .nav-links { + display: flex; flex-direction: column; align-items: flex-start; + position: absolute; top: var(--nav-h); left: 0; right: 0; + background: rgba(12,10,8,.97); backdrop-filter: blur(16px); + border-bottom: 1px solid var(--border); + padding: 1.5rem 2rem; gap: 1.25rem; + } + .nav.menu-open .nav-find { + display: block; + position: absolute; top: calc(var(--nav-h) + 9rem); left: 0; right: 0; + background: rgba(12,10,8,.97); + padding: 0 2rem 1.5rem; border-bottom: 1px solid var(--border); + } + .two-col, .two-col--reverse { grid-template-columns: 1fr; direction: ltr; } + .two-col--reverse > * { direction: ltr; } + .booking-layout { grid-template-columns: 1fr; } + .booking-cards { grid-template-columns: 1fr; } + .find-grid { grid-template-columns: 1fr; } + .footer-grid { grid-template-columns: 1fr 1fr; } + .game-cats { grid-template-columns: 1fr; } +} +@media (max-width: 560px) { + .hero-ctas { flex-direction: column; align-items: stretch; text-align: center; } + .hero-ctas .btn { justify-content: center; } + .footer-grid { grid-template-columns: 1fr; } + .footer-bottom { flex-direction: column; text-align: center; } + .field-row { grid-template-columns: 1fr; } + .section { padding: 3.5rem 1.25rem; } +} diff --git a/events.html b/events.html new file mode 100644 index 0000000..f2cac95 --- /dev/null +++ b/events.html @@ -0,0 +1,389 @@ + + + + + +Events — The Fat Dragon + + + + + + + + + +
+
+ Events & Tournaments +

📅 Upcoming Events

+

+ Saturdays at The Fat Dragon are tournament days. + Click any event to see details and sign up. +

+
+
+ +
+
+ + +
+

+ We follow a monthly Saturday rotation — so you always know what’s coming. + 1st Saturday: indie board game tournaments • + 2nd Saturday: Retro Fighter Arcade (12 players) • + 3rd Saturday: TCG (MTG / Star Wars Unlimited, alternating) • + 4th Saturday: Popular board games (Catan / Ticket to Ride / Village, alternating) +

+
+ + +
+
September 2026
+
+ +
+
+
+ 5 + Sat +
+
+
🎉 Grand Opening
+
10:00 AM — Late
+
+ ▾ +
+
+

The Fat Dragon opens its doors to Ashbourne! Free entry all day, demo tables for board games, arcade play, and a special opening-day raffle. D&D sign-ups at the door.

+ Book Now +
+
+ +
+
+
+ 12 + Sat +
+
+
🕹ī¸ Retro Arcade Tournament
+
9:00 AM — 2:00 PM
+
+ ▾ +
+
+

Single-elimination bracket tournament. 12 player cap. Street Fighter II and Mortal Kombat II both featured. Sign-up at the door from 9 AM, first match at 9:30 AM.

+ Register → +
+
+ +
+
+
+ 19 + Sat +
+
+
⚔ī¸ TCG Tournament — MTG (Unofficial)
+
9:00 AM — 2:00 PM
+
+ ▾ +
+
+

Magic: The Gathering casual/Commander format. Unofficial tournament — all skill levels welcome. Bring your own deck. Loaner decks available at the counter.

+ Register → +
+
+ +
+
+
+ 26 + Sat +
+
+
🌾 Catan Tournament
+
9:00 AM — 2:00 PM
+
+ ▾ +
+
+

Round-robin Catan with 3-4 player tables. Points accumulate across all rounds; top scorer wins. Expansions in play: Seafarers and Cities & Knights (vote decides).

+ Register → +
+
+ +
+
+ + +
+
October 2026
+
+ +
+
+
3Sat
+
+
🎲 New Board Game Tournament
+
9:00 AM — 2:00 PM
+
+ ▾ +
+
+

First Saturday indie spotlight: a new game is introduced and we run a full table tournament. Game announced on Instagram one week prior.

+ Register → +
+
+ +
+
+
10Sat
+
+
🕹ī¸ Retro Arcade Tournament
+
9:00 AM — 2:00 PM
+
+ ▾ +
+
+

This month: Street Fighter III & Marvel vs. Capcom double-header. 12 player cap, single-elimination. Sign-up at 9 AM.

+ Register → +
+
+ +
+
+
17Sat
+
+
🌌 TCG Tournament — Star Wars: Unlimited
+
9:00 AM — 2:00 PM
+
+ ▾ +
+
+

Star Wars: Unlimited casual tournament. Starter decks available for purchase at the counter. Open to all skill levels.

+ Register → +
+
+ +
+
+
24Sat
+
+
🚂 Ticket to Ride Tournament
+
9:00 AM — 2:00 PM
+
+ ▾ +
+
+

Europe map, standard rules. 3-5 player tables with a round-robin format. Longest route trophy on the line.

+ Register → +
+
+ +
+
+ + +
+
November 2026
+
+ +
+
+
7Sat
+
+
🎲 New Board Game Tournament
+
9:00 AM — 2:00 PM
+
+ ▾ +
+
+

Monthly indie spotlight. Game TBA — follow us on Instagram for the reveal. Beginner-friendly formats always available.

+ Register → +
+
+ +
+
+
14Sat
+
+
🕹ī¸ Retro Arcade Tournament
+
9:00 AM — 2:00 PM
+
+ ▾ +
+
+

Community vote decides this month’s game. Options: Mortal Kombat II, Street Fighter II, Marvel vs. Capcom. Vote on Instagram the week before.

+ Register → +
+
+ +
+
+
21Sat
+
+
⚔ī¸ TCG Tournament — TBD
+
9:00 AM — 2:00 PM
+
+ ▾ +
+
+

Game voted by the community. Options: Magic: The Gathering, Pokémon TCG, or Star Wars: Unlimited. Vote opens 2 weeks prior.

+ Register → +
+
+ +
+
+
28Sat
+
+
🏘ī¸ Village Tournament
+
9:00 AM — 2:00 PM
+
+ ▾ +
+
+

Build the most prosperous village across multiple generations. 2-4 player tables. Rules explanation provided for newcomers at 9 AM.

+ Register → +
+
+ +
+
+ + +
+
December 2026
+
+ +
+
+
5Sat
+
+
🎲 New Board Game Tournament
+
9:00 AM — 2:00 PM
+
+ ▾ +
+
+

December indie spotlight — expect a holiday-themed game selection. Full details announced on Instagram.

+ Register → +
+
+ +
+
+
12Sat
+
+
🕹ī¸ Retro Arcade Tournament
+
9:00 AM — 2:00 PM
+
+ ▾ +
+
+

End-of-year championship bracket. Previous monthly winners invited to compete. Open wildcard spots available. Register early.

+ Register → +
+
+ +
+
+
19Sat
+
+
⚔ī¸ TCG Tournament — TBD
+
9:00 AM — 2:00 PM
+
+ ▾ +
+
+

Community-voted TCG tournament. End-of-year rankings on the line. All formats welcome.

+ Register → +
+
+ +
+
+
26Sat
+
+
🎲 Board Game Tournament — TBD
+
9:00 AM — 2:00 PM
+
+ ▾ +
+
+

Year-end board game championship. Community vote decides the game. A great way to wrap up 2026.

+ Register → +
+
+ +
+
+ +
+
+ + + + + + diff --git a/find-us.html b/find-us.html new file mode 100644 index 0000000..c139144 --- /dev/null +++ b/find-us.html @@ -0,0 +1,204 @@ + + + + + +Find Us — The Fat Dragon + + + + + + + + + +
+
+ Find Us +

📍 Come Visit The Fat Dragon

+

+ We’d love to see you! Opening July 2026 in Ashbourne, Co. Meath. +

+
+
+ +
+
+
+ + +
+
+ +
+ + 📍 Open in Google Maps → + +
+ + +
+ +
+ Address +

+ Ashbourne
+ Co. Meath
+ Ireland +

+

Full street address confirmed at launch (July 2026).

+
+ +
+ Opening Hours +
    +
  • Monday12:00 PM – 10:00 PM
    • +
  • Tuesday12:00 PM – 10:00 PM
    • +
  • Wednesday12:00 PM – 10:00 PM
    • +
  • Thursday12:00 PM – 10:00 PM
    • +
  • Friday12:00 PM – 10:00 PM
    • +
  • Saturday9:00 AM – 10:00 PM
    • +
  • Sunday9:00 AM – 9:00 PM
    • +
+
+ +
+ Get in Touch + +
+ +
+ Book in Advance +

+ D&D sessions are bookable right now. Arcade and table game bookings open at launch. +

+ ⚔ī¸ Book a D&D Session +
+ +
+
+
+
+ + +
+
+
+ Getting Here +

How to Find Us

+
+ +
+ 🚗 +
+
By Car
+

+ Ashbourne is just off the M2 motorway, approximately 20 minutes north of Dublin city centre. + Free parking available in town centre car parks. +

+
+
+ +
+ 🚌 +
+
By Bus
+

+ Dublin Bus route 103 runs from Dublin city centre to Ashbourne. Journey time approximately 45 minutes. +

+
+
+ +
+ 🚴 +
+
By Bike
+

+ Cycle lanes on the main routes into Ashbourne. Secure bike parking at the front of the building. +

+
+
+ +
+
+
+
+ + + + + + diff --git a/index.html b/index.html new file mode 100644 index 0000000..04f9a3d --- /dev/null +++ b/index.html @@ -0,0 +1,237 @@ + + + + + +The Fat Dragon — Ashbourne, Co. Meath + + + + + + + + + + +
+
+
+ Coming Soon + 🐉 +

The Fat Dragon

+

Ashbourne · Co. Meath · Ireland

+

+ A brand-new game shop is coming to Ashbourne — retro arcade cabinets, + tabletop strategy, D&D campaigns, and a space built for every kind of player. +

+ Opening July 2026 · D&D bookings open now +
+ ⚔ī¸ D&D Sessions + 🕹ī¸ Retro Arcade + 🎲 Board Games +
+
+
+ + +
+
+
+
+
+
+
FAT DRAGON
+
Arcade · Est. 2026
+
Insert Coin to Continue
+
+
+
+
+
+
+
+
+
+
+
+ Retro Arcade +

Play Against Friends and Rivals

+

+ Relive the golden age of gaming with our hand-picked collection of classic + arcade cabinets. Challenge friends head-to-head or prove yourself against + the machine — the high score board awaits. +

+
+ Mortal Kombat II + Mortal Kombat III + Street Fighter II + Street Fighter III + Time Crisis + Marvel vs. Capcom + Pac-Man + Space Invaders +
+ +
+
+
+
+ + +
+
+
+
+
+ 🎲 + Board & Card Games +
+
+
+ Board & Card Games +

Gather Around the Table

+

+ From grand strategy to fast-paced card battles, our library has something + for every group. Bring your crew or join a scheduled game — the table is always open. +

+
+
+
Strategy Games
+
    +
  • Catan
  • Ticket to Ride
  • Village
  • Dune
    • +
+
+
+
Card Games
+
    +
  • Magic: The Gathering
  • Pokémon TCG
  • Yu-Gi-Oh!
    • +
+
+
+ +
+
+
+
+ + +
+
+ Events & Tournaments +

Compete, Collaborate, Celebrate

+

+ Every Saturday is tournament day. Retro fighter tournaments, TCG events, + board game championships — something for every kind of player. +

+
+ D&D Campaign Nights + Fighting Game Tournaments + Pokémon TCG Events + Board Game Socials + Magic: The Gathering +
+ View Full Schedule → +
+
+ + +
+
+
+
+ Find Us +

Come Visit The Fat Dragon

+

+ We’d love to see you! Opening July 2026 in Ashbourne, Co. Meath. +

+ + +
+
+
+ +
+
+
+
+
+ + + + + + diff --git a/js/main.js b/js/main.js new file mode 100644 index 0000000..7ac3a0b --- /dev/null +++ b/js/main.js @@ -0,0 +1,73 @@ +/* ── NAV TOGGLE ─────────────────────────────────────── */ +(function () { + const nav = document.querySelector('.nav'); + const toggle = document.querySelector('.nav-toggle'); + if (!toggle) return; + toggle.addEventListener('click', () => { + const open = nav.classList.toggle('menu-open'); + toggle.setAttribute('aria-expanded', open); + }); + document.addEventListener('click', (e) => { + if (!nav.contains(e.target)) { + nav.classList.remove('menu-open'); + toggle.setAttribute('aria-expanded', 'false'); + } + }); +})(); + +/* ── EVENT CARDS ─────────────────────────────────────── */ +(function () { + document.querySelectorAll('.event-summary').forEach((summary) => { + summary.addEventListener('click', () => { + const card = summary.closest('.event-card'); + const isOpen = card.classList.contains('open'); + // close all + document.querySelectorAll('.event-card.open').forEach(c => c.classList.remove('open')); + if (!isOpen) card.classList.add('open'); + }); + }); +})(); + +/* ── BOOKING FORMS ───────────────────────────────────── */ +(function () { + document.querySelectorAll('.booking-form').forEach((form) => { + form.addEventListener('submit', (e) => { + e.preventDefault(); + const card = form.closest('.form-card'); + const success = card.querySelector('.form-success'); + if (!success) return; + form.style.display = 'none'; + success.style.display = 'block'; + }); + }); +})(); + +/* ── DATE → TIME DEPENDENCY ──────────────────────────── */ +(function () { + document.querySelectorAll('input[type="date"]').forEach((dateInput) => { + const form = dateInput.closest('form'); + if (!form) return; + const timeSelect = form.querySelector('select[name="time"]'); + if (!timeSelect) return; + dateInput.addEventListener('change', () => { + timeSelect.disabled = !dateInput.value; + if (!dateInput.value) { + timeSelect.value = ''; + timeSelect.querySelector('option[value=""]').textContent = 'Pick a date first'; + } else { + timeSelect.querySelector('option[value=""]').textContent = 'Select a time'; + } + }); + }); +})(); + +/* ── MARK CURRENT NAV LINK ───────────────────────────── */ +(function () { + const path = window.location.pathname.replace(/\/$/, '') || '/'; + document.querySelectorAll('.nav-links a').forEach((a) => { + const href = a.getAttribute('href').replace(/\/$/, '') || '/'; + if (path === href || (href !== '/' && path.startsWith(href))) { + a.setAttribute('aria-current', 'page'); + } + }); +})();