style: link underlines, attempt two™

packages/client/src/components/MkUrlPreview.vue

@@ -196,6 +196,7 @@ onUnmounted(() => {
 	> a {
 		display: flex;
 		transition: background 0.2s;
+		text-decoration: none;
 		> div:first-child:not(:last-child) {
 			position: relative;
 			width: 90px;
@@ -252,6 +253,9 @@ onUnmounted(() => {
 			font-size: 1em;
 			white-space: nowrap;
 			margin-bottom: 0.2em;
+			text-decoration: underline;
+			text-decoration-color: transparent;
+			transition: text-decoration-color .2s;
 		}
 		p {
 			margin-bottom: -0.5em;
@@ -277,8 +281,8 @@ onUnmounted(() => {
 		&:focus,
 		&:focus-within {
 			background: var(--panelHighlight);
-			h1 {
-				text-decoration: underline;
+			h3 {
+				text-decoration-color: currentColor;
 			}
 		}
 	}

packages/client/src/components/global/MkUrl.vue

@@ -80,6 +80,8 @@ const target = self ? null : "_blank";
 	display: inline-block;
 	overflow: clip;
 	text-overflow: ellipsis;
+	text-decoration: none !important;
+	line-height: 1.05;
 
 	> .icon {
 		padding-left: 2px;

packages/client/src/style.scss

@@ -145,6 +145,12 @@ a {
 	cursor: pointer;
 	color: inherit;
 	-webkit-tap-highlight-color: transparent;
+	text-decoration: underline;
+	text-decoration-color: transparent;
+	transition: text-decoration-color .2s;
+	&:hover {
+		text-decoration-color: currentColor;
+	}
 }
 
 // i {
@@ -229,6 +235,7 @@ hr {
 	font-size: 1em;
 	font-family: inherit;
 	line-height: inherit;
+	text-decoration: none;
 
 	&,
 	* {
@@ -628,18 +635,22 @@ hr {
 ._link {
 	position: relative;
 	color: var(--link);
+	text-decoration: none !important;
 
-	&:after {
+	&::before, &::after {
 		content: "";
 		position: absolute;
 		bottom: 0;
 		left: 0;
 		width: 0%;
-		border-bottom: 2px solid var(--link);
+		border-bottom: 1px solid currentColor;
 		transition: 0.3s ease-in-out;
 	}
-
-	&:hover:after {
+	&::before {
+		width: 100%;
+		opacity: .4;
+	}
+	&:hover:after, &:focus:after {
 		width: 100%;
 	}
 }