Fix styles for existing links with '.link-pretty'

epfl-si · Jul 27, 2023 · bad2c97 · bad2c97
1 parent cdfc4f8
commit bad2c97
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 15 deletions.
diff --git a/assets/components/atoms/link/link.scss b/assets/components/atoms/link/link.scss
@@ -52,7 +52,19 @@ a:active {
 }
 */
 
-// Fix for existing pretty links on dark background
+// Fix for existing links with class '.link-pretty'
+
+.link-pretty.nav-link {
+  text-decoration: underline;
+  text-decoration-color: $link-hover-color;
+  text-decoration-thickness: 0.08em;
+  text-decoration-thickness: min(0.08em, 0.1rem);
+  text-underline-offset: 0.14em;
+
+  @include hover-focus-active {
+    text-decoration-color: $link-color;
+  }
+}
 
 .bg-dark .link-pretty,
 .bg-gray-600 .link-pretty{

diff --git a/assets/components/molecules/card/card.scss b/assets/components/molecules/card/card.scss
@@ -202,19 +202,6 @@ a.card-img-top {
   }
 }
 
-a.card-title,
-.card-title a {
-  transition: color 0.3s;
-
-  @include link-pretty($red, $body-bg, $body-color);
-
-  background-position: 0 90%;
-
-  .card-gray & {
-    @include link-pretty($red, gray('100'), $body-color);
-  }
-}
-
 // Whole card as a link
 a.card {
   text-decoration: none;

diff --git a/assets/components/molecules/list-group/list-group.scss b/assets/components/molecules/list-group/list-group.scss
@@ -22,7 +22,7 @@
   background: var(--card-bg);
 
   .card-title a {
-    @include link-pretty($red, var(--card-bg), $body-color);
+    //@include link-pretty($red, var(--card-bg), $body-color);
     transition: color 0.3s, text-shadow 0.25s;
   }