@dnb/eufemia 9.29.0 → 9.30.0

package/cjs/style/themes/theme-eiendom/dnb-theme-eiendom.css

@@ -6659,9 +6659,178 @@ html:not([data-whatintent='touch']) .dnb-tabs__button:hover:not([disabled]) {
         -webkit-box-shadow: 0 0 0 0.0625rem var(--color-black-55);
                 box-shadow: 0 0 0 0.0625rem var(--color-black-55); } }
 
+.dnb-button--secondary:not(.dnb-button--has-text):active[disabled],
+html:not([data-whatintent='touch']) .dnb-button--secondary:not(.dnb-button--has-text):active[disabled] {
+  cursor: not-allowed; }
+
+.dnb-button--secondary:not(.dnb-button--has-text):active:not([disabled]),
+html:not([data-whatintent='touch']) .dnb-button--secondary:not(.dnb-button--has-text):active:not([disabled]) {
+  color: #14555a;
+  color: var(--color-emerald-green);
+  background-color: #f2f4ec;
+  background-color: var(--color-pistachio);
+  --border-color: transparent;
+  -webkit-box-shadow: 0 0 0 0.0625rem var(--border-color);
+          box-shadow: 0 0 0 0.0625rem var(--border-color);
+  border-color: transparent; }
+  @media screen and (-ms-high-contrast: none) {
+    .dnb-button--secondary:not(.dnb-button--has-text):active:not([disabled]),
+    html:not([data-whatintent='touch']) .dnb-button--secondary:not(.dnb-button--has-text):active:not([disabled]) {
+      -webkit-box-shadow: 0 0 0 0.0625rem transparent;
+              box-shadow: 0 0 0 0.0625rem transparent; } }
+
 .dnb-button--tertiary {
   color: #14555a;
   color: var(--color-emerald-green); }
   .dnb-button--tertiary[disabled] {
     color: #737373;
     color: var(--color-black-55); }
+
+/*
+* Tabs theme
+*
+*/
+/*
+* Tabs theme
+*
+*/
+/**
+ * This file is only used to make themes independent
+ * so that they can get imported individually, without the core styles
+ *
+ */
+/*
+ * Utilities
+ */
+/*
+* Button mixins
+*
+*/
+.dnb-tabs__tabs:not(.dnb-section)::before {
+  background-color: #ebebeb;
+  background-color: var(--color-black-8);
+  -webkit-box-shadow: 100vw 0 0 0 #ebebeb;
+          box-shadow: 100vw 0 0 0 #ebebeb;
+  -webkit-box-shadow: 100vw 0 0 0 var(--color-black-8);
+          box-shadow: 100vw 0 0 0 var(--color-black-8); }
+
+.dnb-tabs__tabs__tablist:focus {
+  border-radius: 0.5rem; }
+
+.dnb-tabs--at-edge .dnb-tabs__scroll-nav-button:first-of-type {
+  border-radius: 0 50% 50% 0; }
+
+.dnb-tabs--at-edge .dnb-tabs__scroll-nav-button:last-of-type {
+  border-radius: 50% 0 0 50%; }
+
+.dnb-tabs--at-edge .dnb-tabs__tabs__tablist:focus {
+  border-radius: 0; }
+
+.dnb-tabs__content:focus {
+  position: relative; }
+  .dnb-tabs__content:focus::after {
+    content: '';
+    position: absolute;
+    z-index: -1;
+    top: 0.125rem;
+    bottom: -0.5rem;
+    left: -0.5rem;
+    right: -0.5rem;
+    max-width: 100vw;
+    border-radius: 0.5rem;
+    outline: none; }
+    html[data-whatinput='keyboard'] .dnb-tabs__content:focus::after {
+      --border-color: var(--color-emerald-green);
+      -webkit-box-shadow: 0 0 0 0.125rem var(--border-color);
+              box-shadow: 0 0 0 0.125rem var(--border-color);
+      border-color: transparent; }
+      @media screen and (-ms-high-contrast: none) {
+        html[data-whatinput='keyboard'] .dnb-tabs__content:focus::after {
+          -webkit-box-shadow: 0 0 0 0.125rem #14555a;
+                  box-shadow: 0 0 0 0.125rem #14555a;
+          -webkit-box-shadow: 0 0 0 0.125rem var(--color-emerald-green);
+                  box-shadow: 0 0 0 0.125rem var(--color-emerald-green); } }
+
+.dnb-tabs__button__title {
+  font-weight: normal;
+  font-weight: var(--font-weight-regular);
+  font-size: 1.125rem;
+  font-size: var(--font-size-basis);
+  text-align: center;
+  display: block;
+  color: #007272;
+  color: var(--color-sea-green);
+  padding: 0.5rem 0 0.25rem 0; }
+
+html:not([data-whatintent='touch']) .dnb-tabs__button:hover[disabled] {
+  cursor: not-allowed; }
+
+html:not([data-whatintent='touch']) .dnb-tabs__button:hover:not([disabled]) {
+  background-color: #d2f0e9;
+  background-color: var(--color-mint-green-50); }
+  html:not([data-whatintent='touch']) .dnb-tabs__button:hover:not([disabled])::after {
+    height: 2px;
+    border-radius: 2px;
+    background-color: #007272;
+    background-color: var(--color-sea-green); }
+
+.dnb-tabs__button:focus {
+  overflow: visible; }
+  .dnb-tabs__button:focus::before {
+    content: '';
+    position: absolute;
+    z-index: 1;
+    top: 0;
+    left: -0.5rem;
+    bottom: 0;
+    right: -0.5rem;
+    height: inherit;
+    border-radius: inherit;
+    outline: none; }
+    html[data-whatinput='keyboard'] .dnb-tabs__button:focus::before {
+      --border-color: var(--color-emerald-green);
+      -webkit-box-shadow: 0 0 0 0.125rem var(--border-color);
+              box-shadow: 0 0 0 0.125rem var(--border-color);
+      border-color: transparent; }
+      @media screen and (-ms-high-contrast: none) {
+        html[data-whatinput='keyboard'] .dnb-tabs__button:focus::before {
+          -webkit-box-shadow: 0 0 0 0.125rem #14555a;
+                  box-shadow: 0 0 0 0.125rem #14555a;
+          -webkit-box-shadow: 0 0 0 0.125rem var(--color-emerald-green);
+                  box-shadow: 0 0 0 0.125rem var(--color-emerald-green); } }
+  .dnb-tabs__button:focus::before {
+    top: 0.5rem;
+    left: -0.375rem;
+    right: -0.375rem;
+    bottom: 0.5rem;
+    border-radius: 1.5rem; }
+
+.dnb-tabs__button[disabled] .dnb-tabs__button__title {
+  color: #b3dada;
+  color: var(--color-sea-green-30); }
+
+.dnb-tabs__button:not([disabled]):active::after, .dnb-tabs__button:not([disabled]).selected::after {
+  height: 2px;
+  border-radius: 2px;
+  background-color: #007272;
+  background-color: var(--color-sea-green); }
+
+.dnb-tabs__button:not([disabled]):active .dnb-tabs__button__title,
+.dnb-tabs__button:not([disabled]).selected .dnb-tabs__button__title {
+  color: #14555a;
+  color: var(--color-emerald-green); }
+
+.dnb-tabs__button:not([disabled]).selected .dnb-tabs__button__title {
+  font-weight: 500;
+  font-weight: var(--font-weight-medium); }
+
+.dnb-tabs__button span[hidden] {
+  font-weight: 500;
+  font-weight: var(--font-weight-medium); }
+
+html:not([data-whatintent='touch']) .dnb-tabs__button:hover[disabled] {
+  cursor: not-allowed; }
+
+html:not([data-whatintent='touch']) .dnb-tabs__button:hover:not([disabled]) {
+  background-color: #f2f4ec;
+  background-color: var(--color-pistachio); }