Even more style updates

assets/app.css

@@ -16,6 +16,7 @@
   --side: calc((var(--wide) - var(--narrow)) / 2);
   --header: 8rem;
   --footer: calc(8rem + var(--safe-bottom));
+  --link-color: #3486ff;
 
   --light: 255, 255, 255;
   --dark: 22, 22, 22;
@@ -176,9 +177,11 @@ img {
 /* Header
  -------------------------------------------------- */
 .header {
+  margin-top: 2rem;
   display: flex;
   max-width: var(--wide);
   height: var(--header);
+  align-items: baseline;
 }
 
 .header a {
@@ -194,7 +197,6 @@ img {
 }
 
 .site-name {
-  max-width: calc(100% - 2rem - 3rem);
   padding-bottom: 0.3rem;
   overflow: auto;
   font-size: 3.4rem;
@@ -238,6 +240,10 @@ img {
   background: var(--url) center center no-repeat;
 }
 
+.social a span {
+  visibility: hidden;
+}
+
 .dark .social a {
   filter: invert(1);
 }

assets/home.css

@@ -1,42 +1,37 @@
 /* home.css */
 
-:root {
-    --link-color: #3486ff;
-}
-
-main h1,
-main h2,
-main h3 {
-    margin-top: 4rem;
+.main h1,
+.main h2,
+.main h3 {
+    margin-top: 5rem;
     margin-bottom: 0.7rem;
 }
 
-main h1:first-child {
+.main h1:first-child {
     margin-top: 0;
 }
 
-main a {
+.main a {
     color: var(--link-color);
 }
 
-h1 {
+.main h1 {
     font-size: 5rem;
 }
 
-h2 {
+.main h2 {
     font-size: 3rem;
 }
 
 #homepage-content {
     margin-bottom: 2em;
-    font-size: 2.2rem;
 }
 
-main p:first-child {
+.main p:first-child {
     margin-top: 0;
 }
 
-main p,
-main ul {
+.main p,
+.main ul {
     margin-top: 1.5rem;
 }

assets/style.css

@@ -10,17 +10,6 @@ img {
     border-radius: 4px;
 }
 
-.flex-date {
-    display: flex;
-    align-items: baseline;
-}
-
-.flex-date .date {
-    margin-left: auto;
-    font-size: 80%;
-    font-style: italic;
-}
-
 .draft {
     text-transform: uppercase;
     font-size: 80%;
@@ -32,3 +21,18 @@ img {
     margin-left: 0.5rem;
     background-color: #aaa;
 }
+
+.flex-date {
+    display: flex;
+    align-items: baseline;
+}
+
+.flex-date .date {
+    margin-left: auto;
+    font-size: 80%;
+    font-style: italic;
+}
+
+.post-content a {
+    color: var(--link-color);
+}