feat: now we have an official anchor active state

dnbexperience · Feb 11, 2019 · 6de23ea · 6de23ea
1 parent 6a58154
commit 6de23ea
Show file tree

Hide file tree

Showing 4 changed files with 20 additions and 3 deletions.
diff --git a/packages/dnb-design-system-portal/src/pages/uilib/elements/anchor.md b/packages/dnb-design-system-portal/src/pages/uilib/elements/anchor.md
@@ -8,9 +8,9 @@ import CodeBlock from 'Tags/CodeBlock'
 
 <CodeBlock reactLive hideCode>
 {`
-<ul>
+<ul data-dnb-test="anchor" className="dnb-unstyled-list">
   <li>
-    <a href="/" >Default style</a>
+    <a href="/" >Default Style</a>
   </li>
   <li>
     <a href="/" className="dnb-hover-style">Hover Style</a>

diff --git a/packages/dnb-ui-lib/src/style/elements/__tests__/Anchor.screenshot.test.js b/packages/dnb-ui-lib/src/style/elements/__tests__/Anchor.screenshot.test.js
@@ -0,0 +1,17 @@
+/**
+ * Screenshot Test
+ * This file will not run on "test:staged" because we dont require any related files
+ */
+
+import { testPageScreenshot } from '../../../core/jest/jestSetupScreenshots'
+
+describe('Anchor screenshot', () => {
+  const url = '/uilib/elements/anchor?fullscreen'
+  it('have to match the default choice of anchor styles', async () => {
+    const screenshot = await testPageScreenshot({
+      url,
+      selector: '[data-dnb-test="anchor"]'
+    })
+    expect(screenshot).toMatchImageSnapshot()
+  })
+})
diff --git a/...r-screenshot-have-to-match-the-default-choice-of-anchor-styles-1-6d82c.snap.png b/...r-screenshot-have-to-match-the-default-choice-of-anchor-styles-1-6d82c.snap.png
diff --git a/packages/dnb-ui-lib/src/style/themes/theme-ui/anchor-mixins.scss b/packages/dnb-ui-lib/src/style/themes/theme-ui/anchor-mixins.scss
@@ -41,7 +41,7 @@
   border-bottom-width: 2px;
 }
 @mixin activeStyle() {
-  color: #fff;
+  color: var(--color-mint-green);
   background-color: var(--color-sea-green);
   border-bottom: none;
   border-radius: 0;