M config.yaml → config.yaml

@@ -1,7 +1,7 @@
 title: icyphox's blog
 header: |
     <a href=/>
-    <img class="logo" src="/static/white.svg" alt="icyphox's avatar"/>
+    <img src="/static/white.svg" alt="icyphox's avatar" height="70"/>
     </a>
     <nav>
     <a href="/">blog</a>
@@ -18,7 +18,6 @@ name: "Anirudh Oppiliappan"
      email: "x@icyphox.sh"
 syntax: 'bw'
 footer: |
-    <hr>
     <section class="icons">
         <a href="https://creativecommons.org/licenses/by-nc-sa/4.0/">
         <img class="footimgs" alt="cc nc-by-sa" src="/static/cc.svg">

M static/style.css → static/style.css

@@ -12,12 +12,25 @@
 * {
   box-sizing: border-box;
   text-decoration: none;
+  padding: 0;
+  margin: 0;
 }
 
 main {
-  padding: 10px;
   font-family: serif;
-  font-size: 16px
+  font-size: 16px;
+  padding: 0;
+  margin: 10px;
+  line-height: 160%;
+}
+
+main h2:first-of-type {
+  font-size: 20px;
+  padding: 0 0 20px 0;
+}
+
+main h1, h2, h3 {
+  padding: 30px 0 20px 0;  
 }
 
 .icons img {
@@ -36,10 +49,6 @@ padding: 0;
   box-sizing: border-box;
   text-decoration: none;
   color: #000
-}
-
-main {
-  margin: 0;
 }
 
 main a {
@@ -57,18 +66,22 @@ }
 
 body {
   max-width: 640px;
+  padding: 30px;
+  margin: 0;
 }
 
-main img {
+main article img {
   max-width: 100%;
   display: block;
-  margin: 0 0 15px;
+  margin: 0 0 15px 0;
 }
 
-main h2 {
-  font-size: 20px;
-  margin: 0px;
-  padding: 0px;
+main ul, main ol {
+	margin: 0 30px 30px 30px
+}
+
+main ul ul {
+	margin-bottom: 0
 }
 
 .subtitle {
@@ -77,10 +90,6 @@ font-weight: normal;
   font-variant: unset;
   color: var(--dark);
   padding-bottom: 20px;
-}
-
-header img {
-  max-width: 10%;
 }
 
 .muted {
@@ -115,6 +124,7 @@
 .index-date {
   white-space: nowrap;
   vertical-align: baseline;
+  color: var(--gray);
 }
 
 .index-post {
@@ -123,7 +133,7 @@ }
 
 nav {
   float: right;
-  transform: translateY(-200%);
+  transform: translateY(30%);
 }
 
 hr {
@@ -133,5 +143,13 @@ margin: 20px 0 20px 0;
 }
 
 footer {
-  margin: 20px 0 40px 0px;
+  margin: 20px 0 40px 10px;
+}
+
+header img {
+  transform: translateY(-30%);
+}
+
+.post-date {
+  color: var(--gray);
 }

M templates/text.html → templates/text.html

@@ -28,12 +28,11 @@ <h1>{{ .Fm.Title }}</h1>
       <h2 class="subtitle">{{ .Fm.Subtitle }}</h2>
       {{ .Fm.Body }} 
     </article>
-  </main>
-  <footer>
     <p class="muted">Questions or comments? 
     Send an email to 
     <a href="mailto:~icyphox/x@lists.sr.ht?Subject=Re: {{ .Fm.Title }}">~icyphox/x@lists.sr.ht</a> — my <a href="https://lists.sr.ht/~icyphox/x">public inbox</a>.</p>
-
+  </main>
+  <footer>
     {{ .Cfg.Footer }}
   </footer>
 </body>