@oslokommune/punkt-css 16.17.1 → 16.18.0

package/dist/scss/abstracts/variables/_index.scss

@@ -6,7 +6,7 @@
 @forward 'spacing';
 
 // Default icon path
-$icon-path: 'https://punkt-cdn.oslo.kommune.no/16.17/icons' !default;
+$icon-path: 'https://punkt-cdn.oslo.kommune.no/16.18/icons' !default;
 
 // Borders
 $border-width: (

package/dist/scss/base/_typography.scss

@@ -136,7 +136,8 @@ a,
   }
 
   &--external:hover::after,
-  &:hover:not(.pkt-btn) pkt-icon {
+  &:hover:not(.pkt-btn) pkt-icon,
+  &:hover:not(.pkt-btn) .pkt-icon {
     // #1f42aa
     filter: brightness(0) saturate(100%) invert(16%) sepia(99%) saturate(2420%) hue-rotate(222deg) brightness(93%)
       contrast(90%);

package/dist/scss/components/_listbox.scss

@@ -53,7 +53,8 @@ pkt-listbox {
       grid-area: label;
     }
 
-    pkt-icon[name='check-big'] {
+    pkt-icon[name='check-big'],
+    .pkt-icon[name='check-big'] {
       // fix for odd Safari 15 bug
       height: 1rem;
     }

package/dist/scss/components/_preview.scss

@@ -149,6 +149,7 @@
     right: 0.5rem;
     z-index: 1;
   }
+  &__prop-group,
   &__array-item,
   &__object-editor {
     position: relative;
@@ -156,13 +157,22 @@
     flex-direction: column;
     gap: 1rem;
   }
+
+  // Spec descriptions with <code> (same as docs content / SpecList)
+  .pkt-inputwrapper__helptext code {
+    background: var(--pkt-color-background-subtle);
+    border: 1px solid var(--pkt-color-border-gray);
+    border-radius: 3px;
+    padding: 0.11em 0.33em;
+    font-size: 0.8em;
+  }
   &__add-object {
     text-align: right;
     margin-top: 0.5rem;
   }
   &__remove-object {
     position: absolute;
-    top: -2rem;
+    top: -1.75rem;
     right: -0.25rem;
   }
   &__specs {

package/dist/scss/components/_searchinput.scss

@@ -73,29 +73,34 @@
   &__suggestion {
     display: block;
     padding: 1rem;
-    text-decoration: none;
     background-color: transparent;
     color: var(--pkt-color-text-action-normal);
     border: none;
     font: inherit;
     outline: inherit;
     text-align: inherit;
-    &:hover,
-    &:focus,
-    &:active {
+    width: 100%;
+
+    &:is(a, button) {
+      cursor: pointer;
       text-decoration: none;
-      background-color: var(--pkt-color-background-subtle);
-      color: var(--pkt-color-text-action-active);
-      .pkt-searchinput__suggestion-title {
-        text-decoration: underline;
-      }
-      > * {
-        color: inherit;
+
+      &:hover,
+      &:focus,
+      &:active {
+        text-decoration: none;
+        background-color: var(--pkt-color-background-subtle);
+        color: var(--pkt-color-text-action-active);
+
+        .pkt-searchinput__suggestion-title {
+          text-decoration: underline;
+        }
+
+        > * {
+          color: inherit;
+        }
       }
     }
-    &--has-hover {
-      cursor: pointer;
-    }
   }
   &__suggestion-title {
     @include typography.get-text('pkt-txt-18-medium');

package/dist/scss/components/_timepicker.scss

@@ -50,7 +50,8 @@ pkt-timepicker {
       height: auto;
       padding: 0 0.75rem;
 
-      pkt-icon {
+      pkt-icon,
+      .pkt-icon {
         width: 1.5rem;
         height: 1.5rem;
       }
@@ -160,7 +161,8 @@ pkt-timepicker {
     padding: 0 0.75rem 0 0;
     pointer-events: none;
 
-    pkt-icon {
+    pkt-icon,
+    .pkt-icon {
       width: 1.5rem;
       height: 1.5rem;
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oslokommune/punkt-css",
-  "version": "16.17.1",
+  "version": "16.18.0",
   "description": "CSS-rammeverket til Punkt, et designsystem laget av Oslo Origo",
   "homepage": "https://punkt.oslo.kommune.no",
   "author": "Team Designsystem, Oslo Origo",
@@ -60,5 +60,5 @@
     "url": "https://github.com/oslokommune/punkt/issues"
   },
   "license": "MIT",
-  "gitHead": "9c280105a8c6698188d458d289d56d8d5e6b8b86"
+  "gitHead": "693c10d8d7a30c6b5c8acb6a7cb072b0afe50554"
 }