@ndwnu/design-system 5.1.0 → 6.0.0

package/core/style/styles.scss

@@ -292,10 +292,10 @@
   position: absolute;
   pointer-events: auto;
   box-sizing: border-box;
-  z-index: 1000;
   display: flex;
   max-width: 100%;
   max-height: 100%;
+  z-index: 1000;
 }
 
 .cdk-overlay-backdrop {
@@ -304,21 +304,22 @@
   bottom: 0;
   left: 0;
   right: 0;
-  z-index: 1000;
   pointer-events: auto;
   -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-  transition: opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 1);
   opacity: 0;
+  z-index: 1000;
+  transition: opacity 400ms cubic-bezier(0.25, 0.8, 0.25, 1);
 }
 
-.cdk-overlay-backdrop.cdk-overlay-backdrop-showing {
+.cdk-overlay-backdrop-showing {
   opacity: 1;
 }
 
-.cdk-high-contrast-active .cdk-overlay-backdrop.cdk-overlay-backdrop-showing {
-  opacity: 0.6;
+@media (forced-colors: active) {
+  .cdk-overlay-backdrop-showing {
+    opacity: 0.6;
+  }
 }
-
 .cdk-overlay-dark-backdrop {
   background: rgba(0, 0, 0, 0.32);
 }
@@ -329,7 +330,7 @@
   opacity: 1;
 }
 
-.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing {
+.cdk-overlay-transparent-backdrop.cdk-overlay-backdrop-showing, .cdk-high-contrast-active .cdk-overlay-transparent-backdrop {
   opacity: 0;
   visibility: visible;
 }
@@ -340,11 +341,11 @@
 
 .cdk-overlay-connected-position-bounding-box {
   position: absolute;
-  z-index: 1000;
   display: flex;
   flex-direction: column;
   min-width: 1px;
   min-height: 1px;
+  z-index: 1000;
 }
 
 .cdk-global-scrollblock {
@@ -910,6 +911,10 @@ hr[noMargin] {
   color: var(--ndw-color-grey-500);
 }
 
+.input-container:has(> select[ndwInput]) {
+  padding-inline-end: var(--ndw-spacing-xs);
+}
+
 .input-container:has(> [ndwInput]) {
   display: flex;
   align-items: center;
@@ -920,7 +925,6 @@ hr[noMargin] {
   outline: var(--ndw-border-size-sm) solid transparent;
   outline-offset: calc(var(--ndw-border-size-sm) * -1);
   transition: background-color 150ms ease-in-out, border-color 150ms ease-in-out, outline-color 150ms ease-in-out;
-  padding-inline: var(--ndw-spacing-xs);
   gap: var(--ndw-spacing-xs);
 }
 .input-container:has(> [ndwInput]):has([ndwInput]:hover) {
@@ -964,6 +968,12 @@ hr[noMargin] {
 .input-container:has(> [ndwInput])[disabled] ndw-icon, .input-container:has(> [ndwInput])[readonly] ndw-icon {
   color: var(--ndw-color-grey-300);
 }
+.input-container:has(> [ndwInput]):has(> ndw-input-icon) {
+  padding-inline: var(--ndw-spacing-xs);
+}
+.input-container:has(> [ndwInput]):has(> ndw-picker-button) {
+  padding-inline-end: var(--ndw-spacing-xs);
+}
 .input-container:has(> [ndwInput]) > *:has(~ [ndwInput]) {
   color: var(--ndw-color-grey-400);
 }
@@ -973,9 +983,12 @@ hr[noMargin] {
 .input-container:has(> [ndwInput]) [ndwInput]:has(+ *) {
   padding-inline-end: 0;
 }
-.input-container:has(> [ndwInput]) select[ndwInput]:has(+ *) {
+.input-container:has(> [ndwInput]) [ndwInput]:is(textarea) {
   padding-inline-end: var(--ndw-spacing-sm);
 }
+.input-container:has(> [ndwInput]) select[ndwInput]:has(+ *) {
+  padding-inline-end: 0;
+}
 .input-container:has(> [ndwInput]) [ndwInput] {
   border: none;
   outline: none;
@@ -984,6 +997,9 @@ hr[noMargin] {
   border: none;
   outline: none;
 }
+.input-container:has(> [ndwInput]):has(textarea) {
+  padding-inline: 0;
+}
 
 [ndwInput] {
   display: flex;
@@ -1073,6 +1089,9 @@ select[ndwInput] option:not([disabled]) {
 textarea[ndwInput] {
   min-height: 4rem;
   padding-block: calc(var(--ndw-spacing-xs) + var(--ndw-border-size-sm));
+  padding-inline: var(--ndw-spacing-sm);
+  line-height: normal;
+  white-space: pre-wrap;
   resize: vertical;
 }
 
@@ -1328,7 +1347,8 @@ textarea[ndwInput] {
 }
 .ndw-summary-card .ndw-summary-card-actions {
   flex: 1;
-  justify-items: right;
+  display: flex;
+  justify-content: flex-end;
 }
 .ndw-summary-card .ndw-summary-card-actions--auto {
   container-type: inline-size;