fix footer styling

2022-12-21 22:43:41 +01:00
parent e75a47e528
commit 5dae92c111
4 changed files with 139 additions and 120 deletions
--- a/Webauftritt/eportfolio/impressions.html
+++ b/Webauftritt/eportfolio/impressions.html
@@ -4,23 +4,27 @@
    <meta charset="UTF-8">
    <title>Beispiele</title>
 </head>
-<body class="bg-primary">
+<body class="bg-primary flex flex-col min-h-screen">

 {{> nav impressionsActive=true}}

-<h1 class="flex justify-center">Impressionen</h1>
+<div class="home grow">

-<div class="flex justify-center">
+    <h1 class="flex justify-center">Impressionen</h1>
+
+    <div class="flex justify-center">
        <iframe width="560" height="315" src="https://www.youtube.com/embed/bruNTJCsZPM?controls=0"
                title="YouTube video player"
                allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
                allowfullscreen></iframe>
-</div>
+    </div>

-<div class="flex flex-col items-center">
+    <div class="flex flex-col items-center">
        <img class="w-1/2 m-10" src="https://res.cloudinary.com/dgyrt6b4m/image/upload/v1671645823/stones_colored.jpg"/>
-    <img class="w-1/2 m-10" src="https://res.cloudinary.com/dgyrt6b4m/image/upload/v1671645801/no_advertisements.jpg"/>
+        <img class="w-1/2 m-10"
+             src="https://res.cloudinary.com/dgyrt6b4m/image/upload/v1671645801/no_advertisements.jpg"/>
        <img class="w-1/2 m-10" src="https://res.cloudinary.com/dgyrt6b4m/image/upload/v1671645802/anti_glare.jpg"/>
+    </div>
 </div>

 {{> footer }}
--- a/Webauftritt/eportfolio/index.html
+++ b/Webauftritt/eportfolio/index.html
@@ -6,13 +6,14 @@
    <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
    <title>Curling E-Portfolio</title>
 </head>
-<body class="bg-primary">
+<body class="bg-primary flex flex-col min-h-screen">

 {{> nav homeActive=true }}

-<h1 class="flex justify-center">Welcome to the world of Curling!</h1>
+<div class="home grow">
+    <h1 class="flex justify-center">Welcome to the world of Curling!</h1>

-<div class="h-40 bg-banner flex justify-between items-center px-40 mb-14">
+    <div class="h-40 bg-banner flex justify-between items-center px-40 mb-14">
        <a href="rules.html" class="flex flex-col align-middle">
            <img src="/rules.svg" alt="Regeln" class="w-20 h-20"/>
            <p class="text-center">Regeln</p>
@@ -25,6 +26,7 @@
            <img src="/extension.svg" alt="Beispiele" class="w-20 h-20"/>
            <p class="text-center">Beispiele</p>
        </a>
+    </div>
 </div>

 {{> footer }}
--- a/Webauftritt/eportfolio/rules.html
+++ b/Webauftritt/eportfolio/rules.html
@@ -4,13 +4,15 @@
    <meta charset="UTF-8">
    <title>Rules</title>
 </head>
-<body class="bg-primary">
+<body class="bg-primary flex flex-col min-h-screen">

 {{> nav rulesActive=true }}

-<h1 class="flex justify-center">Regeln</h1>
+<div class="home grow">

-<div class="h-full grid grid-cols-3 gap-0.5 content-start p-16">
+    <h1 class="flex justify-center">Regeln</h1>
+
+    <div class="h-full grid grid-cols-3 gap-0.5 content-start p-16">
        {{> ruleitem
        image="/rules/fgz.svg"
        imageAlt="Free Guard Zone"
@@ -23,7 +25,8 @@
        image="/rules/validStone.svg"
        imageAlt="Gültigkeitsbereich Steine"
        title="Gültigkeit der Steine"
-    description="Die Steine sind nicht überall gültig. So müssen sie zwischen Hog-Line und Back-Line liegen, um gültig zu sein.
+        description="Die Steine sind nicht überall gültig. So müssen sie zwischen Hog-Line und Back-Line liegen, um
+        gültig zu sein.
        (im Bild grün markiert)"
        }}

@@ -31,7 +34,8 @@
        image="/rules/broomVsStone.svg"
        imageAlt="Wischbereich gegnerischer Stein"
        title="Wischen des gegnerischen Steins"
-    description="Hinter der Tee-Line (grün eingezeichneter Bereich) darf ein gegnerischer Stein durch jemanden gewischt werden.
+        description="Hinter der Tee-Line (grün eingezeichneter Bereich) darf ein gegnerischer Stein durch jemanden
+        gewischt werden.
        So kann dieser aus dem Spiel genommen werden."
        }}

@@ -39,7 +43,8 @@
        image="/rules/stoneOrder.svg"
        imageAlt="Steinreihenfolge"
        title="Steinreihenfolge"
-    description="Die je acht Steine pro Team werden alternierend gespielt. Zu beginn des Spiels wird jeweils ausgelost, welches
+        description="Die je acht Steine pro Team werden alternierend gespielt. Zu beginn des Spiels wird jeweils
+        ausgelost, welches
        Team das Recht des letzten Stein bekommt. Das andere Team beginnt dann logischerweise das Spiel."
        }}

@@ -47,10 +52,13 @@
        image="/rules/countOrder.svg"
        imageAlt="Zählung des Spielstands"
        title="Zählen des Spielstandes"
-    description="Um am Ende eines Spiels den Spielstand herauszufinden, werden die Steine vom Zentrum her weg gezählt. Sobald
-    ein gegnerischer Stein näher ist, zählen nur alle bis dahin gezählten Steine. Im obigen Spielstand wären das zwei Steine für
+        description="Um am Ende eines Spiels den Spielstand herauszufinden, werden die Steine vom Zentrum her weg
+        gezählt. Sobald
+        ein gegnerischer Stein näher ist, zählen nur alle bis dahin gezählten Steine. Im obigen Spielstand wären das
+        zwei Steine für
        gelb, obwohl noch zwei rote Steine im Haus liegen."
        }}
+    </div>
 </div>

 {{> footer }}
--- a/Webauftritt/eportfolio/spiritofcurling.html
+++ b/Webauftritt/eportfolio/spiritofcurling.html
@@ -4,17 +4,19 @@
    <meta charset="UTF-8">
    <title>Spirit of Curling</title>
 </head>
-<body class="bg-primary">
+<body class="bg-primary flex flex-col min-h-screen">

 {{> nav spiritActive=true}}

-<div class="flex flex-col items-center">
+<div class="home grow">
+
+    <div class="flex flex-col items-center">
        <h1 class="">Spirit of Curling</h1>
        <p class="text-center w-6/12">Der Spirit of Curling ist eine Art Regelwerk, welches beschreibt wie
            ein Curler den Respekt gegenüber den Mitspielern, Gegnern und dem Sport selbst zeigen soll.</p>
-</div>
+    </div>

-<div class="h-full grid grid-cols-3 gap-0.5 content-start p-16">
+    <div class="h-full grid grid-cols-3 gap-0.5 content-start p-16">
        {{> spiritofcurlingitem
        title="Manieren"
        description="Ein Curler verhält sich imemr anständig, zuvorkommend und wie ein Gentleman."
@@ -29,7 +31,8 @@

        {{> spiritofcurlingitem
        title="Keine Ablenkung"
-    description="Ein Curler wird nie versuchen seinen Gegner abzulenken oder ihn daran zu hindern, sein Bestes zu tun."
+        description="Ein Curler wird nie versuchen seinen Gegner abzulenken oder ihn daran zu hindern, sein Bestes zu
+        tun."
        image="/spiritofcurling/distraction.png"
        imageAlt="Icon Ablenkung"}}

@@ -54,7 +57,8 @@

        {{> spiritofcurlingitem
        title="Keine verstösse gegen Spielregeln"
-    description="Ein Curler verstösst nie absichtlich gegen Spielregeln oder eine der geschriebenen oder ungeschriebenen
+        description="Ein Curler verstösst nie absichtlich gegen Spielregeln oder eine der geschriebenen oder
+        ungeschriebenen
        Überlieferungen"
        image="/spiritofcurling/prohibited.png"
        imageAlt="Icon Verboten"}}
@@ -70,6 +74,7 @@
        description="Ein Curler entscheidet sich in Streitfragen immer zu Gunsten seines Gegners."
        image="/spiritofcurling/friendly.png"
        imageAlt="Icon Freundlich"}}
+    </div>
 </div>

 {{> footer }}