From c91caf72e00d46da1ef80ecae125b0642becdc13 Mon Sep 17 00:00:00 2001
From: Lyn Fugmann <lyn.fugmann@ifsr.de>
Date: Sun, 15 Sep 2024 15:36:23 +0200
Subject: [PATCH 1/2] basic footer styles

---
 _includes/footer.njk | 41 ++++++++++++++++++++++++++++++++++-------
 1 file changed, 34 insertions(+), 7 deletions(-)

diff --git a/_includes/footer.njk b/_includes/footer.njk
index 8d06492..9d2c560 100644
--- a/_includes/footer.njk
+++ b/_includes/footer.njk
@@ -1,5 +1,5 @@
 <footer>
-  <div>
+  <div class="footer-container">
     {% set otherLang = page.url | locale_links | first %}
     <a href="{{otherLang.url}}" lang="{{otherLang.lang}}" hreflang="{{otherLang.lang}}">
       {% if otherLang.lang == "de" %}
@@ -8,15 +8,42 @@
         English Version 🇬🇧/🇺🇸
       {% endif %}
     </a>
-    <nav>
+    <nav id="footerNav">
       {{ collections.footerNav | pageLang | eleventyNavigation | eleventyNavigationToHtml | safe }}
     </nav>
-  </div>
-  <div>
-    <p>
+    <span>
       Design:
       <a href="https://designtoasty.de" target="_blank" rel="noreferrer">Designtoasty</a>
-    </p>
-    <p>Made with 🧉 and 🌈 in Dresden</p>
+    </span>
+    <span>Made with 🧉 and 🌈 in Dresden</span>
   </div>
 </footer>
+
+{% css %}
+footer {
+  border-top: 1px dotted rgba(0,0,0,.15);
+  padding: 4rem 0;
+}
+#footerNav ul {
+  margin: 0;
+  padding: 0;
+  display: flex;
+  gap: 1em;
+}
+#footerNav li {
+  display: inline;
+}
+.footer-container {
+  max-width: 75rem;
+  margin-left: auto;
+  margin-right: auto;
+  display: grid;
+  grid-template-columns: auto auto;
+  grid-auto-flow: column;
+  grid-template-rows: 1fr 1fr;
+  gap: 1em;
+}
+.footer-container > :nth-last-child(-n + 2) {
+  text-align: end;
+}
+{% endcss %}

From 5cdcab990787f5d0eaab90a3d900402acddd5e5a Mon Sep 17 00:00:00 2001
From: Lyn Fugmann <lyn.fugmann@ifsr.de>
Date: Sun, 15 Sep 2024 16:11:29 +0200
Subject: [PATCH 2/2] more page styles

---
 _includes/footer.njk | 2 +-
 _includes/header.njk | 2 +-
 _layouts/page.njk    | 9 +++++++++
 3 files changed, 11 insertions(+), 2 deletions(-)

diff --git a/_includes/footer.njk b/_includes/footer.njk
index 9d2c560..41f5ace 100644
--- a/_includes/footer.njk
+++ b/_includes/footer.njk
@@ -34,7 +34,7 @@ footer {
   display: inline;
 }
 .footer-container {
-  max-width: 75rem;
+  max-width: var(--page-width);
   margin-left: auto;
   margin-right: auto;
   display: grid;
diff --git a/_includes/header.njk b/_includes/header.njk
index 42567a6..b1e704d 100644
--- a/_includes/header.njk
+++ b/_includes/header.njk
@@ -16,7 +16,7 @@ header {
   padding: 2rem 0;
 }
 .header-container {
-  max-width: 75rem;
+  max-width: var(--page-width);
   margin-left: auto;
   margin-right: auto;
   display: flex;
diff --git a/_layouts/page.njk b/_layouts/page.njk
index 4ea16b3..c470456 100644
--- a/_layouts/page.njk
+++ b/_layouts/page.njk
@@ -23,8 +23,17 @@ eleventyComputed:
 </html>
 
 {% css %}
+:root {
+  --page-width: 75rem;
+}
 body {
   font-family: sans-serif;
   margin: 0;
+  font-size: 17px;
+}
+main {
+  max-width: var(--page-width);
+  margin-left: auto;
+  margin-right: auto;
 }
 {% endcss %}