Moar stuph

resources/views/home.antlers.html

@@ -1,22 +1,80 @@
-
-    <section class="container bg-yellow-400 mx-auto px-4 py-16 text-center min-h-screen flex items-center">
-        <img src="{{ hfs:logo }}" alt="">
-    </section>
-
-<article class="mt-4 bg-white dark:bg-gray-900 p-8 shadow-xl rounded-2xl max-w-xl prose prose-slate dark:prose-invert">
-    {{ content | widont }}
-</article>
-<section class="border border-yellow-400 mt-12">
-    <h2 class="p-5">Tournaments</h2>
-    <div class="grid grid-cols-1 md:grid-cols-3 gap-4 mt-8 text-sm text-yellow-400">
-    {{ collection:tournaments type:is="stier" }}
-            <a href="{{ url }}"
-               style="background-image: url('{{ backdrop }}');"
-               class="flex items-center justify-between p-5 border-t border-yellow-400 text-yellow-400 hover:text-yellow-900 hover:bg-yellow-400 bg-cover bg-center">
-                <span>{{ title }}</span>
-                <span class="text-yellow-900 text-sm">{{ date }}</span>
-                <img src="{{logo}}" alt="title">
-            </a>
-    {{ /collection:tournaments }}
+<section class="section hero is-primary is-fullheight">
+    <div class="hero-body">
+        <img src="{{ hfs:logo }}" alt="HFS SUMMER JAM" class=""/>
     </div>
 </section>
+
+<section id="reel">
+    <video autoplay loop muted playsinline>
+        <source src="https://fr.getsamplefiles.com/download/mp4/sample-5.mp4" type="video/mp4">
+        Your browser does not support the video tag.
+    </video>
+</section>
+
+<section class="section has-background-primary has-text-black" id="catch">
+    <span class="is-size-1 has-text-weight-bold is-uppercase">
+        {{ content | widont }}
+    </span>
+</section>
+
+<section class="section" id="tournaments">
+    <h2>Tournaments</h2>
+    <h3>Stier</h3>
+    <div class="fixed-grid has-3-cols">
+        <div class="grid">
+            {{ collection:tournaments type:is="stier" }}
+                {{  partial:_tournamentblock  }}
+            {{ /collection:tournaments }}
+        </div>
+    </div>
+
+    <h3>Atier</h3>
+    <div class="fixed-grid has-3-cols">
+        <div class="grid">
+            {{ collection:tournaments type:is="atier" }}
+            {{  partial:_tournamentblock  }}
+            {{ /collection:tournaments }}
+        </div>
+    </div>
+
+    <h3>Rythm Tier</h3>
+    <div class="fixed-grid has-3-cols">
+        <div class="grid">
+            {{ collection:tournaments type:is="rythm" }}
+            {{  partial:_tournamentblock  }}
+            {{ /collection:tournaments }}
+        </div>
+    </div>
+
+    <h3>Family Tier</h3>
+    <div class="fixed-grid has-3-cols">
+        <div class="grid">
+            {{ collection:tournaments type:is="family" }}
+            {{  partial:_tournamentblock  }}
+            {{ /collection:tournaments }}
+        </div>
+    </div>
+</section>
+
+<section class="section" id="about">About</section>
+<section class="section" id="gallery">Gallery</section>
+<section class="section" id="questions">FAQ</section>
+<section class="section" id="tickets">
+    <h2>Tickets</h2>
+    {{ collection:prices sort="order asc" }}
+        <div>
+            <h3>{{ title }}</h3>
+            <p>{{ price }}</p>
+            <a href="" class="button is-primary">Buy Ticket</a>
+        </div>
+    {{ /collection:prices }}
+</section>
+
+<section class="section" id="sponsors">
+    <h2>Sponsors</h2>
+    {{ collection:sponsors sort="order asc" }}
+        <span>
+            <img src="{{ glide:logo preset='logo' }}" alt="{{ logo:alt }}">
+        </span>
+    {{ /collection:sponsors }}
+</section>