Footer mobile

assets/css/baseof.css

@@ -53,6 +53,21 @@ body {
   isolation: isolate;
 }
 
+#links .linkedin,
+#links .github,
+#links .cv-paper-flip,
+#links .mail,
+#nav-toggler svg path {
+  stroke: var(--text);
+}
+
+#links .twitter,
+#links .rss,
+#links .cv,
+#links .moon > path {
+  fill: var(--text);
+}
+
 main {
   width: 85%;
   min-height: 70vh;

assets/css/partials/footer.css

@@ -1,22 +1,34 @@
 :root {
-    --footer-light-background: #ECECEC;
-    --footer-dark-background: #131212;
+  --footer-light-background: #ececec;
+  --footer-dark-background: #131212;
 }
 
 footer {
-    width: 100%;
-    min-height: 25rem;
-    padding: 3rem 5rem;
-    margin-top: 2.5rem;
+  width: 100%;
+  padding: 3rem 8rem;
+  margin-top: 2.5rem;
 
-    display: flex;
-    align-items: start;
-    column-gap: 6rem;
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  row-gap: 5rem;
 
-    background-color: var(--footer-background);
-    color: var(--text);
+  background-color: var(--footer-background);
+  color: var(--text);
 }
 
-footer div {
-    width: 20rem;
-}
+footer #footer-face {
+  display: flex;
+  align-items: center;
+  column-gap: 0.625rem;
+}
+
+footer #links {
+  display: flex;
+  align-items: center;
+  column-gap: 1.5rem;
+}
+
+footer #copyright {
+  font-size: 0.875rem;
+}

assets/css/partials/header.css

@@ -81,20 +81,6 @@ nav #links .theme-toggler {
   margin-right: auto;
 }
 
-#links .linkedin,
-#links .github,
-#links .cv-paper-flip,
-#nav-toggler svg path {
-  stroke: var(--text);
-}
-
-#links .twitter,
-#links .rss,
-#links .cv,
-#links .moon > path {
-  fill: var(--text);
-}
-
 header #nav-toggler {
   display: none;
 }