feat(note): override link styles to match design

pluralsight · Jun 13, 2019 · f17833a · f17833a
1 parent 380c6d4
commit f17833a
Show file tree

Hide file tree

Showing 3 changed files with 93 additions and 49 deletions.
diff --git a/packages/note/src/css/index.js b/packages/note/src/css/index.js
@@ -92,7 +92,24 @@ export default {
     fontSize: core.type.fontSizeSmall,
     fontWeight: core.type.fontWeightBold,
     lineHeight: core.type.lineHeightTight,
-    marginRight: 'auto'
+    marginRight: 'auto',
+
+    '& a': {
+      color: 'inherit',
+      cursor: 'pointer',
+      textDecoration: 'none',
+
+      '&:hover, &:active': {
+        textDecoration: 'underline',
+        transition: `all ${core.motion.speedNormal}`
+      }
+    }
+  },
+  [`.psds-note__heading.psds-theme--${themeNames.dark}`]: {
+    '& a:hover, & a:active': { color: core.colors.white }
+  },
+  [`.psds-note__heading.psds-theme--${themeNames.light}`]: {
+    '& a:hover, & a:active': { color: core.colors.gray03 }
   },
 
   '.psds-note__footer': {
@@ -124,8 +141,25 @@ export default {
 
     '&:nth-of-type(1)': {
       flexShrink: 1
+    },
+
+    '& a': {
+      color: 'inherit',
+      cursor: 'pointer',
+      textDecoration: 'none',
+
+      '&:hover, &:active': {
+        textDecoration: 'underline',
+        transition: `all ${core.motion.speedNormal}`
+      }
     }
   },
+  [`.psds-note__metadata-datum.psds-theme--${themeNames.dark}`]: {
+    '& a:hover, & a:active': { color: core.colors.white }
+  },
+  [`.psds-note__metadata-datum.psds-theme--${themeNames.light}`]: {
+    '& a:hover, & a:active': { color: core.colors.gray03 }
+  },
 
   '.psds-note__metadata-dot': {
     display: 'inline-block',