style: clean footer.scss

core/static/core/footer.scss

@@ -2,10 +2,16 @@
 @import "devices";
 
 footer.bottom-links {
-  >section>a {
+  > section > a {
     text-align: center;
   }
 
+  text-align: center;
+
+  hr {
+    border: none;
+  }
+
   @media (max-width: $small-devices) {
     margin-top: 0.6em;
     padding: 1.25em;
@@ -13,26 +19,21 @@ footer.bottom-links {
 
     display: flex;
     flex-direction: column;
-    align-items: center;
 
     gap: 1.25em;
 
-    >section {
+    > section {
-
       display: flex;
       flex-direction: row;
       flex-wrap: wrap;
       justify-content: center;
       gap: 0.8em;
-
     }
 
     a {
       color: var(--text-white);
-      width: auto;
 
       &:hover {
-        color: var(--text-white);
         text-shadow: 0.5px 0.5px 0.5px var(--bg-darkened-off-white);
       }
     }
@@ -42,50 +43,34 @@ footer.bottom-links {
     }
 
     hr {
-      width: 100%;
+      border-top: var(--bg-white) 1px solid;
-      height: 0;
-      border: none;
-      border-top: 0.5px solid var(--bg-white);
     }
   }
 
+
   @media (min-width: $small-devices) {
     width: 90%;
     margin: 2em auto;
-
     font-size: 90%;
-    text-align: center;
-    vertical-align: middle;
 
     section:first-of-type {
       margin: 0.6em 0;
-      color: var(--text-white);
       border-radius: 5px;
       display: flex;
       flex-wrap: wrap;
       align-items: center;
       background-color: var(--deepblue);
-      box-shadow: var(--bg-white) 0 0 15px;
 
       a {
-        width: auto;
         padding: 0.8em;
         flex: 1;
         font-weight: bold;
+        color: var(--text-white);
 
         &:hover {
-          text-shadow: 0.5px 0.5px 0.5px var(--bg-white);
+          text-shadow: 0.5px 0.5px 0.5px var(--bg-darkened-off-white);
         }
       }
     }
-
-    .fa-github {
-      color: $githubblack;
-    }
-
-    hr {
-      border: none;
-      height: 5px;
-    }
   }
 }

core/static/core/style.scss

@@ -407,28 +407,33 @@ body {
     }
   }
 
-  /* Fontawesome icons */
+}
-  .fa-brands, .fa-link {
-    color: black;
-  }
 
-  .fa-facebook {
+/* Fontawesome icons */
-    color: $faceblue;
+.fa-brands, .fa-link {
-  }
+  color: black;
+}
 
-  .fa-discord {
+.fa-facebook {
-    color: $discordblurple;
+  color: $faceblue;
-  }
+}
 
-  .fa-square-instagram::before, .fa-instagram::before {
+.fa-discord {
-    background: $instagradient;
+  color: $discordblurple;
-    background-clip: text;
+}
-    -webkit-text-fill-color: transparent;
-  }
 
-  .fa-bluesky, .fa-square-bluesky {
+.fa-square-instagram::before, .fa-instagram::before {
-    color: #0f73ff;
+  background: $instagradient;
-  }
+  background-clip: text;
+  -webkit-text-fill-color: transparent;
+}
+
+.fa-bluesky, .fa-square-bluesky {
+  color: #0f73ff;
+}
+
+.fa-github {
+  color: $githubblack;
 }
 
 @media screen and (max-width: $small-devices) {
@@ -519,15 +524,15 @@ th {
   text-align: center;
   padding: 5px 10px;
 
-  >input[type="checkbox"] {
+  > input[type="checkbox"] {
     padding: unset;
   }
 
-  >ul {
+  > ul {
     margin-top: 0;
   }
 
-  >input[type="checkbox"] {
+  > input[type="checkbox"] {
     padding: unset;
   }
 }
@@ -550,7 +555,7 @@ thead {
   color: white;
 }
 
-tbody>tr {
+tbody > tr {
   &:nth-child(even):not(.highlight) {
     background: var(--bg-off-white);
   }