Tweak links appearance

Hoverbear · Hoverbear · commit 3eab5d3626ac · 2024-12-12T23:53:45.000-08:00
diff --git a/sass/_animations.scss b/sass/_animations.scss
@@ -24,17 +24,21 @@
 @keyframes link-color-shift {
   0% {
     color: var(--color-link-muted);
+    text-underline-offset: .1em;
    }
   100% {
     color: var(--color-link);
+    text-underline-offset: .2em;
    }
 }
 
 @keyframes link-color-shift-reverse {
   0% {
     color: var(--color-link);
+    text-underline-offset: .2em;
    }
   100% {
     color: var(--color-link-muted);
+    text-underline-offset: .1em;
    }
 }
diff --git a/sass/_text.scss b/sass/_text.scss
@@ -9,7 +9,6 @@ a {
   animation-duration: 0.2s;
 
   &:hover {
-    text-decoration: underline;
     animation: link-color-shift;
     animation-timing-function: ease-in;
     animation-iteration-count: 1;

Original file line number	Diff line number	Diff line change
`@@ -24,17 +24,21 @@`
`24`	`24`	`@keyframes link-color-shift {`
`25`	`25`	`0% {`
`26`	`26`	`color: var(--color-link-muted);`
	`27`	`+ text-underline-offset: .1em;`
`27`	`28`	`}`
`28`	`29`	`100% {`
`29`	`30`	`color: var(--color-link);`
	`31`	`+ text-underline-offset: .2em;`
`30`	`32`	`}`
`31`	`33`	`}`
`32`	`34`
`33`	`35`	`@keyframes link-color-shift-reverse {`
`34`	`36`	`0% {`
`35`	`37`	`color: var(--color-link);`
	`38`	`+ text-underline-offset: .2em;`
`36`	`39`	`}`
`37`	`40`	`100% {`
`38`	`41`	`color: var(--color-link-muted);`
	`42`	`+ text-underline-offset: .1em;`
`39`	`43`	`}`
`40`	`44`	`}`