feat(markdown): add CSS props for hyperlinks colors

Lundalogik · Dec 13, 2023 · 4a0581e · 4a0581e
1 parent 3592fd1
commit 4a0581e
Show file tree

Hide file tree

Showing 2 changed files with 10 additions and 2 deletions.
diff --git a/src/components/markdown/markdown.scss b/src/components/markdown/markdown.scss
@@ -1,3 +1,8 @@
+/**
+* @prop --markdown-hyperlink-color: color of text for hyperlinks. Defaults to `--color-blue-dark`;
+* @prop --markdown-hyperlink-color--hovered: color of text for hyperlinks when hovered. Defaults to `--color-blue-default`;
+*/
+
 @import './partial-styles/pre-code.scss';
 @import './partial-styles/headings.scss';
 @import './partial-styles/body-text.scss';

diff --git a/src/components/markdown/partial-styles/_body-text.scss b/src/components/markdown/partial-styles/_body-text.scss
@@ -25,11 +25,14 @@ p {
 
 a {
     transition: color 0.2s ease;
-    color: rgb(var(--color-blue-dark));
+    color: var(--markdown-hyperlink-color, rgb(var(--color-blue-dark)));
     text-decoration: none;
 
     &:hover {
-        color: rgb(var(--color-blue-default));
+        color: var(
+            --markdown-hyperlink-color--hovered,
+            rgb(var(--color-blue-default))
+        );
     }
 }