From ef4ae51b1ffba4f3097573215b9a2c41661d6fde Mon Sep 17 00:00:00 2001
From: benjaminwand <benjamin.wand@web.de>
Date: Tue, 5 Oct 2021 21:07:34 +0200
Subject: [PATCH] besser proportionen bei dingen

---
 public/styles/style.css  | 18 +++++++++++++-----
 public/styles/style.scss | 18 +++++++++++++-----
 2 files changed, 26 insertions(+), 10 deletions(-)

diff --git a/public/styles/style.css b/public/styles/style.css
index fdc5a40..d6a6640 100644
--- a/public/styles/style.css
+++ b/public/styles/style.css
@@ -308,8 +308,8 @@ footer {
   border: 1px solid #6600ea;
 }
 #font-selection ul {
-  -moz-columns: 3 150pt;
-  columns: 3 150pt;
+  -moz-columns: 3 160pt;
+  columns: 3 160pt;
   margin: 0;
   padding: 0;
   border: 0;
@@ -319,7 +319,6 @@ footer {
   min-width: 13em;
   list-style: none;
   line-height: 0;
-  min-height: 44px;
   display: block;
 }
 #font-selection legend {
@@ -330,6 +329,15 @@ footer {
   border: 1px solid #6600ea;
   border-radius: 15px;
 }
+#font-selection label {
+  align-self: center;
+  line-height: max(44px, 1em);
+}
+#font-selection input {
+  vertical-align: -0.5em;
+  height: 30px;
+  width: 30px;
+}
 #font-selection label:hover {
   cursor: pointer;
 }
@@ -349,7 +357,7 @@ footer {
 }
 
 /* Media queries */
-@media only screen and (min-width: 50em) {
+@media only screen and (min-width: 55em) {
   body {
     max-width: 900pt;
   }
@@ -459,7 +467,7 @@ a:focus {
     background: black;
   }
 }
-@media (prefers-color-scheme: dark) and (min-width: 50em) {
+@media (prefers-color-scheme: dark) and (min-width: 55em) {
   #font-selection {
     color: black;
     background: #6600ea;
diff --git a/public/styles/style.scss b/public/styles/style.scss
index 4310d8f..0cb7151 100644
--- a/public/styles/style.scss
+++ b/public/styles/style.scss
@@ -141,8 +141,8 @@ footer {
   border-radius: 15px;
   border: 1px solid $tertiary_light;
   ul {
-    -moz-columns: 3 150pt;
-    columns: 3 150pt;
+    -moz-columns: 3 160pt;
+    columns: 3 160pt;
     margin: 0;
     padding: 0;
     border: 0;
@@ -152,7 +152,6 @@ footer {
     min-width: 13em;
     list-style: none;
     line-height: 0;
-    min-height: 44px;
     display: block;
   }
   legend {
@@ -163,6 +162,15 @@ footer {
     border: 1px solid $tertiary_light;
     border-radius: 15px;
   }
+  label {
+align-self: center;
+    line-height: max(44px, 1em);
+  }
+  input {
+    vertical-align: -0.5em;
+    height: 30px;
+    width: 30px;
+  }
   label:hover {
     cursor: pointer;
   }
@@ -183,7 +191,7 @@ footer {
 }
 
 /* Media queries */
-@media only screen and (min-width: 50em) {
+@media only screen and (min-width: 55em) {
   body {
     max-width: 900pt;
   }
@@ -283,7 +291,7 @@ footer {
   }
 }
 
-@media (prefers-color-scheme: dark) and (min-width: 50em) {
+@media (prefers-color-scheme: dark) and (min-width: 55em) {
   #font-selection {
     color: $gb_dark_2;
     background: $tertiary_dark;
-- 
GitLab