@oslokommune/punkt-css 11.4.8 → 11.5.0

package/dist/css/pkt.css

@@ -13555,7 +13555,7 @@ a:active, a.pkt-link--active,
 }
 .pkt-link--external::after {
   content: " ";
-  --svg: url(https://punkt-cdn.oslo.kommune.no/11.4/icons/new-window-small.svg);
+  --svg: url(https://punkt-cdn.oslo.kommune.no/11.5/icons/new-window-small.svg);
   background-image: var(--svg);
   background-repeat: no-repeat;
   background-size: 18px 18px;
@@ -17476,7 +17476,7 @@ a.pkt-btn:active, .pkt-btn:enabled:active, .pkt-btn.pkt-btn--active, .pkt-btn.pk
   outline-color: var(--pkt-color-input-border-hover);
 }
 .pkt-input-check__input-checkbox:checked[type=checkbox] {
-  --svg: url(https://punkt-cdn.oslo.kommune.no/11.4/icons/check-medium.svg);
+  --svg: url(https://punkt-cdn.oslo.kommune.no/11.5/icons/check-medium.svg);
   position: relative;
   background-color: var(--pkt-color-input-border-normal);
 }
@@ -17536,7 +17536,7 @@ a.pkt-btn:active, .pkt-btn:enabled:active, .pkt-btn.pkt-btn--active, .pkt-btn.pk
   cursor: not-allowed;
 }
 .pkt-input-check__input-checkbox:disabled[type=checkbox][role=switch]:checked:after {
-  --svg: url(https://punkt-cdn.oslo.kommune.no/11.4/icons/check-medium.svg);
+  --svg: url(https://punkt-cdn.oslo.kommune.no/11.5/icons/check-medium.svg);
   --pkt-color-input-check-border: var(
     --pkt-color-input-border-normal
   );
@@ -17747,7 +17747,7 @@ Therefore, this is removed from the reset here, and images who need to be fluid
 .pkt-select:not(textarea[cols]):not(input[size]):not(.pkt-input--fullwidth):is(select), .pkt-input__container:not(:is(:has(textarea[cols]))):not(:is(:has(input[size]))):not(:is(:has(.pkt-input--fullwidth))) {
   width: min(100%, 31rem);
 }
-.pkt-input--fullwidth {
+.pkt-input--fullwidth, .pkt-input--fullwidth + .pkt-input__counter {
   width: 100%;
 }
 .pkt-input:is(textarea), .pkt-textinput__input:is(textarea), .pkt-select select:is(textarea),
@@ -17763,7 +17763,7 @@ Therefore, this is removed from the reset here, and images who need to be fluid
 }
 .pkt-input:is(select):not([multiple]), .pkt-textinput__input:is(select):not([multiple]), .pkt-select select:is(select):not([multiple]),
 .pkt-select:is(select):not([multiple]) {
-  --svg: url(https://punkt-cdn.oslo.kommune.no/11.4/icons/chevron-thin-down.svg);
+  --svg: url(https://punkt-cdn.oslo.kommune.no/11.5/icons/chevron-thin-down.svg);
   background-image: var(--svg);
   background-repeat: no-repeat;
   background-position: right 0.7rem top 50%;
@@ -19743,6 +19743,56 @@ Therefore, this is removed from the reset here, and images who need to be fluid
   filter: brightness(0) saturate(100%) invert(14%) sepia(64%) saturate(913%) hue-rotate(210deg) brightness(91%) contrast(95%) !important;
 }
 
+/*
+ * Loader component
+ */
+.pkt-loader {
+  width: fit-content;
+  text-align: center;
+}
+.pkt-loader--inline {
+  display: inline-block;
+}
+.pkt-loader > p {
+  margin: 1rem 0;
+}
+.pkt-loader--small > p {
+  font-size: 0.75rem;
+  font-weight: 300;
+  letter-spacing: -0.2px;
+  line-height: 1.25rem;
+}
+.pkt-loader--small .pkt-loader__svg svg {
+  height: 1rem;
+}
+.pkt-loader--small .pkt-loader__svg:not(.pkt-loader__shapes) svg {
+  width: 1rem;
+}
+.pkt-loader--medium > p {
+  font-size: 1rem;
+  font-weight: 300;
+  letter-spacing: -0.2px;
+  line-height: 1.5rem;
+}
+.pkt-loader--medium .pkt-loader__svg svg {
+  height: 2.5rem;
+}
+.pkt-loader--medium .pkt-loader__svg:not(.pkt-loader__shapes) svg {
+  width: 2.5rem;
+}
+.pkt-loader--large > p {
+  font-size: 1.125rem;
+  font-weight: 300;
+  letter-spacing: -0.2px;
+  line-height: 1.75rem;
+}
+.pkt-loader--large .pkt-loader__svg svg {
+  height: 3.5rem;
+}
+.pkt-loader--large .pkt-loader__svg:not(.pkt-loader__shapes) svg {
+  width: 3.5rem;
+}
+
 /* 
  * Textinput component 
  *