@norges-domstoler/dds-components 17.4.0 → 17.5.1

package/dist/index.css

@@ -749,7 +749,7 @@
 :where(.Input_char-counter) {
   margin-left: auto;
 }
-:where(.Input_icon) {
+:where(.Input_input-group__absolute-element) {
   position: absolute;
   top: 50%;
   transform: translate(0, -50%);
@@ -907,6 +907,7 @@
   cursor: pointer;
   display: block;
   width: 100%;
+  border-radius: inherit;
 }
 .AccordionBase_header-container {
   display: flex;
@@ -1363,6 +1364,9 @@
 }
 
 /* src/components/Card/CardAccordion/CardAccordion.module.css */
+.CardAccordion_container {
+  border-radius: inherit;
+}
 .CardAccordion_header-button {
   @media (prefers-reduced-motion: no-preference) {
     transition: box-shadow 0.2s, var(--dds-focus-transition);
@@ -2826,7 +2830,7 @@
 }
 .NativeSelect_select--tiny {
   height: calc(1.5em + var(--dds-spacing-x0-25) + var(--dds-spacing-x0-25) + 2px);
-  padding-right: var(--dds-spacing-x1);
+  padding-right: var(--dds-spacing-x1-5);
 }
 .NativeSelect_select--multiple {
   padding-right: 0;
@@ -2842,6 +2846,119 @@
   pointer-events: none;
 }
 
+/* src/components/PhoneInput/PhoneInput.module.css */
+.PhoneInput_inputs-container {
+  display: flex;
+  flex-direction: row;
+  .PhoneInput_input {
+    border-top-left-radius: 0;
+    border-bottom-left-radius: 0;
+    width: var(--dds-phone-input-width);
+  }
+  .PhoneInput_select {
+    width: 8rem;
+    border-top-right-radius: 0;
+    border-bottom-right-radius: 0;
+    margin-right: -1px;
+  }
+  .PhoneInput_select--tiny {
+    width: 5rem;
+  }
+}
+.PhoneInput_inputs-container--small-screen-xs {
+  @media only screen and (max-width: 600px) {
+    flex-direction: column;
+    width: var(--dds-phone-input-width);
+    .PhoneInput_input {
+      border-top-left-radius: 0;
+      border-top-right-radius: 0;
+      width: 100%;
+    }
+    .PhoneInput_select {
+      border-bottom-left-radius: 0;
+      border-bottom-right-radius: 0;
+      width: 100%;
+      margin-bottom: -1px;
+    }
+  }
+}
+.PhoneInput_inputs-container--small-screen-sm {
+  @media only screen and (max-width: 960px) {
+    flex-direction: column;
+    width: var(--dds-phone-input-width);
+    .PhoneInput_input {
+      border-top-left-radius: 0;
+      border-top-right-radius: 0;
+      width: 100%;
+    }
+    .PhoneInput_select {
+      border-bottom-left-radius: 0;
+      border-bottom-right-radius: 0;
+      width: 100%;
+      margin-bottom: -1px;
+    }
+  }
+}
+.PhoneInput_inputs-container--small-screen-md {
+  @media only screen and (max-width: 1280px) {
+    flex-direction: column;
+    width: var(--dds-phone-input-width);
+    .PhoneInput_input {
+      border-top-left-radius: 0;
+      border-top-right-radius: 0;
+      width: 100%;
+    }
+    .PhoneInput_select {
+      border-bottom-left-radius: 0;
+      border-bottom-right-radius: 0;
+      width: 100%;
+      margin-bottom: -1px;
+    }
+  }
+}
+.PhoneInput_inputs-container--small-screen-lg {
+  @media only screen and (max-width: 1920px) {
+    flex-direction: column;
+    width: var(--dds-phone-input-width);
+    .PhoneInput_input {
+      border-top-left-radius: 0;
+      border-top-right-radius: 0;
+      width: 100%;
+    }
+    .PhoneInput_select {
+      border-bottom-left-radius: 0;
+      border-bottom-right-radius: 0;
+      width: 100%;
+      margin-bottom: -1px;
+    }
+  }
+}
+.PhoneInput_inputs-container--small-screen-xl {
+  flex-direction: column;
+  width: var(--dds-phone-input-width);
+  .PhoneInput_input {
+    border-top-left-radius: 0;
+    border-top-right-radius: 0;
+    width: 100%;
+  }
+  .PhoneInput_select {
+    border-bottom-left-radius: 0;
+    border-bottom-right-radius: 0;
+    width: 100%;
+    margin-bottom: -1px;
+  }
+}
+.PhoneInput_select:focus-visible,
+.PhoneInput_select:hover {
+  z-index: 1;
+  & ~ svg {
+    z-index: 1;
+  }
+}
+.PhoneInput_calling-code {
+  left: var(--dds-spacing-x0-5);
+}
+
 /* src/components/Popover/Popover.module.css */
 .Popover_container {
   position: absolute;