@dnb/eufemia 10.14.0 → 10.15.1

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

@@ -0,0 +1,238 @@
+/**
+ * ATTENTION: This file is auto generated by using "themeFactory".
+ * But you still can change the content of this file on the very top.
+ */
+/**
+ * ATTENTION: This file is auto generated by using "styleFactory".
+ * Do not change the content!
+ *
+ */
+/*
+ * Utilities
+ */
+.dnb-forms-field-array-selection--options-layout-vertical .dnb-forms-field-array-selection__options {
+  display: flex;
+  flex-flow: column;
+  row-gap: var(--spacing-x-small);
+}
+.dnb-forms-field-array-selection--options-layout-horizontal .dnb-forms-field-array-selection__options {
+  display: flex;
+  flex-flow: row wrap;
+  -moz-column-gap: var(--spacing-small);
+       column-gap: var(--spacing-small);
+}
+
+.dnb-forms-field-expiry .dnb-multi-input-mask {
+  width: var(--forms-field-width--small);
+}
+.dnb-forms-field-expiry .dnb-multi-input-mask .dnb-input__shell {
+  justify-content: center;
+}
+
+.dnb-forms-field-phone-number__country-code {
+  width: calc(var(--forms-field-width--medium) - 2rem);
+}
+.dnb-forms-field-phone-number__country-code .dnb-autocomplete__shell {
+  width: calc(var(--forms-field-width--medium) - 2rem);
+}
+.dnb-forms-field-phone-number__number {
+  flex: 1;
+}
+
+.dnb-forms-field-postal-code-and-city__fields {
+  display: flex;
+  flex-flow: row;
+  -moz-column-gap: var(--spacing-small);
+       column-gap: var(--spacing-small);
+}
+.dnb-forms-field-postal-code-and-city__postal-code {
+  flex: 0 5rem;
+}
+.dnb-forms-field-postal-code-and-city__city {
+  flex: 1;
+}
+
+.dnb-forms-field-selection--width-large .dnb-dropdown__shell {
+  width: var(--forms-field-width--large);
+}
+.dnb-forms-field-selection--width-medium .dnb-dropdown__shell {
+  width: var(--forms-field-width--medium);
+}
+.dnb-forms-field-selection--width-small .dnb-dropdown__shell {
+  width: var(--forms-field-width--small);
+}
+
+:root {
+  --forms-field-width--small: 5rem;
+  --forms-field-width--medium: 11rem;
+  --forms-field-width--large: 21rem;
+}
+
+/*
+ * Utilities
+ */
+fieldset.dnb-forms-field-block {
+  padding: 0;
+  border: none;
+}
+fieldset.dnb-forms-field-block:not([class*=space__top]) {
+  margin-top: 0;
+}
+fieldset.dnb-forms-field-block:not([class*=space__right]) {
+  margin-right: 0;
+}
+fieldset.dnb-forms-field-block:not([class*=space__bottom]) {
+  margin-bottom: 0;
+}
+fieldset.dnb-forms-field-block:not([class*=space__left]) {
+  margin-left: 0;
+}
+
+.dnb-forms-field-block__grid {
+  display: grid;
+}
+.dnb-forms-field-block--layout-vertical {
+  grid-template-columns: auto;
+  grid-template-areas: "label" "contents" "status";
+}
+.dnb-forms-field-block--layout-horizontal {
+  grid-template-columns: var(--forms-field-width--medium) auto;
+  grid-template-areas: "label contents" "status status";
+}
+.dnb-forms-field-block--width-stretch {
+  flex-grow: 1;
+}
+@media screen and (min-width: 30em) {
+  .dnb-forms-field-block--width-small {
+    width: var(--forms-field-width--small);
+  }
+  .dnb-forms-field-block--width-medium {
+    width: var(--forms-field-width--medium);
+  }
+  .dnb-forms-field-block--width-large {
+    width: var(--forms-field-width--large);
+  }
+}
+.dnb-forms-field-block__label {
+  grid-area: label;
+  display: flex;
+  flex-flow: row;
+  justify-content: space-between;
+  align-items: center;
+}
+.dnb-forms-field-block__label-description {
+  margin-left: 0.3em;
+  color: var(--color-black-55);
+  font-size: var(--font-size-small);
+}
+.dnb-forms-field-block__label-secondary {
+  color: var(--color-black-55);
+  font-size: var(--font-size-small);
+}
+.dnb-forms-field-block__status {
+  grid-area: status;
+}
+.dnb-forms-field-block__contents {
+  grid-area: contents;
+}
+.dnb-forms-field-block__contents--width-stretch {
+  width: 100%;
+}
+@media screen and (min-width: 30em) {
+  .dnb-forms-field-block__contents--width-small {
+    width: var(--forms-field-width--small);
+  }
+  .dnb-forms-field-block__contents--width-medium {
+    width: var(--forms-field-width--medium);
+  }
+  .dnb-forms-field-block__contents--width-large {
+    width: var(--forms-field-width--large);
+  }
+}
+
+.dnb-forms-button-row {
+  display: flex;
+  flex-flow: row;
+  -moz-column-gap: var(--spacing-small);
+       column-gap: var(--spacing-small);
+}
+
+.dnb-spacing .dnb-form-main-heading.dnb-h--large:not([class*=space__]) {
+  margin: 0;
+}
+.dnb-form-main-heading:has(+ .dnb-flex-stack > .dnb-card, + .dnb-card):not([class*=space__left]) {
+  margin-left: var(--spacing-medium);
+}
+.dnb-form-main-heading:has(+ .dnb-flex-stack > .dnb-card, + .dnb-card):not([class*=space__bottom]) {
+  margin-bottom: var(--spacing-small);
+}
+
+.dnb-spacing .dnb-form-sub-heading.dnb-h--medium:not([class*=space__]) {
+  margin: 0;
+}
+.dnb-form-sub-heading:has(+ .dnb-flex-stack > .dnb-card, + .dnb-card):not([class*=space__bottom]) {
+  margin-bottom: var(--spacing-small);
+}
+
+/*
+ * Utilities
+ */
+.dnb-forms-steps-layout {
+  display: flex;
+  flex-flow: row wrap;
+  -moz-column-gap: var(--spacing-medium);
+       column-gap: var(--spacing-medium);
+}
+@media (max-width: 60em) {
+  .dnb-forms-steps-layout {
+    flex-direction: column;
+    justify-content: stretch;
+    align-items: stretch;
+  }
+}
+.dnb-forms-steps-layout__sidebar {
+  flex: 0;
+  min-width: 21rem;
+}
+.dnb-forms-steps-layout__sidebar .dnb-step-indicator__sidebar {
+  max-width: 21rem;
+}
+.dnb-forms-steps-layout__sidebar .dnb-step-indicator__sidebar .dnb-step-indicator__item {
+  min-width: 336px;
+}
+.dnb-forms-steps-layout__contents {
+  flex: 1;
+  min-width: 25rem;
+}
+.dnb-forms-steps-layout__contents .dnb-card {
+  --border-color: var(--color-pistachio);
+}
+
+.dnb-forms-value-block {
+  display: block;
+  font-size: var(--font-size-basis);
+}
+.dnb-forms-value-block--inline {
+  display: inline-block;
+  font-size: inherit;
+  margin-left: var(--spacing-xx-small);
+  margin-right: var(--spacing-xx-small);
+}
+.dnb-forms-value-block__label {
+  font-weight: var(--font-weight-medium);
+}
+.dnb-forms-value-block__placeholder {
+  color: rgba(0, 0, 0, 0.5);
+}
+
+.dnb-forms-test-element {
+  border: 1px dashed #808080;
+  border-radius: 0.5rem;
+  color: #909090;
+  padding: 0.5rem 1rem;
+}
+
+/**
+ * NB: The content below is auto generated by the "themeFactory".
+ * You may want to update it by running "yarn build" locally.
+ */

package/cjs/style/themes/theme-eiendom/eiendom-theme-forms.min.css

@@ -0,0 +1 @@
+.dnb-forms-field-array-selection--options-layout-vertical .dnb-forms-field-array-selection__options{display:flex;flex-flow:column;row-gap:var(--spacing-x-small)}.dnb-forms-field-array-selection--options-layout-horizontal .dnb-forms-field-array-selection__options{-moz-column-gap:var(--spacing-small);column-gap:var(--spacing-small);display:flex;flex-flow:row wrap}.dnb-forms-field-expiry .dnb-multi-input-mask{width:var(--forms-field-width--small)}.dnb-forms-field-expiry .dnb-multi-input-mask .dnb-input__shell{justify-content:center}.dnb-forms-field-phone-number__country-code,.dnb-forms-field-phone-number__country-code .dnb-autocomplete__shell{width:calc(var(--forms-field-width--medium) - 2rem)}.dnb-forms-field-phone-number__number{flex:1}.dnb-forms-field-postal-code-and-city__fields{-moz-column-gap:var(--spacing-small);column-gap:var(--spacing-small);display:flex;flex-flow:row}.dnb-forms-field-postal-code-and-city__postal-code{flex:0 5rem}.dnb-forms-field-postal-code-and-city__city{flex:1}.dnb-forms-field-selection--width-large .dnb-dropdown__shell{width:var(--forms-field-width--large)}.dnb-forms-field-selection--width-medium .dnb-dropdown__shell{width:var(--forms-field-width--medium)}.dnb-forms-field-selection--width-small .dnb-dropdown__shell{width:var(--forms-field-width--small)}:root{--forms-field-width--small:5rem;--forms-field-width--medium:11rem;--forms-field-width--large:21rem}fieldset.dnb-forms-field-block{border:none;padding:0}fieldset.dnb-forms-field-block:not([class*=space__top]){margin-top:0}fieldset.dnb-forms-field-block:not([class*=space__right]){margin-right:0}fieldset.dnb-forms-field-block:not([class*=space__bottom]){margin-bottom:0}fieldset.dnb-forms-field-block:not([class*=space__left]){margin-left:0}.dnb-forms-field-block__grid{display:grid}.dnb-forms-field-block--layout-vertical{grid-template-areas:"label" "contents" "status";grid-template-columns:auto}.dnb-forms-field-block--layout-horizontal{grid-template-areas:"label contents" "status status";grid-template-columns:var(--forms-field-width--medium) auto}.dnb-forms-field-block--width-stretch{flex-grow:1}@media screen and (min-width:30em){.dnb-forms-field-block--width-small{width:var(--forms-field-width--small)}.dnb-forms-field-block--width-medium{width:var(--forms-field-width--medium)}.dnb-forms-field-block--width-large{width:var(--forms-field-width--large)}}.dnb-forms-field-block__label{align-items:center;display:flex;flex-flow:row;grid-area:label;justify-content:space-between}.dnb-forms-field-block__label-description{margin-left:.3em}.dnb-forms-field-block__label-description,.dnb-forms-field-block__label-secondary{color:var(--color-black-55);font-size:var(--font-size-small)}.dnb-forms-field-block__status{grid-area:status}.dnb-forms-field-block__contents{grid-area:contents}.dnb-forms-field-block__contents--width-stretch{width:100%}@media screen and (min-width:30em){.dnb-forms-field-block__contents--width-small{width:var(--forms-field-width--small)}.dnb-forms-field-block__contents--width-medium{width:var(--forms-field-width--medium)}.dnb-forms-field-block__contents--width-large{width:var(--forms-field-width--large)}}.dnb-forms-button-row{-moz-column-gap:var(--spacing-small);column-gap:var(--spacing-small);display:flex;flex-flow:row}.dnb-spacing .dnb-form-main-heading.dnb-h--large:not([class*=space__]){margin:0}.dnb-form-main-heading:has(+.dnb-flex-stack>.dnb-card,+.dnb-card):not([class*=space__left]){margin-left:var(--spacing-medium)}.dnb-form-main-heading:has(+.dnb-flex-stack>.dnb-card,+.dnb-card):not([class*=space__bottom]){margin-bottom:var(--spacing-small)}.dnb-spacing .dnb-form-sub-heading.dnb-h--medium:not([class*=space__]){margin:0}.dnb-form-sub-heading:has(+.dnb-flex-stack>.dnb-card,+.dnb-card):not([class*=space__bottom]){margin-bottom:var(--spacing-small)}.dnb-forms-steps-layout{-moz-column-gap:var(--spacing-medium);column-gap:var(--spacing-medium);display:flex;flex-flow:row wrap}@media (max-width:60em){.dnb-forms-steps-layout{align-items:stretch;flex-direction:column;justify-content:stretch}}.dnb-forms-steps-layout__sidebar{flex:0;min-width:21rem}.dnb-forms-steps-layout__sidebar .dnb-step-indicator__sidebar{max-width:21rem}.dnb-forms-steps-layout__sidebar .dnb-step-indicator__sidebar .dnb-step-indicator__item{min-width:336px}.dnb-forms-steps-layout__contents{flex:1;min-width:25rem}.dnb-forms-steps-layout__contents .dnb-card{--border-color:var(--color-pistachio)}.dnb-forms-value-block{display:block;font-size:var(--font-size-basis)}.dnb-forms-value-block--inline{display:inline-block;font-size:inherit;margin-left:var(--spacing-xx-small);margin-right:var(--spacing-xx-small)}.dnb-forms-value-block__label{font-weight:var(--font-weight-medium)}.dnb-forms-value-block__placeholder{color:rgba(0,0,0,.5)}.dnb-forms-test-element{border:1px dashed grey;border-radius:.5rem;color:#909090;padding:.5rem 1rem}

package/cjs/style/themes/theme-eiendom/eiendom-theme-forms.scss

@@ -0,0 +1,15 @@
+/**
+ * ATTENTION: This file is auto generated by using "themeFactory".
+ * But you still can change the content of this file on the very top.
+ */
+
+// Add "ui" themes, if file don't exists
+$THEME_FALLBACK: 'ui';
+
+// Import shared styles
+@import '../../dnb-ui-forms.scss';
+
+/**
+ * NB: The content below is auto generated by the "themeFactory".
+ * You may want to update it by running "yarn build" locally.
+ */

package/cjs/style/themes/theme-sbanken/sbanken-theme-basis.css

@@ -278,6 +278,7 @@
   border-radius: 0.1875em;
 }
 del .dnb-code {
+  -webkit-text-decoration: line-through;
   text-decoration: line-through;
 }
 .dnb-code:not([class*=dnb-space]) {
@@ -345,9 +346,11 @@ del .dnb-code {
 .dnb-hr {
   position: relative;
   padding: 0;
+  width: 100%;
   height: 0;
-  display: flex;
+  display: flow-root;
   border: 0;
+  --thickness: calc(var(--hr-thickness, 1px) + var(--modifier, 0px));
 }
 .dnb-hr:not([class*=dnb-space]) {
   margin: 0;
@@ -355,39 +358,27 @@ del .dnb-code {
 .dnb-hr::after {
   content: "";
   position: absolute;
+  inset: 0;
   z-index: 1;
-  left: 0;
-  right: 0;
-  top: 0;
-  width: 100%;
-  height: 1px;
+  height: var(--thickness);
   color: inherit;
   background-color: currentcolor;
-  border-radius: 0.5px;
+  border-radius: calc(var(--thickness) / 2);
 }
 .dnb-hr--fullscreen::after {
   left: -100vw;
-  width: 200vw;
-}
-.dnb-hr--light::after {
-  border-radius: 0.25px;
-  /* 
-  * 60% and 65% for best result on low res screens, like on Chromebook (Acer)
-  * Else the line will disappear!
-  */
-  background-image: linear-gradient(to bottom, currentcolor 60%, transparent 65%);
-  background-size: 100% 1px;
-  background-color: transparent;
+  box-shadow: 100vw 0 0 0 currentcolor;
+  border-radius: 0;
 }
-.dnb-hr--medium::after {
-  height: 2px;
-  border-radius: 0.75px;
-  /* Revert the hairline halv */
-  background-image: linear-gradient(to bottom, currentcolor 51%, transparent 51%);
-  background-size: 100% 3px;
-  background-color: transparent;
+.dnb-hr--light {
+  --hr-thickness: 0.4px;
+}
+html[data-visual-test] .dnb-hr--light {
+  --modifier: 0.7px;
+}
+.dnb-hr--medium {
+  --hr-thickness: 1.5px;
 }
-
 .dnb-spacing .dnb-hr:not([class*=dnb-space__top]) {
   margin-top: 0;
 }