From 51c2d9da5c11c4328fd935e89789bac6fb7e5955 Mon Sep 17 00:00:00 2001
From: Joe Carstairs <65492573+Sycamost@users.noreply.github.com>
Date: Mon, 21 Aug 2023 07:41:43 +0100
Subject: Better link styling

---
 public/css/modules/link.css | 34 +++++++++++++++++++++++++---------
 1 file changed, 25 insertions(+), 9 deletions(-)

(limited to 'public/css/modules/link.css')

diff --git a/public/css/modules/link.css b/public/css/modules/link.css
index 005c82e..d3b9307 100644
--- a/public/css/modules/link.css
+++ b/public/css/modules/link.css
@@ -1,25 +1,41 @@
 .link {
   color: var(--special-text-color);
-  text-decoration: underline;
+  text-decoration-line: underline;
   text-decoration-color: var(--special-text-color);
+  text-decoration-thickness: 2px;
+  text-underline-offset: 2px;
   border: dotted transparent 2px;
   border-radius: 0.375rem;
   transition:
-    text-decoration-color 300ms,
-    color 300ms,
-    border-color 300ms,
-    font-weight 300ms;
+    color 100ms,
+    text-decoration-color 100ms,
+    text-decoration-thickness 100ms,
+    text-underline-offset 100ms,
+    border-color 100ms,
+    font-weight 100ms,
+    font-size 300ms;
 }
 
-.link:hover, .group-hover:hover .link {
-  text-decoration-color: transparent;
+.link:hover, .group-hover:hover .link, .link:focus, .link:active {
+  text-decoration-color: currentColor;
+  text-decoration-thickness: 8px;
+  text-underline-offset: 4px;
+  font-weight: 700;
+  transition:
+    color 300ms,
+    text-decoration-color 300ms,
+    text-decoration-thickness 300ms,
+    text-underline-offset 300ms,
+    border-color 300ms,
+    font-weight 300ms,
+    font-size 300ms;
 }
 
 .link:focus {
+  box-shadow: none;
   border-color: var(--special-text-color);
 }
 
 .link:active {
-  font-weight: 700;
-  color: var(--special-text-highlight-color);
+  font-size: larger;
 }
\ No newline at end of file
-- 
cgit v1.2.3