Compare commits
4 Commits
dev_jannis
...
10883aa381
| Author | SHA1 | Date | |
|---|---|---|---|
| 10883aa381 | |||
| 33066b0017 | |||
| 252b892cff | |||
| e13f35a9e0 |
BIN
img/cashtruck.jpg
LFS
Normal file
BIN
img/cashtruck.jpg
LFS
Normal file
Binary file not shown.
660
index.html
660
index.html
@@ -267,15 +267,208 @@
|
||||
<h1 class="list-title">Snacks & Getränke</h1>
|
||||
|
||||
<div class="category-tabs">
|
||||
<button class="tab-btn active" data-target="cat-getraenke">Getränke</button>
|
||||
<button class="tab-btn active" data-target="cat-limited">Limitierte Specials</button>
|
||||
<button class="tab-btn" data-target="cat-getraenke">Getränke</button>
|
||||
<button class="tab-btn" data-target="cat-popcorn">Popcorn</button>
|
||||
<button class="tab-btn" data-target="cat-nachos">Nachos</button>
|
||||
<button class="tab-btn" data-target="cat-snacks">Snacks</button>
|
||||
<button class="tab-btn" data-target="cat-kombi">Kombi</button>
|
||||
<button class="tab-btn" data-target="cat-eis">Eis</button>
|
||||
</div>
|
||||
|
||||
<div id="cat-getraenke" class="snack-category active">
|
||||
<div id="cat-limited" class="snack-category active limited-specials-category">
|
||||
<div class="limited-specials-hero">
|
||||
<div>
|
||||
<span class="limited-kicker">Nur für kurze Zeit</span>
|
||||
<h2>Limitierte Specials</h2>
|
||||
<p>Filmbecher, Sammler-Eimer und Kids-Menüs als kleine Vitrine für besondere Aktionen.</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="limited-special-block">
|
||||
<div class="special-film-heading">
|
||||
<img src="img/Zoomania-2.jpg" alt="Zoomania 2 Logo">
|
||||
<div>
|
||||
<span>Zoomania 2</span>
|
||||
<h2>City Edition</h2>
|
||||
</div>
|
||||
</div>
|
||||
<div class="limited-special-grid">
|
||||
<div class="snack-card limited-special-card">
|
||||
<div class="snack-img"><img src="img/zoomania-popcorn.jpg" alt="Zoomania 2 Metallbecher"></div>
|
||||
<div class="snack-info">
|
||||
<span class="badge">Metallbecher</span>
|
||||
<h3>Limitierter Metallbecher - Zoomania 2</h3>
|
||||
<p class="snack-card-note">Sammlerbecher mit Popcornfüllung, wahlweise süß oder salzig.</p>
|
||||
<div class="option-group">
|
||||
<button class="opt-btn active">Süß</button>
|
||||
<button class="opt-btn">Salzig</button>
|
||||
</div>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">Special <span>12,00€</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="snack-card limited-special-card wide-special">
|
||||
<div class="snack-img"><img src="img/zoomaniakidsmenu.jpg" alt="Zoomania Kids Menu"></div>
|
||||
<div class="snack-info">
|
||||
<span class="badge">Kids Special</span>
|
||||
<h3>Zoomania Kids Menü</h3>
|
||||
<p class="snack-card-note">0,5L Getränk im Zoomania Becher + Zoomania Popcorn Schale + Figur zum Aussuchen.</p>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">Menü-Preis <span>10,00€</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="limited-special-block">
|
||||
<div class="special-film-heading">
|
||||
<img src="img/screamvii.jpg" alt="Scream VII Logo">
|
||||
<div>
|
||||
<span>Scream VII</span>
|
||||
<h2>Horror Collectors</h2>
|
||||
</div>
|
||||
</div>
|
||||
<div class="limited-special-grid compact-specials">
|
||||
<div class="snack-card limited-special-card">
|
||||
<div class="snack-img"><img src="img/screamdoorpopcorn.jpg" alt="Scream VII Sammelbecher"></div>
|
||||
<div class="snack-info">
|
||||
<span class="badge">Collector</span>
|
||||
<h3>Limitierter Sammelbecher - Scream VII</h3>
|
||||
<p class="snack-card-note">Dunkler Sammlerbecher passend zum Horrorabend.</p>
|
||||
<div class="option-group">
|
||||
<button class="opt-btn active">Süß</button>
|
||||
<button class="opt-btn">Salzig</button>
|
||||
</div>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">Special <span>29,00€</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="limited-special-block">
|
||||
<div class="special-film-heading">
|
||||
<img src="img/derAustronaut.jpg" alt="Der Austronaut Logo">
|
||||
<div>
|
||||
<span>Project Hail Mary</span>
|
||||
<h2>Space Collection</h2>
|
||||
</div>
|
||||
</div>
|
||||
<div class="limited-special-grid compact-specials">
|
||||
<div class="snack-card limited-special-card">
|
||||
<div class="snack-img"><img src="img/astronautpopcorn.jpg" alt="Der Austronaut Sammelbecher"></div>
|
||||
<div class="snack-info">
|
||||
<span class="badge">Space Cup</span>
|
||||
<h3>Limitierter Sammelbecher - Der Austronaut</h3>
|
||||
<p class="snack-card-note">Großer Sammlerbecher im Sci-Fi-Look für deine Mission ins Kino.</p>
|
||||
<div class="option-group">
|
||||
<button class="opt-btn active">Süß</button>
|
||||
<button class="opt-btn">Salzig</button>
|
||||
</div>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">Special <span>34,00€</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="limited-special-block">
|
||||
<div class="special-film-heading">
|
||||
<img src="img/hoppers.jpg" alt="Hoppers Logo">
|
||||
<div>
|
||||
<span>Hoppers</span>
|
||||
<h2>Family Specials</h2>
|
||||
</div>
|
||||
</div>
|
||||
<div class="limited-special-grid">
|
||||
<div class="snack-card limited-special-card">
|
||||
<div class="snack-img"><img src="img/hopperspopcornmetall.jpg" alt="Hoppers Metallbecher"></div>
|
||||
<div class="snack-info">
|
||||
<span class="badge">Metallbecher</span>
|
||||
<h3>Limitierter Metallbecher - Hoppers</h3>
|
||||
<p class="snack-card-note">Stabiler Becher mit Popcornfüllung.</p>
|
||||
<div class="option-group">
|
||||
<button class="opt-btn active">Süß</button>
|
||||
<button class="opt-btn">Salzig</button>
|
||||
</div>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">Special <span>12,00€</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="snack-card limited-special-card">
|
||||
<div class="snack-img"><img src="img/hopperspopcornwood.png" alt="Hoppers Sammelbecher"></div>
|
||||
<div class="snack-info">
|
||||
<span class="badge">Collector</span>
|
||||
<h3>Limitierter Sammelbecher - Hoppers</h3>
|
||||
<p class="snack-card-note">Sammlerbecher mit warmem Popcornmoment.</p>
|
||||
<div class="option-group">
|
||||
<button class="opt-btn active">Süß</button>
|
||||
<button class="opt-btn">Salzig</button>
|
||||
</div>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">Special <span>21,00€</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="snack-card limited-special-card wide-special">
|
||||
<div class="snack-img"><img src="img/hopperskidsmenu.jpg" alt="Hoppers Kids Menu"></div>
|
||||
<div class="snack-info">
|
||||
<span class="badge">Kids Special</span>
|
||||
<h3>Hoppers Kids Menü</h3>
|
||||
<p class="snack-card-note">0,5L Getränk im Hoppers Becher + Hoppers Popcorn Schale + Hoppers Figur.</p>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">Menü-Preis <span>10,00€</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="limited-special-block">
|
||||
<div class="special-film-heading">
|
||||
<img src="img/mariogalaxy.jpg" alt="Mario Galaxy Logo">
|
||||
<div>
|
||||
<span>Super Mario Galaxy</span>
|
||||
<h2>Galaxy Specials</h2>
|
||||
</div>
|
||||
</div>
|
||||
<div class="limited-special-grid">
|
||||
<div class="snack-card limited-special-card">
|
||||
<div class="snack-img"><img src="img/marioyoshipopcorn.png" alt="Yoshi Sammelbecher"></div>
|
||||
<div class="snack-info">
|
||||
<span class="badge">Yoshi Cup</span>
|
||||
<h3>Limitierter Sammelbecher - Yoshi Becher</h3>
|
||||
<p class="snack-card-note">Verspielter Sammlerbecher für Mario-Fans.</p>
|
||||
<div class="option-group">
|
||||
<button class="opt-btn active">Süß</button>
|
||||
<button class="opt-btn">Salzig</button>
|
||||
</div>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">Special <span>35,90€</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="snack-card limited-special-card wide-special">
|
||||
<div class="snack-img"><img src="img/mariokidsmenu.png" alt="Mario Kids Menu"></div>
|
||||
<div class="snack-info">
|
||||
<span class="badge">Kids Special</span>
|
||||
<h3>Mario Galaxy Kids Menü</h3>
|
||||
<p class="snack-card-note">0,5L Getränk im Mario Galaxy Becher + Mario Galaxy Popcorn Schale.</p>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">Menü-Preis <span>10,00€</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="cat-getraenke" class="snack-category hidden">
|
||||
<div class="snack-grid">
|
||||
|
||||
<div class="snack-card">
|
||||
@@ -392,229 +585,209 @@
|
||||
</div> </div>
|
||||
|
||||
<div id="cat-popcorn" class="snack-category hidden">
|
||||
<div class="snack-grid">
|
||||
<div class="snack-card">
|
||||
<div class="snack-img"><img src="img/popcorn-klein.png" alt="Popcorn klein"></div>
|
||||
<div class="snack-info">
|
||||
<h3>Popcorn klein</h3>
|
||||
<div class="option-group">
|
||||
<button class="opt-btn active">Süß</button>
|
||||
<button class="opt-btn">Salzig</button>
|
||||
<div class="snack-subsection">
|
||||
<div class="snack-section-heading">
|
||||
<span>Frisch gepoppt</span>
|
||||
<h2>Einzelprodukte</h2>
|
||||
</div>
|
||||
<div class="snack-grid">
|
||||
<div class="snack-card">
|
||||
<div class="snack-img"><img src="img/popcorn-klein.png" alt="Popcorn klein"></div>
|
||||
<div class="snack-info">
|
||||
<h3>Popcorn klein</h3>
|
||||
<div class="option-group">
|
||||
<button class="opt-btn active">Süß</button>
|
||||
<button class="opt-btn">Salzig</button>
|
||||
</div>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">Klein <span>3,50€</span></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">3,50€</button>
|
||||
</div>
|
||||
<div class="snack-card">
|
||||
<div class="snack-img"><img src="img/popcorn-mittel.png" alt="Popcorn mittel"></div>
|
||||
<div class="snack-info">
|
||||
<h3>Popcorn Mittel</h3>
|
||||
<div class="option-group">
|
||||
<button class="opt-btn active">Süß</button>
|
||||
<button class="opt-btn">Salzig</button>
|
||||
</div>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">Mittel <span>4,50€</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="snack-card">
|
||||
<div class="snack-img"><img src="img/popcorn-big.png" alt="Popcorn groß"></div>
|
||||
<div class="snack-info">
|
||||
<h3>Popcorn Groß</h3>
|
||||
<div class="option-group">
|
||||
<button class="opt-btn active">Süß</button>
|
||||
<button class="opt-btn">Salzig</button>
|
||||
</div>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">Groß <span>6,00€</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="snack-subsection">
|
||||
<div class="snack-section-heading popcorn-combo-heading">
|
||||
<span>Für Filmabende</span>
|
||||
<h2>Kombi Menü</h2>
|
||||
</div>
|
||||
<div class="snack-grid">
|
||||
<div class="snack-card highlight">
|
||||
<div class="snack-info">
|
||||
<h3>Kleines Menü</h3>
|
||||
<p class="snack-card-note">0,33L Getränk + Popcorn klein</p>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">Menü-Preis <span>5,00€</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="snack-card highlight">
|
||||
<div class="snack-info">
|
||||
<h3>Mittleres Menü</h3>
|
||||
<p class="snack-card-note">0,5L Getränk + Popcorn mittel</p>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">Menü-Preis <span>6,50€</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="snack-card highlight">
|
||||
<div class="snack-info">
|
||||
<span class="badge">Bestseller</span>
|
||||
<h3>Großes Menü</h3>
|
||||
<p class="snack-card-note">1L Getränk + Popcorn groß</p>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">Menü-Preis <span>8,00€</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="snack-card">
|
||||
<div class="snack-img"><img src="img/popcorn-mittel.png" alt="Popcorn mittel"></div>
|
||||
<div class="snack-info">
|
||||
<h3>Popcorn Mittel</h3>
|
||||
<div class="option-group">
|
||||
<button class="opt-btn active">Süß</button>
|
||||
<button class="opt-btn">Salzig</button>
|
||||
</div>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">4,50€</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="snack-card">
|
||||
<div class="snack-img"><img src="img/popcorn-big.png" alt="Popcorn groß"></div>
|
||||
<div class="snack-info">
|
||||
<h3>Popcorn Groß</h3>
|
||||
<div class="option-group">
|
||||
<button class="opt-btn active">Süß</button>
|
||||
<button class="opt-btn">Salzig</button>
|
||||
</div>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">6,00€</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="snack-card">
|
||||
<div class="snack-img"><img src="img/zoomania-popcorn.jpg" alt="Popcorn limited - zoomania 2"></div>
|
||||
<div class="snack-info">
|
||||
<h3>Limitierter Metallbecher - Zoomania 2</h3>
|
||||
<div class="option-group">
|
||||
<button class="opt-btn active">Süß</button>
|
||||
<button class="opt-btn">Salzig</button>
|
||||
</div>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">12,00€</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="snack-card">
|
||||
<div class="snack-img"><img src="img/screamdoorpopcorn.jpg" alt="Popcorn limited - Scream VII"></div>
|
||||
<div class="snack-info">
|
||||
<h3>Limitierter Sammelbecher - Scream VII</h3>
|
||||
<div class="option-group">
|
||||
<button class="opt-btn active">Süß</button>
|
||||
<button class="opt-btn">Salzig</button>
|
||||
</div>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">29,00€</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="snack-card">
|
||||
<div class="snack-img"><img src="img/astronautpopcorn.jpg" alt="Popcorn limited - Der Austronaut"></div>
|
||||
<div class="snack-info">
|
||||
<h3>Limitierter Sammelbecher - Der Austronaut</h3>
|
||||
<div class="option-group">
|
||||
<button class="opt-btn active">Süß</button>
|
||||
<button class="opt-btn">Salzig</button>
|
||||
</div>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">34,00€</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="snack-card">
|
||||
<div class="snack-img"><img src="img/hopperspopcornmetall.jpg" alt="Popcorn limited - Hoppers"></div>
|
||||
<div class="snack-info">
|
||||
<h3>Limitierter Metallbecher - Hoppers</h3>
|
||||
<div class="option-group">
|
||||
<button class="opt-btn active">Süß</button>
|
||||
<button class="opt-btn">Salzig</button>
|
||||
</div>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">12,00€</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="snack-card">
|
||||
<div class="snack-img"><img src="img/hopperspopcornwood.png" alt="Popcorn limited - Hoppers"></div>
|
||||
<div class="snack-info">
|
||||
<h3>Limitierter Sammelbecher - Hoppers</h3>
|
||||
<div class="option-group">
|
||||
<button class="opt-btn active">Süß</button>
|
||||
<button class="opt-btn">Salzig</button>
|
||||
</div>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">21,00€</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="snack-card">
|
||||
<div class="snack-img"><img src="img/marioyoshipopcorn.png" alt="Popcorn limited - Yoshi"></div>
|
||||
<div class="snack-info">
|
||||
<h3>Limitierter Sammelbecher - Yoshi Becher</h3>
|
||||
<div class="option-group">
|
||||
<button class="opt-btn active">Süß</button>
|
||||
<button class="opt-btn">Salzig</button>
|
||||
</div>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">35,90€</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="cat-nachos" class="snack-category hidden">
|
||||
<div class="snack-grid">
|
||||
<div class="snack-card">
|
||||
<div class="snack-img"><img src="img/nachosnormal.png" alt="Nachos"></div>
|
||||
<div class="snack-info">
|
||||
<h3>Nachos Klein</h3>
|
||||
<div class="option-group">
|
||||
<button class="opt-btn active">Käse-Dip</button>
|
||||
<button class="opt-btn">Salsa-Dip</button>
|
||||
<div class="snack-subsection">
|
||||
<div class="snack-section-heading">
|
||||
<span>Nachos</span>
|
||||
<h2>Einzelprodukte</h2>
|
||||
</div>
|
||||
<div class="snack-grid">
|
||||
<div class="snack-card">
|
||||
<div class="snack-img"><img src="img/nachosnormal.png" alt="Nachos"></div>
|
||||
<div class="snack-info">
|
||||
<h3>Nachos Klein</h3>
|
||||
<div class="option-group">
|
||||
<button class="opt-btn active">Käse-Dip</button>
|
||||
<button class="opt-btn">Salsa-Dip</button>
|
||||
</div>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">Klein <span>5,00€</span></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">Klein<span>5,00€</span></button>
|
||||
</div>
|
||||
<div class="snack-card">
|
||||
<div class="snack-img"><img src="img/nachosnormal.png" alt="Nachos"></div>
|
||||
<div class="snack-info">
|
||||
<h3>Nachos Normal</h3>
|
||||
<div class="option-group">
|
||||
<button class="opt-btn active">Käse-Dip</button>
|
||||
<button class="opt-btn">Salsa-Dip</button>
|
||||
</div>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">Mittel <span>6,50€</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="snack-card">
|
||||
<div class="snack-img"><img src="img/nachos.jpg" alt="Nachos"></div>
|
||||
<div class="snack-info">
|
||||
<h3>Nachos Groß</h3>
|
||||
<div class="option-group">
|
||||
<button class="opt-btn active">Käse-Dip</button>
|
||||
<button class="opt-btn">Sourcreme-Dip</button>
|
||||
<button class="opt-btn">Salsa-Dip</button>
|
||||
</div>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">Groß <span>8,00€</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="snack-card">
|
||||
<div class="snack-img"><img src="img/nachosnormal.png" alt="Nachos"></div>
|
||||
<div class="snack-info">
|
||||
<h3>Nachos Normal</h3>
|
||||
<div class="option-group">
|
||||
<button class="opt-btn active">Käse-Dip</button>
|
||||
<button class="opt-btn">Salsa-Dip</button>
|
||||
</div>
|
||||
|
||||
<div class="snack-subsection">
|
||||
<div class="snack-section-heading">
|
||||
<span>Extra dazu</span>
|
||||
<h2>Dips</h2>
|
||||
</div>
|
||||
<div class="snack-grid">
|
||||
<div class="snack-card">
|
||||
<div class="snack-img"><img src="img/käsedip.png" alt="Käse-Dip"></div>
|
||||
<div class="snack-info">
|
||||
<h3>Käse-Dip<br>(warm)</h3>
|
||||
<div class="option-group">
|
||||
<button class="opt-btn active">Normal</button>
|
||||
<button class="opt-btn">Scharf</button>
|
||||
</div>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">Schale <span>2,00€</span></button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">Mittel<span>6,50€</span></button>
|
||||
</div>
|
||||
<div class="snack-card">
|
||||
<div class="snack-img"><img src="img/sourdip.png" alt="Sourcreme-Dip"></div>
|
||||
<div class="snack-info">
|
||||
<h3>Sourcreme-Dip</h3>
|
||||
<div class="option-group">
|
||||
<button class="opt-btn active">Normal</button>
|
||||
</div>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">Schale <span>2,00€</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="snack-card">
|
||||
<div class="snack-img"><img src="img/salsadip.png" alt="Salsa-Dip"></div>
|
||||
<div class="snack-info">
|
||||
<h3>Salsa-Dip</h3>
|
||||
<div class="option-group">
|
||||
<button class="opt-btn active">Normal</button>
|
||||
</div>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">Schale <span>2,00€</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="snack-card">
|
||||
<div class="snack-img"><img src="img/nachos.jpg" alt="Nachos"></div>
|
||||
<div class="snack-info">
|
||||
<h3>Nachos Groß</h3>
|
||||
<div class="option-group">
|
||||
<button class="opt-btn active">Käse-Dip</button>
|
||||
<button class="opt-btn">Sourcreme-Dip</button>
|
||||
<button class="opt-btn">Salsa-Dip</button>
|
||||
</div>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">Groß <span>8,00€</span></button>
|
||||
</div>
|
||||
|
||||
<div class="snack-subsection">
|
||||
<div class="snack-section-heading">
|
||||
<span>Alles drin</span>
|
||||
<h2>Kombi Menü</h2>
|
||||
</div>
|
||||
<div class="snack-grid">
|
||||
<div class="snack-card highlight">
|
||||
<div class="snack-img"><img src="img/nachokombiklein.png" alt="Nacho Kombi Klein"></div>
|
||||
<div class="snack-info">
|
||||
<h3>Nacho Menü Klein</h3>
|
||||
<p class="snack-card-note">Nachos klein + 1 Dip + 1x 0,33L Getränk</p>
|
||||
<div class="option-group">
|
||||
<button class="opt-btn active">Klein</button>
|
||||
</div>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">Kombi <span>6,90€</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<h2 class="list-title"> </h2>
|
||||
<br>
|
||||
<h2 class="list-title">Dips</h2>
|
||||
<br>
|
||||
<br>
|
||||
<br>
|
||||
<div class="snack-card">
|
||||
<div class="snack-img"><img src="img/käsedip.png" alt="Käse-Dip"></div>
|
||||
<div class="snack-info">
|
||||
<h3>Käse-Dip<br>(warm)</h3>
|
||||
<div class="option-group">
|
||||
<button class="opt-btn active">Normal</button>
|
||||
<button class="opt-btn">Scharf</button>
|
||||
</div>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">Schale<span>2,00€</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="snack-card">
|
||||
<div class="snack-img"><img src="img/sourdip.png" alt="Sourcreme-Dip"></div>
|
||||
<div class="snack-info">
|
||||
<h3>Sourcreme-Dip</h3>
|
||||
<div class="option-group">
|
||||
<button class="opt-btn active">Normal</button>
|
||||
</div>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">Schale<span>2,00€</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="snack-card">
|
||||
<div class="snack-img"><img src="img/salsadip.png" alt="Salsa-Dip"></div>
|
||||
<div class="snack-info">
|
||||
<h3>Salsa-Dip</h3>
|
||||
<div class="option-group">
|
||||
<button class="opt-btn active">Normal</button>
|
||||
</div>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">Schale<span>2,00€</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<h2 class="list-title">Nacho Kombi-Menüs</h2>
|
||||
<br>
|
||||
<br>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="snack-card">
|
||||
<div class="snack-img"><img src="img/nachokombiklein.png" alt="Nacho Kombi Klein"></div>
|
||||
<div class="snack-info">
|
||||
<h3>Nacho Menü Klein - Nachos klein + 1 Dip + 1 0,33L Getränk</h3>
|
||||
<div class="option-group">
|
||||
<button class="opt-btn active">Klein</button>
|
||||
</div>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">Kombi<span>6,90€</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div id="cat-snacks" class="snack-category hidden">
|
||||
<div class="snack-grid">
|
||||
<div class="snack-card">
|
||||
@@ -647,75 +820,6 @@
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="cat-kombi" class="snack-category hidden">
|
||||
<div class="snack-grid">
|
||||
<div class="snack-card highlight">
|
||||
<div class="snack-info">
|
||||
<h3>Kleines Menü</h3>
|
||||
<p style="font-size: 0.8rem; color: #86868b; margin-bottom: 10px;">0,33L Getränk + Popcorn Klein</p>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">Menü-Preis <span>5,00€</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="snack-card highlight">
|
||||
<div class="snack-info">
|
||||
<h3>Mittleres Menü</h3>
|
||||
<p style="font-size: 0.8rem; color: #86868b; margin-bottom: 10px;">0,5L Getränk + Popcorn Mittel</p>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">Menü-Preis <span>6,50€</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="snack-card highlight">
|
||||
<div class="snack-info">
|
||||
<span class="badge">Bestseller</span>
|
||||
<h3>Großes Menü</h3>
|
||||
<p style="font-size: 0.8rem; color: #86868b; margin-bottom: 10px;">1L Getränk + Popcorn Groß</p>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">Menü-Preis <span>8,00€</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<br>
|
||||
<div class="snack-card highlight">
|
||||
<div class="snack-info">
|
||||
<div class="snack-img"><img src="img/hopperskidsmenu.jpg" alt="Hoppers Kids Menu"></div>
|
||||
<span class="badge">SPECIAL</span>
|
||||
<h3>Limitiertes Menü</h3>
|
||||
<p style="font-size: 0.8rem; color: #86868b; margin-bottom: 10px;">0,5L Getränk im HOPPERS Becher + HOPPERS Popcorn Schale<br>+HOPPERS Figur</p>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">Menü-Preis <span>10,00€</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="snack-card highlight">
|
||||
<div class="snack-info">
|
||||
<div class="snack-img"><img src="img/mariokidsmenu.png" alt="Mario Kids Menu"></div>
|
||||
<br>
|
||||
<span class="badge">SPECIAL</span>
|
||||
<h3>Limitiertes Menü</h3>
|
||||
<p style="font-size: 0.8rem; color: #86868b; margin-bottom: 10px;">0,5L Getränk im MARIO GALXY Becher + MARIO GALAXY Popcorn Schale</p>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">Menü-Preis <span>10,00€</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="snack-card highlight">
|
||||
<div class="snack-info">
|
||||
<div class="snack-img"><img src="img/zoomaniakidsmenu.jpg" alt="Zoomania Kids Menu"></div>
|
||||
<br>
|
||||
<span class="badge">SPECIAL</span>
|
||||
<h3>Limitiertes Menü</h3>
|
||||
<p style="font-size: 0.8rem; color: #86868b; margin-bottom: 10px;">0,5L Getränk im ZOOMANIA Becher + ZOOMANIA Popcorn Schale<br>+ Figur zum aussuchen</p>
|
||||
<div class="size-selector">
|
||||
<button class="size-chip">Menü-Preis <span>10,00€</span></button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="cat-eis" class="snack-category hidden">
|
||||
<div class="coming-soon-banner">
|
||||
<h2>Eiscreme & Shakes</h2>
|
||||
|
||||
6
main.js
6
main.js
@@ -221,9 +221,11 @@ document.addEventListener("DOMContentLoaded", () => {
|
||||
{
|
||||
title: "Cash Truck",
|
||||
genre: "Action",
|
||||
duration: 118,
|
||||
duration: 98,
|
||||
fsk: "16",
|
||||
description: ""
|
||||
description: "Der verschlossene Einzelgänger „H” nimmt einen Job bei einer Geldtransporter-Firma an, die jede Woche hunderte von Millionen Dollar durch Los Angeles fährt. Gleich bei seinem ersten Einsatz wird der Geldtransport überfallen und zur Überraschung seiner Kollegen setzt H die Gangster im Alleingang außer Gefecht und wartet mit ungeahnten Präzisionsfähigkeiten auf. Doch H’s Absichten sind nicht zu durchschauen und kommen nur schrittweise ans Licht. Wer ist der geheimnisvolle Neuzugang und auf wen hat er es wirklich abgesehen?",
|
||||
poster: "img/cashtruck.jpg",
|
||||
backdrop: "img/cashtruck.jpg"
|
||||
},
|
||||
{
|
||||
title: "Die Gangster Gang",
|
||||
|
||||
373
style.css
373
style.css
@@ -3865,3 +3865,376 @@ body.theme-light .about-card {
|
||||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
}
|
||||
}
|
||||
|
||||
/* --- 2026-04-29 account/about/snack readability polish --- */
|
||||
.snack-subsection {
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
.snack-subsection:first-child {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.snack-section-heading {
|
||||
margin: 0 0 16px;
|
||||
padding: 16px 18px;
|
||||
border-left: 4px solid var(--accent-blue);
|
||||
border-radius: 18px;
|
||||
background:
|
||||
linear-gradient(135deg, rgba(0, 113, 227, 0.18), rgba(255, 255, 255, 0.035)),
|
||||
rgba(255, 255, 255, 0.035);
|
||||
}
|
||||
|
||||
.snack-section-heading span {
|
||||
display: block;
|
||||
margin-bottom: 3px;
|
||||
color: #9ed0ff;
|
||||
font-size: 0.72rem;
|
||||
font-weight: 800;
|
||||
letter-spacing: 1.7px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.snack-section-heading h2 {
|
||||
margin: 0;
|
||||
color: #f5f8ff;
|
||||
font-size: clamp(1.35rem, 2vw, 2rem);
|
||||
}
|
||||
|
||||
.snack-card-note {
|
||||
margin: 4px 0 12px;
|
||||
color: #aeb8c6;
|
||||
font-size: 0.82rem;
|
||||
line-height: 1.45;
|
||||
}
|
||||
|
||||
body.theme-dark .account-orders-shell h3,
|
||||
body.theme-dark .order-item-head h4,
|
||||
body.theme-dark .order-box p,
|
||||
body.theme-dark .order-box strong,
|
||||
body.theme-dark .order-ticket-content h4,
|
||||
body.theme-dark .order-ticket-grid strong {
|
||||
color: #f4f8ff;
|
||||
}
|
||||
|
||||
body.theme-dark .order-box {
|
||||
background: linear-gradient(145deg, #18202d 0%, #10151f 100%);
|
||||
border-color: rgba(130, 180, 235, 0.2);
|
||||
box-shadow: 0 14px 34px rgba(0, 0, 0, 0.22);
|
||||
}
|
||||
|
||||
body.theme-dark .order-box p {
|
||||
color: #d2dbe8;
|
||||
}
|
||||
|
||||
body.theme-dark .order-item-btn:hover,
|
||||
body.theme-dark .order-item-btn.active {
|
||||
background: linear-gradient(145deg, #1d3148 0%, #111a27 100%);
|
||||
border-color: rgba(110, 185, 255, 0.7);
|
||||
}
|
||||
|
||||
body.theme-dark .order-item-head span {
|
||||
color: #a9d7ff;
|
||||
}
|
||||
|
||||
body.theme-dark .order-ticket-card {
|
||||
background:
|
||||
radial-gradient(circle at 18% 0%, rgba(0, 113, 227, 0.2), transparent 30%),
|
||||
linear-gradient(155deg, #172235 0%, #0b111b 100%);
|
||||
border-color: rgba(146, 194, 255, 0.22);
|
||||
}
|
||||
|
||||
body.theme-dark .order-ticket-grid span,
|
||||
body.theme-dark .order-ticket-brand {
|
||||
color: #b9c9dd;
|
||||
}
|
||||
|
||||
body.theme-light .about-hero-block {
|
||||
background:
|
||||
radial-gradient(circle at 8% 0%, rgba(0, 113, 227, 0.12), transparent 36%),
|
||||
linear-gradient(130deg, #ffffff 0%, #edf5ff 100%);
|
||||
box-shadow: 0 22px 55px rgba(35, 67, 108, 0.12);
|
||||
}
|
||||
|
||||
body.theme-light .about-hero-content h1,
|
||||
body.theme-light .about-stats-grid h3,
|
||||
body.theme-light .about-card h3 {
|
||||
color: #0e1b31 !important;
|
||||
text-shadow: none;
|
||||
}
|
||||
|
||||
body.theme-light .about-hero-content p,
|
||||
body.theme-light .about-stats-grid p {
|
||||
color: #314763 !important;
|
||||
}
|
||||
|
||||
body.theme-light .about-pill-row span {
|
||||
background: rgba(0, 113, 227, 0.11);
|
||||
border-color: rgba(0, 113, 227, 0.28);
|
||||
color: #064b90;
|
||||
}
|
||||
|
||||
body.theme-light .about-stats-grid article {
|
||||
background: rgba(255, 255, 255, 0.92);
|
||||
border-color: rgba(24, 52, 88, 0.18);
|
||||
box-shadow: 0 12px 28px rgba(42, 70, 106, 0.08);
|
||||
}
|
||||
|
||||
body.theme-light .about-card {
|
||||
border-color: rgba(22, 47, 80, 0.22);
|
||||
box-shadow: 0 18px 42px rgba(31, 61, 98, 0.13);
|
||||
}
|
||||
|
||||
body.theme-light .about-card-halls {
|
||||
background-image: url('img/zoomania-2.jpg') !important;
|
||||
}
|
||||
|
||||
body.theme-light .about-card-dbox {
|
||||
background-image: url('img/shelter.jpg') !important;
|
||||
}
|
||||
|
||||
body.theme-light .about-card-tech {
|
||||
background-image: url('img/spidermannewday.jpg') !important;
|
||||
}
|
||||
|
||||
body.theme-light .about-card::before {
|
||||
background:
|
||||
linear-gradient(175deg, rgba(255, 255, 255, 0.42) 0%, rgba(255, 255, 255, 0.93) 74%),
|
||||
linear-gradient(90deg, rgba(0, 113, 227, 0.1), transparent);
|
||||
}
|
||||
|
||||
body.theme-light .about-card p {
|
||||
color: #263f5f !important;
|
||||
}
|
||||
|
||||
body.theme-light .about-card .story-more-btn {
|
||||
background: rgba(255, 255, 255, 0.84);
|
||||
border-color: rgba(0, 83, 170, 0.24);
|
||||
color: #0d3563;
|
||||
box-shadow: 0 10px 24px rgba(26, 57, 95, 0.12);
|
||||
}
|
||||
|
||||
body.theme-light .about-card .story-more-btn:hover {
|
||||
background: #0071e3;
|
||||
border-color: #0071e3;
|
||||
color: #ffffff;
|
||||
}
|
||||
|
||||
body.theme-light .snack-section-heading {
|
||||
background:
|
||||
linear-gradient(135deg, rgba(0, 113, 227, 0.12), rgba(255, 255, 255, 0.94)),
|
||||
#ffffff;
|
||||
border-color: #0071e3;
|
||||
box-shadow: 0 12px 26px rgba(34, 74, 121, 0.09);
|
||||
}
|
||||
|
||||
body.theme-light .snack-section-heading span {
|
||||
color: #0057ae;
|
||||
}
|
||||
|
||||
body.theme-light .snack-section-heading h2 {
|
||||
color: #10213a;
|
||||
}
|
||||
|
||||
body.theme-light .snack-card-note {
|
||||
color: #4a5d79;
|
||||
}
|
||||
|
||||
/* --- 2026-04-29 limited snack specials --- */
|
||||
.limited-specials-category {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.limited-specials-hero {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
margin-bottom: 28px;
|
||||
padding: clamp(24px, 4vw, 42px);
|
||||
border: 1px solid rgba(255, 255, 255, 0.13);
|
||||
border-radius: 28px;
|
||||
background:
|
||||
radial-gradient(circle at 14% 16%, rgba(0, 113, 227, 0.42), transparent 34%),
|
||||
radial-gradient(circle at 82% 10%, rgba(255, 178, 84, 0.2), transparent 30%),
|
||||
linear-gradient(135deg, rgba(12, 18, 31, 0.96), rgba(5, 8, 14, 0.96));
|
||||
box-shadow: 0 24px 60px rgba(0, 0, 0, 0.28);
|
||||
}
|
||||
|
||||
.limited-specials-hero::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
inset: auto -10% -45% 42%;
|
||||
height: 180px;
|
||||
border-radius: 999px;
|
||||
background: rgba(255, 255, 255, 0.08);
|
||||
transform: rotate(-8deg);
|
||||
}
|
||||
|
||||
.limited-kicker {
|
||||
display: inline-flex;
|
||||
margin-bottom: 10px;
|
||||
padding: 7px 12px;
|
||||
border: 1px solid rgba(158, 208, 255, 0.38);
|
||||
border-radius: 999px;
|
||||
color: #9ed0ff;
|
||||
font-size: 0.76rem;
|
||||
font-weight: 800;
|
||||
letter-spacing: 1.5px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.limited-specials-hero h2 {
|
||||
margin: 0 0 8px;
|
||||
color: #ffffff;
|
||||
font-size: clamp(2rem, 5vw, 4.6rem);
|
||||
letter-spacing: -2px;
|
||||
}
|
||||
|
||||
.limited-specials-hero p {
|
||||
max-width: 620px;
|
||||
color: #d4dfec;
|
||||
line-height: 1.65;
|
||||
}
|
||||
|
||||
.limited-special-block {
|
||||
margin-top: 30px;
|
||||
}
|
||||
|
||||
.special-film-heading {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 16px;
|
||||
margin-bottom: 16px;
|
||||
padding: 14px 16px;
|
||||
border: 1px solid rgba(255, 255, 255, 0.12);
|
||||
border-radius: 22px;
|
||||
background:
|
||||
linear-gradient(115deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0.025)),
|
||||
rgba(255, 255, 255, 0.035);
|
||||
}
|
||||
|
||||
.special-film-heading img {
|
||||
width: 76px;
|
||||
height: 76px;
|
||||
border-radius: 18px;
|
||||
object-fit: cover;
|
||||
box-shadow: 0 12px 28px rgba(0, 0, 0, 0.28);
|
||||
}
|
||||
|
||||
.special-film-heading span {
|
||||
display: block;
|
||||
margin-bottom: 3px;
|
||||
color: #9ed0ff;
|
||||
font-size: 0.74rem;
|
||||
font-weight: 800;
|
||||
letter-spacing: 1.5px;
|
||||
text-transform: uppercase;
|
||||
}
|
||||
|
||||
.special-film-heading h2 {
|
||||
margin: 0;
|
||||
color: #f8fbff;
|
||||
font-size: clamp(1.35rem, 2vw, 2.2rem);
|
||||
}
|
||||
|
||||
.limited-special-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
|
||||
gap: 18px;
|
||||
}
|
||||
|
||||
.limited-special-grid.compact-specials {
|
||||
grid-template-columns: minmax(230px, 420px);
|
||||
}
|
||||
|
||||
.limited-special-card {
|
||||
border-color: rgba(0, 113, 227, 0.3);
|
||||
background:
|
||||
linear-gradient(160deg, rgba(0, 113, 227, 0.15), transparent 42%),
|
||||
var(--card-bg);
|
||||
}
|
||||
|
||||
.limited-special-card .snack-img {
|
||||
background:
|
||||
radial-gradient(circle at 20% 20%, rgba(255, 255, 255, 0.11), transparent 34%),
|
||||
#090d14;
|
||||
}
|
||||
|
||||
.limited-special-card .badge {
|
||||
display: inline-flex;
|
||||
width: max-content;
|
||||
margin-bottom: 8px;
|
||||
}
|
||||
|
||||
.wide-special {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(130px, 42%) 1fr;
|
||||
}
|
||||
|
||||
.wide-special .snack-img {
|
||||
height: 100%;
|
||||
min-height: 220px;
|
||||
}
|
||||
|
||||
.wide-special .snack-info {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
body.theme-light .limited-specials-hero {
|
||||
border-color: rgba(31, 67, 110, 0.14);
|
||||
background:
|
||||
radial-gradient(circle at 12% 16%, rgba(0, 113, 227, 0.18), transparent 34%),
|
||||
radial-gradient(circle at 84% 12%, rgba(255, 188, 104, 0.26), transparent 32%),
|
||||
linear-gradient(135deg, #ffffff, #edf5ff);
|
||||
box-shadow: 0 24px 60px rgba(35, 67, 108, 0.12);
|
||||
}
|
||||
|
||||
body.theme-light .limited-specials-hero h2 {
|
||||
color: #0e1b31;
|
||||
}
|
||||
|
||||
body.theme-light .limited-specials-hero p {
|
||||
color: #314763;
|
||||
}
|
||||
|
||||
body.theme-light .limited-kicker {
|
||||
background: rgba(0, 113, 227, 0.1);
|
||||
border-color: rgba(0, 113, 227, 0.28);
|
||||
color: #0759aa;
|
||||
}
|
||||
|
||||
body.theme-light .special-film-heading {
|
||||
background: rgba(255, 255, 255, 0.86);
|
||||
border-color: rgba(28, 56, 94, 0.14);
|
||||
box-shadow: 0 14px 32px rgba(33, 67, 107, 0.09);
|
||||
}
|
||||
|
||||
body.theme-light .special-film-heading span {
|
||||
color: #0057ae;
|
||||
}
|
||||
|
||||
body.theme-light .special-film-heading h2 {
|
||||
color: #10213a;
|
||||
}
|
||||
|
||||
body.theme-light .limited-special-card {
|
||||
background:
|
||||
linear-gradient(160deg, rgba(0, 113, 227, 0.08), transparent 42%),
|
||||
#ffffff !important;
|
||||
border-color: rgba(0, 113, 227, 0.16) !important;
|
||||
}
|
||||
|
||||
@media (max-width: 760px) {
|
||||
.wide-special {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.wide-special .snack-img {
|
||||
min-height: 180px;
|
||||
}
|
||||
|
||||
.special-film-heading {
|
||||
align-items: flex-start;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user