line-up/lineup.html hinzugefügt

line-up/lineup.html

@@ -0,0 +1,173 @@
+<style>
+    /* CSS für das Kachel-Layout (Grid) */
+    .fuyu-grid {
+        display: grid;
+        grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
+        gap: 30px;
+        margin-top: 20px;
+        margin-bottom: 50px;
+    }
+
+    .fuyu-card {
+        background: #ffffff;
+        border-radius: 16px;
+        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05);
+        overflow: hidden;
+        transition: transform 0.3s ease, box-shadow 0.3s ease;
+        border: 1px solid #fce7f3;
+    }
+
+    .fuyu-card:hover {
+        transform: translateY(-5px);
+        box-shadow: 0 8px 25px rgba(219, 39, 119, 0.15);
+    }
+
+    .fuyu-card-img {
+        width: 100%;
+        height: 200px;
+        object-fit: cover;
+        border-bottom: 3px solid #db2777; /* Fuyuzakura Pink */
+    }
+
+    .fuyu-card-content {
+        padding: 20px;
+    }
+
+    .fuyu-card-title {
+        color: #312e81;
+        font-size: 1.25rem;
+        font-weight: 700;
+        margin-top: 0;
+        margin-bottom: 10px;
+    }
+
+    .fuyu-card-meta {
+        font-size: 0.85rem;
+        color: #db2777;
+        font-weight: 600;
+        margin-bottom: 15px;
+    }
+
+    .fuyu-card-text {
+        font-size: 0.95rem;
+        color: #4b5563;
+        line-height: 1.5;
+        margin-bottom: 15px;
+    }
+
+    .fuyu-card-link {
+        display: inline-block;
+        color: #db2777;
+        font-weight: 600;
+        text-decoration: none;
+        font-size: 0.9rem;
+    }
+
+    .fuyu-card-link:hover {
+        text-decoration: underline;
+    }
+</style>
+
+
+<p>Willkommen zur großen Übersicht! Hier präsentieren wir dir stolz das offizielle <strong>Line-up der Fuyuzakura Con</strong>. Entdecke, welche großartigen ShowActs unsere Hauptbühne in der <a href="/location/">Willy-Brandt-Halle in Mühlheim</a> rocken, welche talentierten Künstler in der Zeichnerallee auf dich warten und bei welchen Händlern du dir das beste Merchandise sichern kannst.</p>
+
+
+<h2>🎤 ShowActs &amp; Bühnenprogramm</h2>
+<p>Freu dich auf ein abwechslungsreiches Programm voller Energie! Unser Bühnen-Line-up bringt dir die beste Unterhaltung direkt aus der Anime- und Popkultur.</p>
+
+<div class="fuyu-grid">
+    <!-- ShowAct Karte 1 -->
+    <div class="fuyu-card">
+        <img src="https://via.placeholder.com/600x400" alt="ShowAct im Line-up Fuyuzakura Con" class="fuyu-card-img">
+        <div class="fuyu-card-content">
+            <h3 class="fuyu-card-title">Name der Idol-Gruppe</h3>
+            <div class="fuyu-card-meta">📅 Samstag, 14:00 Uhr | 📍 Hauptbühne</div>
+            <p class="fuyu-card-text">Diese fantastische Tanzgruppe bringt die Bühne zum Beben. Freut euch auf energiegeladene J-Pop und K-Pop Cover-Tänze im originalgetreuen Cosplay!</p>
+            <a href="https://instagram.com/deinlink" target="_blank" rel="noopener" class="fuyu-card-link">Mehr über die Gruppe →</a>
+        </div>
+    </div>
+
+    <!-- ShowAct Karte 2 -->
+    <div class="fuyu-card">
+        <img src="https://via.placeholder.com/600x400" alt="Cosplay Panel auf der Fuyuzakura Con" class="fuyu-card-img">
+        <div class="fuyu-card-content">
+            <h3 class="fuyu-card-title">Cosplay Rüstungsbau Panel</h3>
+            <div class="fuyu-card-meta">📅 Samstag, 16:30 Uhr | 📍 Panelraum 1</div>
+            <p class="fuyu-card-text">Unser Special Guest teilt seine besten Tipps zum Thema Rüstungsbau mit Worbla und Schaumstoff. Perfekt, um dein nächstes Cosplay aufs nächste Level zu heben.</p>
+            <a href="https://instagram.com/deinlink" target="_blank" rel="noopener" class="fuyu-card-link">Zum Instagram-Profil →</a>
+        </div>
+    </div>
+</div>
+
+
+<h2>🎨 Künstler &amp; Zeichnerallee</h2>
+<p>In unserer gemütlichen Zeichnerallee präsentieren handverlesene Künstler aus ganz Deutschland ihre Werke. Support your local artists und entdecke einzigartige Fanarts und Merchandise-Kreationen!</p>
+
+<div class="fuyu-grid">
+    <!-- Künstler Karte 1 -->
+    <div class="fuyu-card">
+        <img src="https://via.placeholder.com/600x400" alt="Künstler in der Zeichnerallee Line-up Fuyuzakura Con" class="fuyu-card-img">
+        <div class="fuyu-card-content">
+            <h3 class="fuyu-card-title">Künstlername Eins</h3>
+            <div class="fuyu-card-meta">🌸 Stand: Z-01 | Aquarell &amp; Pins</div>
+            <p class="fuyu-card-text">Spezialisiert auf fantastische Aquarell-Illustrationen, süße Enamel-Pins und handgemachte Aufkleber von deinen Lieblings-Anime.</p>
+            <a href="https://twitter.com/deinlink" target="_blank" rel="noopener" class="fuyu-card-link">Zum Portfolio →</a>
+        </div>
+    </div>
+
+    <!-- Künstler Karte 2 -->
+    <div class="fuyu-card">
+        <img src="https://via.placeholder.com/600x400" alt="Manga Künstler Fuyuzakura" class="fuyu-card-img">
+        <div class="fuyu-card-content">
+            <h3 class="fuyu-card-title">Künstlername Zwei</h3>
+            <div class="fuyu-card-meta">🌸 Stand: Z-02 | Manga &amp; Prints</div>
+            <p class="fuyu-card-text">Bringt euch exklusive Prints im Shōnen-Stil und spannende Eigenproduktionen mit. Verpasst nicht die limitierten Acryl-Anhänger!</p>
+            <a href="https://etsy.com/deinlink" target="_blank" rel="noopener" class="fuyu-card-link">Zum Online-Shop →</a>
+        </div>
+    </div>
+    
+    <!-- Künstler Karte 3 -->
+    <div class="fuyu-card">
+        <img src="https://via.placeholder.com/600x400" alt="Handgemachte Kunst auf der Fuyuzakura Con" class="fuyu-card-img">
+        <div class="fuyu-card-content">
+            <h3 class="fuyu-card-title">Künstlername Drei</h3>
+            <div class="fuyu-card-meta">🌸 Stand: Z-03 | Plüsch &amp; Charms</div>
+            <p class="fuyu-card-text">Wer es flauschig mag, ist hier genau richtig: Handgenähte Plüschtiere, Taschen und detailverliebte Charms für dein Itabag.</p>
+            <a href="https://instagram.com/deinlink" target="_blank" rel="noopener" class="fuyu-card-link">Zum Instagram-Profil →</a>
+        </div>
+    </div>
+</div>
+
+
+<h2>🛍️ Händler &amp; Merchandise</h2>
+<p>Was wäre das Line-up einer Convention ohne ordentlich Loot? In unserem Händlerbereich findest du alles, was das Otaku-Herz begehrt – von offiziellen Figuren bis zu japanischen Snacks.</p>
+
+<div class="fuyu-grid">
+    <!-- Händler Karte 1 -->
+    <div class="fuyu-card">
+        <img src="https://via.placeholder.com/600x400" alt="Händler für Anime Figuren auf der Fuyuzakura" class="fuyu-card-img">
+        <div class="fuyu-card-content">
+            <h3 class="fuyu-card-title">Figur-Shop Name</h3>
+            <div class="fuyu-card-meta">🛒 Stand: H-01 | Figuren &amp; Merch</div>
+            <p class="fuyu-card-text">Dein Fachhändler für importierte Anime-Figuren, Nendoroids und exklusive Gacha-Artikel direkt aus Japan.</p>
+            <a href="https://shoplink.de" target="_blank" rel="noopener" class="fuyu-card-link">Zur Website →</a>
+        </div>
+    </div>
+
+    <!-- Händler Karte 2 -->
+    <div class="fuyu-card">
+        <img src="https://via.placeholder.com/600x400" alt="Japanische Snacks Fuyuzakura Con" class="fuyu-card-img">
+        <div class="fuyu-card-content">
+            <h3 class="fuyu-card-title">Snack-Oase</h3>
+            <div class="fuyu-card-meta">🛒 Stand: H-02 | Ramune &amp; Sweets</div>
+            <p class="fuyu-card-text">Hol dir eine Stärkung! Eine riesige Auswahl an Pocky, Ramune, Mochi und weiteren original japanischen Snacks wartet auf dich.</p>
+        </div>
+    </div>
+</div>
+
+<!-- Call to Action -->
+<div style="background-color: #fce7f3; padding: 30px; border-radius: 16px; margin-top: 50px; text-align: center;">
+    <h3 style="color: #db2777; margin-top: 0; font-size: 1.5rem;">Du willst dieses Line-up nicht verpassen?</h3>
+    <p style="color: #4b5563; margin-bottom: 20px;">Sichere dir jetzt dein Ticket für die Convention und erlebe alle ShowActs, Händler und Künstler live in Mühlheim!</p>
+    <a href="/tickets/" style="display: inline-block; background-color: #db2777; color: white; padding: 12px 25px; text-decoration: none; border-radius: 50px; font-weight: bold; font-size: 1.1rem; box-shadow: 0 4px 10px rgba(219,39,119,0.3); transition: transform 0.2s ease;">🎟️ Zum Ticket-Shop</a>
+</div>