@oslokommune/punkt-css 16.13.2 → 16.14.0

package/dist/css/pkt-docs.css

@@ -14410,7 +14410,7 @@ a:active, a.pkt-link--active,
 .pkt-link--external::after {
   display: inline-block;
   content: " ";
-  --svg: url(https://punkt-cdn.oslo.kommune.no/16.13/icons/new-window-small.svg);
+  --svg: url(https://punkt-cdn.oslo.kommune.no/16.14/icons/new-window-small.svg);
   background-image: var(--svg);
   background-repeat: no-repeat;
   background-size: 18px 18px;
@@ -18454,7 +18454,7 @@ div.pkt-btn:not([data-disabled]):active, .pkt-btn:enabled:active, .pkt-btn:activ
   outline-color: var(--pkt-color-input-border-hover);
 }
 .pkt-input-check__input-checkbox:indeterminate[type=checkbox]:not([role=switch]) {
-  --svg: url(https://punkt-cdn.oslo.kommune.no/16.13/icons/minus-sign.svg);
+  --svg: url(https://punkt-cdn.oslo.kommune.no/16.14/icons/minus-sign.svg);
   position: relative;
   background-color: var(--pkt-color-input-border-normal);
 }
@@ -18480,7 +18480,7 @@ div.pkt-btn:not([data-disabled]):active, .pkt-btn:enabled:active, .pkt-btn:activ
   filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(0%) hue-rotate(271deg) brightness(105%) contrast(101%);
 }
 .pkt-input-check__input-checkbox:checked[type=checkbox] {
-  --svg: url(https://punkt-cdn.oslo.kommune.no/16.13/icons/check-medium.svg);
+  --svg: url(https://punkt-cdn.oslo.kommune.no/16.14/icons/check-medium.svg);
   position: relative;
   background-color: var(--pkt-color-input-border-normal);
 }
@@ -18538,7 +18538,7 @@ div.pkt-btn:not([data-disabled]):active, .pkt-btn:enabled:active, .pkt-btn:activ
   cursor: not-allowed;
 }
 .pkt-input-check__input-checkbox:disabled[type=checkbox][role=switch]:checked:after {
-  --svg: url(https://punkt-cdn.oslo.kommune.no/16.13/icons/check-medium.svg);
+  --svg: url(https://punkt-cdn.oslo.kommune.no/16.14/icons/check-medium.svg);
   --pkt-color-input-check-border: var(--pkt-color-input-border-normal);
   filter: grayscale(100%) brightness(400%);
 }
@@ -18756,7 +18756,7 @@ pkt-select {
 }
 .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/16.13/icons/chevron-thin-down.svg);
+  --svg: url(https://punkt-cdn.oslo.kommune.no/16.14/icons/chevron-thin-down.svg);
   background-image: var(--svg);
   background-repeat: no-repeat;
   background-position: right 0.7rem top 50%;
@@ -18778,17 +18778,22 @@ pkt-select {
 .pkt-input--hover.pkt-select:is(select) {
   border-color: var(--pkt-color-input-border-hover);
 }
+.pkt-input:focus, .pkt-textinput__input:focus, .pkt-select select:focus,
+.pkt-select:focus:is(select) {
+  outline: none;
+  border-color: var(--pkt-color-input-border-active);
+}
 .pkt-input:focus-visible, .pkt-textinput__input:focus-visible, .pkt-select select:focus-visible,
 .pkt-select:focus-visible:is(select), .pkt-input.pkt-input__textinput--focus, .pkt-input__textinput--focus.pkt-textinput__input, .pkt-select select.pkt-input__textinput--focus,
 .pkt-input__textinput--focus.pkt-select:is(select) {
-  box-shadow: 0 0 0 2px var(--pkt-color-input-border-active);
+  outline: 2px solid var(--pkt-color-input-border-active);
+  outline-offset: 0;
   border-color: var(--pkt-color-input-border-active);
 }
-.pkt-input:focus, .pkt-textinput__input:focus, .pkt-select select:focus,
-.pkt-select:focus:is(select) {
-  outline: none;
-  box-shadow: 0 0 0 2px var(--pkt-color-input-border-active);
-  border-color: var(--pkt-color-input-border-active);
+:is(.pkt-inputwrapper, .pkt-searchinput):not([data-navtype=pointer]) .pkt-input:focus-visible, :is(.pkt-inputwrapper, .pkt-searchinput):not([data-navtype=pointer]) .pkt-textinput__input:focus-visible, :is(.pkt-inputwrapper, .pkt-searchinput):not([data-navtype=pointer]) .pkt-select select:focus-visible, .pkt-select :is(.pkt-inputwrapper, .pkt-searchinput):not([data-navtype=pointer]) select:focus-visible,
+:is(.pkt-inputwrapper, .pkt-searchinput):not([data-navtype=pointer]) .pkt-select:focus-visible:is(select) {
+  outline: 4px solid var(--pkt-color-border-states-focus);
+  outline-offset: 0;
 }
 .pkt-input:disabled, .pkt-textinput__input:disabled, .pkt-select select:disabled,
 .pkt-select:disabled:is(select), .pkt-input:disabled::placeholder, .pkt-textinput__input:disabled::placeholder, .pkt-select select:disabled::placeholder,
@@ -18907,6 +18912,13 @@ pkt-select {
 .pkt-input__container:focus-within .pkt-input-icon {
   border-color: var(--pkt-color-input-border-active);
 }
+:is(.pkt-inputwrapper, .pkt-searchinput):not([data-navtype=pointer]) .pkt-input__container:focus-within {
+  outline: 4px solid var(--pkt-color-border-states-focus);
+}
+:is(.pkt-inputwrapper, .pkt-searchinput):not([data-navtype=pointer]) .pkt-input__container:focus-within .pkt-input:focus-visible, :is(.pkt-inputwrapper, .pkt-searchinput):not([data-navtype=pointer]) .pkt-input__container:focus-within .pkt-textinput__input:focus-visible, :is(.pkt-inputwrapper, .pkt-searchinput):not([data-navtype=pointer]) .pkt-input__container:focus-within .pkt-select select:focus-visible, .pkt-select :is(.pkt-inputwrapper, .pkt-searchinput):not([data-navtype=pointer]) .pkt-input__container:focus-within select:focus-visible,
+:is(.pkt-inputwrapper, .pkt-searchinput):not([data-navtype=pointer]) .pkt-input__container:focus-within .pkt-select:focus-visible:is(select) {
+  outline: none;
+}
 .pkt-input__counter {
   letter-spacing: -0.2px;
   font-weight: 300;
@@ -20586,6 +20598,10 @@ pkt-combobox[fullwidth], pkt-combobox--fullwidth,
   margin-top: 0.5rem;
 }
 
+.pkt-inputwrapper:not([data-navtype=pointer]) .pkt-combobox__input:focus-within {
+  outline: 4px solid var(--pkt-color-border-states-focus);
+}
+
 .pkt-datepicker,
 pkt-datepicker {
   display: block;
@@ -24234,6 +24250,9 @@ pkt-messagebox {
 .pkt-searchinput--local .pkt-searchinput__button svg {
   margin-left: 0;
 }
+.pkt-searchinput--local .pkt-searchinput__button {
+  --pkt-color-button-border-hover: var(--pkt-color-input-border-active);
+}
 .pkt-searchinput__suggestions {
   position: absolute;
   z-index: 2;