From 5dc403cbdd97ec9659d20d3227de6cb798c27418 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Benjamin=20B=C3=A4dorf?= <hello@benjaminbaedorf.eu>
Date: Sun, 2 Oct 2022 22:46:59 +0200
Subject: [PATCH] Small style fixes

---
 _includes/layouts/default.tsx | 10 ++++++++--
 style.css                     | 20 ++++++++++++++++++--
 2 files changed, 26 insertions(+), 4 deletions(-)

diff --git a/_includes/layouts/default.tsx b/_includes/layouts/default.tsx
index 5565406..e1d4d04 100644
--- a/_includes/layouts/default.tsx
+++ b/_includes/layouts/default.tsx
@@ -38,7 +38,10 @@ export default ({
           <a
             className="ps-page--section-link"
             href="#de"
-          >Deutsche übersetzung unten</a>
+          >
+            Deutsche übersetzung unten
+            <span className="ps-page--section-link-icon">▼</span>
+          </a>
 
           <div
             dangerouslySetInnerHTML={{ __html: md(content.en) }}
@@ -56,7 +59,10 @@ export default ({
           <a
             className="ps-page--section-link"
             href="#en"
-          >English translation above</a>
+          >
+            English translation above 
+            <span className="ps-page--section-link-icon">▲</span>
+          </a>
 
           <div
             dangerouslySetInnerHTML={{ __html: md(content.de) }}
diff --git a/style.css b/style.css
index c5dd892..4fd5971 100644
--- a/style.css
+++ b/style.css
@@ -203,14 +203,23 @@ html {
   background-color: var(--background);
   padding: 1rem;
   display: flex;
+  justify-content: flex-end;
+  align-items: center;
+  text-align: right;
+  padding-left: 132px
 }
 
 @media screen and (min-width: 1200px) {
   .ps-page--section-link {
     display: none;
+    border-bottom: 0;
   }
 }
 
+.ps-page--section-link-icon {
+  margin-left: 8px;
+}
+
 .ps-footer {
   display: flex;
   margin-top: auto;
@@ -310,9 +319,9 @@ html {
   text-decoration: none;
   text-align: center;
   font-weight: 900;
-  font-size: 2rem;
+  font-size: 24px;
+  padding: 8px;
   line-height: 1em;
-  padding: 0.4vw;
   text-shadow: 0.15vw 0px 0px white;
   transition: text-shadow 0.1s ease;
   border: 12px solid black;
@@ -323,3 +332,10 @@ html {
 .ps-homelink:hover {
   text-shadow: 0.3vw 0px 0px var(--accent);
 }
+
+@media screen and (min-width: 1200px) {
+  .ps-homelink {
+    font-size: 32px;
+    padding: 12px;
+  }
+}