simplify header/site-nav styles more

Signed-off-by: Robert Günzler <r@gnzler.io>

2 files changed, 37 insertions, 104 deletions

diff --git a/links/hero.css b/links/hero.css
index 45f3127..bd66c25 100644
--- a/links/hero.css
+++ b/links/hero.css
@@ -20,22 +20,17 @@ main.hero>img {
   max-width: 66vw;
 }
 
-main.hero>nav li+li {
-  margin-top: 5px;
-}
-
-main.hero>nav section+section {
-  margin-top: 15px;
-}
-
 main.hero>nav {
-  float: none;
   width: calc(700px / 2);
 }
 
-main.hero>nav ul {
-  padding-left: 0;
-  margin: 0;
+main.hero>nav section {
+  display: block;
+  margin-left: 1rem;
+}
+
+main.hero>nav section+section {
+  margin-top: 15px;
 }
 
 main.hero>nav section.left {
@@ -53,3 +48,12 @@ main.hero>nav section.right {
   padding-left: 15px;
   border-left: 1px solid var(--fg);
 }
+
+main.hero>nav ul {
+  padding-left: 0;
+  margin: 0;
+}
+
+main.hero>nav li+li {
+  margin-top: 5px;
+}
diff --git a/links/main.css b/links/main.css
index 126a106..06dd322 100644
--- a/links/main.css
+++ b/links/main.css
@@ -33,71 +33,41 @@ body>*+* {
   margin-top: var(--body-spacing);
 }
 
+header {
+  float: left;
+  margin: 0 var(--body-spacing) 0 0;
+}
+
 header a {
   text-decoration: none;
 }
 
 header a img {
+  max-height: 55px;
   vertical-align: bottom;
 }
 
-header h1 {
-  --gap: 10px;
-
-  display: inline-block;
-  margin: 0;
-  padding: 5px;
-
-  border-left: 2px solid var(--fg);
-  margin-left: var(--gap);
-
-  font-weight: 800;
-}
-
-header h1::before {
-  content: "";
-  margin-left: var(--gap);
-}
-
-nav {
-  padding: 0 25px;
-  padding-top: 0;
-  float: right;
-}
-
-nav details summary {
-  margin-bottom: 25px;
+header+nav {
+  margin-top: 0;
 }
 
-nav .site-nav section {
+nav section {
+  display: inline-block;
   line-height: var(--body-line-height);
-  margin-bottom: 40px;
-
-  border-left: 1px solid var(--fg);
-  padding-left: 15px;
-  margin-left: -15px;
-}
-
-nav .site-nav section:first-child {
-  border-width: 2px;
-}
-
-nav .site-nav h1,
-nav .site-nav h2,
-nav .site-nav h3 {
-  margin: 0 0 1rem 0;
+  vertical-align: top;
 }
 
-nav .site-nav h4 {
-  margin: 0 0 0.3rem 0;
+nav section+* {
+  margin-left: 1rem;
 }
 
-nav .site-nav ul {
+nav ul {
   margin: 0px;
   padding: 0px;
 }
 
 main {
+  clear: both;
   max-width: 700px;
 }
 
@@ -406,7 +376,7 @@ main span.date {
   text-align: end;
 }
 
-main>section.table-of-contents {
+main>nav.table-of-contents {
   /*max-width: 30ch;*/
 
   position: sticky;
@@ -416,11 +386,7 @@ main>section.table-of-contents {
   margin-right: -22ch;
 }
 
-main>section.table-of-contents>nav {
-  float: unset;
-}
-
-main>section.table-of-contents>nav>ol>:first-child {
+main>nav.table-of-contents>ol>:first-child {
   text-transform: none;
   line-height: 2.0;
 }
@@ -523,52 +489,15 @@ ul.nobull li {
   ol a {
     line-height: 1.8;
   }
-
-  nav {
-    float: none;
-  }
-
-  nav .site-nav section {
-    display: inline-block;
-    margin: 0 10px 10px 0;
-  }
 }
 
-@media (max-width: 1100px) and (min-width: 651px) {
-  nav .site-nav section {
-    width: calc(25% - 10px);
-  }
+@media (max-width: 1100px) and (min-width: 651px) {}
 
-  nav .site-nav section:nth-child(4n + 1) {
-    clear: left;
-  }
-}
+@media (max-width: 650px) and (min-width: 501px) {}
 
-@media (max-width: 650px) and (min-width: 501px) {
-  nav .site-nav section {
-    width: calc(33% - 10px);
-  }
+@media (max-width: 500px) and (min-width: 351px) {}
 
-  nav .site-nav section:nth-child(3n + 1) {
-    clear: left;
-  }
-}
-
-@media (max-width: 500px) and (min-width: 351px) {
-  nav .site-nav section {
-    width: calc(50% - 10px);
-  }
-
-  nav .site-nav section:nth-child(2n + 1) {
-    clear: left;
-  }
-}
-
-@media (max-width: 350px) {
-  nav .site-nav section {
-    width: 100%;
-  }
-}
+@media (max-width: 350px) {}
 
 /* typography */