From c7901db02b47e0cb40054de9511ea6ffbee198bf Mon Sep 17 00:00:00 2001
From: Odyssey <hi@odyssey346.dev>
Date: Mon, 13 Feb 2023 17:56:25 +0100
Subject: [PATCH] UI fixes

Signed-off-by: Odyssey <hi@odyssey346.dev>
---
 public/css/global.css | 55 ++++++++++++++++++++++---------------------
 views/user.html       |  8 ++++---
 2 files changed, 33 insertions(+), 30 deletions(-)

diff --git a/public/css/global.css b/public/css/global.css
index 38660d0..d792654 100644
--- a/public/css/global.css
+++ b/public/css/global.css
@@ -12,6 +12,7 @@
     --secondary-background: #353535;
     --background-darker: #151515;
     --accent: #00b7c3;
+    color-scheme: dark;
 }
 
 body {
@@ -19,6 +20,7 @@ body {
     color: #FFF;
     background-color: #151515;
     transition: ease-in-out .25s;
+    margin: 0;
 }
 
 ::-webkit-scrollbar {
@@ -41,6 +43,10 @@ main {
     justify-content: space-between;
     flex-direction: row;
     padding: 8px;
+
+    margin-bottom: 8px;
+
+    background-color: var(--background);
 }
 
 .indexGitHub {
@@ -71,7 +77,7 @@ main {
 .error {
     background-color: #252525;
     padding: 8px;
-    border-radius: 8px;
+    border-radius: 4px;
     font-family: 'Lato', sans-serif;
     color: #fff;
 }
@@ -95,7 +101,7 @@ a:hover {
 .exploreIDontKnowWhatToNameThisDiv {
     background-color: #252525;
     padding: 8px;
-    border-radius: 8px;
+    border-radius: 4px;
     margin: 8px 0 8px 0;
 
     text-overflow: ellipsis;
@@ -116,7 +122,7 @@ a:hover {
 .userProfile {
     background-color: var(--background);
     padding: 8px;
-    border-radius: 8px;
+    border-radius: 4px;
     margin: 8px;
     display: flex;
     flex-direction: column;
@@ -146,14 +152,14 @@ a:hover {
 .userBio, .userReadme {
     background-color: var(--background);
     padding: 8px;
-    border-radius: 8px;
+    border-radius: 4x;
     margin: 8px;
 }
 
 .userBioText, .userReadmeText {
     background-color: var(--background-darker);
     padding: 8px;
-    border-radius: 8px;
+    border-radius: 4px;
     margin-bottom: 0;
 }
 
@@ -161,11 +167,16 @@ a:hover {
     margin-top: 0;
 }
 
+.sociallinks {
+    display: flex;
+    flex-direction: row;
+}
+
 /* URI: /:user/:repo */
 .button {
     background-color: var(--background);
     padding: 8px;
-    border-radius: 8px;
+    border-radius: 4px;
     margin: 8px;
     color: var(--text);
     text-decoration: none;
@@ -200,7 +211,7 @@ a:hover {
 /* URI: /file/:user/:repo/:file */
 .userReadme pre {
     padding: 8px;
-    border-radius: 8px;
+    border-radius: 4px;
     /*white-space: pre-wrap;*/
     overflow-x: auto;
 }
@@ -220,20 +231,15 @@ a:hover {
 @media screen and (prefers-color-scheme: light) {
     :root {
         --text: #000;
-        --background: #f1f1f1;
-        --secondary-background: #e1e1e1;
-        --background-darker: #fff;
+        --background: #ececec;
+        --secondary-background: #f5f5f5;
+        --background-darker: #dddddd;
+        color-scheme: light;
     }
     body {
-        background-color: #fff;
+        background-color: var(--background-darker);
         color: #000;
     }
-    .navbarSlogan {
-        color: #00b7c3;
-    }
-    .brand:hover {
-        opacity: .75;
-    }
     a {
         color: black;
     }
@@ -241,18 +247,9 @@ a:hover {
         color: #00b7c3;
     }
     .exploreIDontKnowWhatToNameThisDiv {
-        background-color: #f1f1f1;
+        background-color: var(--background);
         color: #000;
     }
-    ::-webkit-scrollbar {
-        width: 8px;
-        height: 10px;
-
-    }
-    ::-webkit-scrollbar-thumb {
-        border-radius: 8px;
-        background: #f1f1f1;
-    }
 }
 
 @media screen and (max-width: 900px) {
@@ -273,4 +270,8 @@ a:hover {
         margin-bottom: 8px;
         margin-right: 0;
     }
+
+    .sociallinks {
+        flex-direction: column;
+    }
 }
diff --git a/views/user.html b/views/user.html
index dd47b53..493ee70 100644
--- a/views/user.html
+++ b/views/user.html
@@ -17,9 +17,9 @@
                 {{ else }}
                 <p><b>{{.Followers}}</b> followers</p>
                 {{ end }}
-				{{ if .StatusEmoji }}
-				<p>{{.StatusEmoji}} {{.Status}}</p>
-				{{ end }}
+                {{ if .StatusEmoji}}
+                <p>{{.StatusEmoji}} {{.Status}}</p>
+                {{ end }}
                 {{ if .Location }}
                 <p>🌍 {{.Location}}</p>
                 {{ end }}
@@ -33,9 +33,11 @@
 				<p>✉️  {{.Email}}</p>
 				{{ end }}
 				{{ if .Social }}
+                <div class="sociallinks">
 				{{range .Social}}
 				<p>🔗 <a href="{{.}}" target="_blank">{{.}}</a></p>
 				{{ end }}
+                </div>
 				{{ end }}
 				{{ if .Organizations }}
 				<p>Organizations: