From c265749a767470e070a6b6407383f9c8d15e4085 Mon Sep 17 00:00:00 2001
From: Gabriel Arazas <foodogsquared@foodogsquared.one>
Date: Sat, 18 Mar 2023 18:34:56 +0800
Subject: [PATCH] Update site style

---
 assets/scss/extend.scss | 28 ++++++++++++++++------------
 1 file changed, 16 insertions(+), 12 deletions(-)

diff --git a/assets/scss/extend.scss b/assets/scss/extend.scss
index 15c954c..5077879 100644
--- a/assets/scss/extend.scss
+++ b/assets/scss/extend.scss
@@ -3,8 +3,6 @@ $tooltip-size: 5em;
 $line-height: 1.45;
 
 :root {
-  --accented-border-style: var(--foreground) solid 0.1vw;
-
   --body-family: "Source Serif Pro", "IBM Plex Serif", "Noto Serif", serif;
   --header-family: "Source Sans Pro", "IBM Plex Sans", "Noto Sans", sans-serif;
   --mono-family: "Source Code Pro", "IBM Plex Mono", "Noto Mono", monospace;
@@ -19,6 +17,10 @@ hr {
   border-color: var(--foreground);
 }
 
+kbd {
+  font-size: 0.9em;
+}
+
 main > article {
   line-height: $line-height;
 }
@@ -31,13 +33,17 @@ main > article {
   line-height: unset;
 }
 
+.site__links--content,
 .site__socials--content {
-  margin-top: 1em;
+  margin: 1em 0 0;
+  padding: 0;
+  display: flex;
+  width: 100%;
+  justify-content: space-around;
 }
 
-.site__links--content {
-  margin-top: 1em;
-}
+.site__links--content > * { flex-basis: 20; }
+.site__socials--content > * { flex-basis: 15%; }
 
 article.post {
   padding: 0.5em;
@@ -127,11 +133,8 @@ article.post {
 
 // Asciidoctor-specific styles
 sup.footnote {
-  vertical-align: baseline;
-  position: relative;
   top: 0;
   left: 0;
-  font-size: 1rem;
 }
 
 .anchor {
@@ -155,7 +158,7 @@ sup.footnote {
 
 .quoteblock {
   blockquote {
-    border: var(--accented-border-style);
+    border: var(--border-style);
     margin: auto;
     padding: 1em 0.5em;
 
@@ -202,7 +205,7 @@ p.tableblock {
   }
 
   > .content {
-    border: var(--accented-border-style);
+    border: var(--border-style);
     padding: 0.5em;
   }
 }
@@ -233,6 +236,7 @@ p.tableblock {
     flex-flow: row;
     justify-content: center;
     align-items: center;
+    width: min-content;
 
     position: absolute;
     top: 0;
@@ -299,7 +303,7 @@ p.tableblock {
     }
   }
 
-  .icon {
+  td.icon {
     background: var(--foreground);
     vertical-align: middle;
     width: 12%;