From 943c1fcf0aa10fc5abe6f04c7bef73dd86cf7a3e Mon Sep 17 00:00:00 2001
From: Tobias <tobias@tujo.no>
Date: Fri, 1 Feb 2019 09:20:34 +0100
Subject: [PATCH] feat: update #tabs for mobile view

---
 .../tabs/__tests__/__snapshots__/Tabs.test.js.snap           | 5 +++++
 packages/dnb-ui-lib/src/components/tabs/style/_tabs.scss     | 1 -
 .../src/components/tabs/style/themes/dnb-tabs-theme-ui.scss  | 4 ++++
 3 files changed, 9 insertions(+), 1 deletion(-)

diff --git a/packages/dnb-ui-lib/src/components/tabs/__tests__/__snapshots__/Tabs.test.js.snap b/packages/dnb-ui-lib/src/components/tabs/__tests__/__snapshots__/Tabs.test.js.snap
index 44876a1ec6e..5442d25a3aa 100644
--- a/packages/dnb-ui-lib/src/components/tabs/__tests__/__snapshots__/Tabs.test.js.snap
+++ b/packages/dnb-ui-lib/src/components/tabs/__tests__/__snapshots__/Tabs.test.js.snap
@@ -284,6 +284,11 @@ exports[`Tabs scss have to match default theme snapshot 1`] = `
   text-align: center;
   color: var(--color-sea-green); }
 
+@media screen and (max-width: 40em) {
+  .dnb-tabs__tabs .dnb-tablink {
+    text-align: left;
+    padding: 0.5rem 1rem; } }
+
 .dnb-tabs__tabs .dnb-tablink:not([disabled]):hover {
   background-color: var(--color-mint-green-50); }
   .dnb-tabs__tabs .dnb-tablink:not([disabled]):hover::after {
diff --git a/packages/dnb-ui-lib/src/components/tabs/style/_tabs.scss b/packages/dnb-ui-lib/src/components/tabs/style/_tabs.scss
index 53b05a308eb..025f28f8d88 100644
--- a/packages/dnb-ui-lib/src/components/tabs/style/_tabs.scss
+++ b/packages/dnb-ui-lib/src/components/tabs/style/_tabs.scss
@@ -36,7 +36,6 @@
 
       margin: 0;
       margin-left: 4.5rem;
-      // padding: 0.25rem 0.1875rem; /* 1/16*4 */
       padding: 0.25rem 0.125rem; /* 1/16*4 */
 
       background-color: transparent;
diff --git a/packages/dnb-ui-lib/src/components/tabs/style/themes/dnb-tabs-theme-ui.scss b/packages/dnb-ui-lib/src/components/tabs/style/themes/dnb-tabs-theme-ui.scss
index 2592a7e57c3..66d38781c33 100644
--- a/packages/dnb-ui-lib/src/components/tabs/style/themes/dnb-tabs-theme-ui.scss
+++ b/packages/dnb-ui-lib/src/components/tabs/style/themes/dnb-tabs-theme-ui.scss
@@ -26,6 +26,10 @@
 
         color: var(--color-sea-green);
       }
+      @include allBelow(small) {
+        text-align: left;
+        padding: 0.5rem 1rem;
+      }
 
       // hover
       &:not([disabled]):hover {