From 91e2baf8d83b29a89a726e17cca99770713af440 Mon Sep 17 00:00:00 2001
From: arne <hi@arnes.space>
Date: Thu, 3 Mar 2022 10:17:38 +0100
Subject: [PATCH] Use underlines to highlight links

---
 src/assets/style.scss | 24 +++++++-----------------
 1 file changed, 7 insertions(+), 17 deletions(-)

diff --git a/src/assets/style.scss b/src/assets/style.scss
index 9e024cb..10be6fd 100644
--- a/src/assets/style.scss
+++ b/src/assets/style.scss
@@ -55,19 +55,16 @@ a {
   color: $highlight;
   text-decoration: none;
   position: relative;
-  padding: .1em 0;
-  transition: background .2s ease-in, box-shadow .2s ease-in;
+  padding: .1em .2em;
 
   // multi-line padded background
   box-decoration-break: clone;
-  background: $highlight-1;
-  box-shadow: .3em 0 0 $highlight-1,
-              -.3em 0 0 $highlight-1;
+  border-bottom: 1px dotted $highlight;
+
+  transition: .2s ease-in background;
 
   &:hover {
-    background: $highlight-2;
-    box-shadow: .3em 0 0 $highlight-2,
-                -.3em 0 0 $highlight-2;
+    background: $highlight-1;
   }
 }
 
@@ -184,17 +181,10 @@ footer {
 
   a {
     color: #888;
-
-    // multi-line padded background
-    background: #88888822;
-    box-shadow: .3em 0 0 #88888822,
-                -.3em 0 0 #88888822;
-    box-decoration-break: clone;
+    border-bottom: 1px dotted #888;
 
     &:hover {
-      background: #88888844;
-      box-shadow: .3em 0 0 #88888844,
-                  -.3em 0 0 #88888844;
+      background: #88888822;
     }
   }
 }