@oslokommune/punkt-css 7.1.6 → 7.2.0

package/dist/scss/base/_typography.scss

@@ -143,7 +143,7 @@ a,
 
   &--external::after {
     content: ' ';
-    --svg: url(https://punkt-cdn.oslo.kommune.no/7.1/icons/new-window-small.svg);
+    --svg: url(https://punkt-cdn.oslo.kommune.no/7.2/icons/new-window-small.svg);
     background-image: var(--svg);
     background-repeat: no-repeat;
     background-size: 18px 18px;

package/dist/scss/components/_breadcrumbs.scss

@@ -5,55 +5,32 @@
 @use 'sass:map';
 @use '../abstracts/variables';
 @use '../abstracts/mixins/breakpoints' as *;
+@use '../abstracts/mixins/typography';
 
 .pkt-breadcrumbs {
   position: relative;
-  font-size: map.get(variables.$font-size, 'size-14');
-  padding: 0 map.get(variables.$spacing, 'size-16');
+  @include typography.get-text('pkt-txt-14-light');
 
-  @include bp('tablet-up') {
-    margin-bottom: map.get(variables.$spacing, 'size-16');
-  }
-
-  @include bp('laptop-up') {
-    padding: 0 map.get(variables.$spacing, 'size-64');
-  }
 
   &__list {
     display: flex;
     flex-direction: column;
     height: auto;
-    overflow: hidden;
     list-style-type: none;
     border-bottom: 1px solid transparent;
     transition: all 0.4s ease-in-out;
 
     @include bp('phablet-up') {
       flex-direction: row;
-      padding: 0 1rem;
       border-bottom-color: transparent !important;
     }
-
-    &.expanded {
-      align-items: flex-start;
-      max-height: 25rem;
-      border-bottom-color: var(--color-gray);
-      transition: all 0.4s ease-in-out;
-
-      & > .pkt-breadcrumbs__item {
-        display: block;
-      }
-
-      & > .pkt-breadcrumbs__item:last-child {
-        display: block;
-      }
-    }
   }
 
   &__item {
     position: relative;
     display: none;
     width: 100%;
+    text-decoration: underline;
 
     @include bp('phablet-up') {
       display: block;
@@ -62,6 +39,7 @@
 
     &:last-child {
       display: block;
+      text-decoration: none;
 
       @include bp('tablet-up') {
         max-width: 300px;
@@ -73,31 +51,11 @@
     }
   }
 
-  &__link {
-    text-decoration: none;
-    color: var(--color-blue-dark);
-
-    &:visited,
-    &:focus,
-    &:hover,
-    &:active {
-      color: var(--color-blue-dark);
-    }
-
-    &:hover {
-      text-decoration: underline;
-    }
-  }
-
   &__label {
     display: flex;
     align-items: center;
-    justify-content: flex-start;
     width: 100%;
     white-space: nowrap;
-    padding: map.get(variables.$spacing, 'size-12')
-      map.get(variables.$spacing, 'size-16')
-      map.get(variables.$spacing, 'size-16') 0;
   }
 
   &__text {
@@ -110,9 +68,11 @@
     @include bp('phablet-up') {
       max-width: 120px;
     }
+
     @include bp('tablet-up') {
       max-width: 200px;
     }
+
     @include bp('tablet-big-up') {
       max-width: 300px;
     }
@@ -121,6 +81,23 @@
   &__icon {
     width: 1rem;
     height: 1rem;
-    margin-right: map.get(variables.$spacing, 'size-12');
+    margin-left: map.get(variables.$spacing, 'size-8');
+  }
+
+
+  &--desktop {
+    display: none !important;
+
+    @include bp('phablet-up') {
+      display: inline-flex !important;
+    }
+  }
+
+  &--mobile {
+    display: inline-flex !important;
+
+    @include bp('phablet-up') {
+      display: none !important;
+    }
   }
 }

package/dist/scss/components/_inputwrapper.scss

@@ -41,6 +41,10 @@
       &-open {
         width: 100%;
         display: block;
+        border-left: 2px solid var(--color-blue-dark);
+        padding: map.get(variables.$spacing, 'size-8')
+          map.get(variables.$spacing, 'size-16');
+        margin-bottom: map.get(variables.$spacing, 'size-4');
       }
 
       &-closed {
@@ -100,6 +104,7 @@
   .pkt-btn {
     @include typography.get-text('pkt-txt-14-light');
     padding: 0;
+    height: auto;
   }
 
   &--error {

package/dist/scss/elements/_checkbox-radio.scss

@@ -81,7 +81,7 @@ $-module-name: 'pkt-form-check-input';
     }
 
     &[type='checkbox'] {
-      --svg: url(https://punkt-cdn.oslo.kommune.no/7.1/icons/check-medium.svg);
+      --svg: url(https://punkt-cdn.oslo.kommune.no/7.2/icons/check-medium.svg);
       position: relative;
       background-color: blue;
     }

package/dist/scss/elements/_select.scss

@@ -10,7 +10,7 @@
 @use '../abstracts/functions';
 
 .pkt-select {
-  --svg: url(https://punkt-cdn.oslo.kommune.no/7.1/icons/chevron-thin-down.svg);
+  --svg: url(https://punkt-cdn.oslo.kommune.no/7.2/icons/chevron-thin-down.svg);
 
   display: block;
   background-color: var(--color-white);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oslokommune/punkt-css",
-  "version": "7.1.6",
+  "version": "7.2.0",
   "description": "CSS-rammeverket til Punkt, et designsystem laget av Oslo Origo",
   "homepage": "https://punkt.oslo.kommune.no",
   "author": "Team Designsystem, Oslo Origo",
@@ -55,5 +55,5 @@
     "url": "https://github.com/oslokommune/punkt/issues"
   },
   "license": "MIT",
-  "gitHead": "baeec3b03bbbe29c7f8bd5adac16d9516c948bc3"
+  "gitHead": "f66d7532315a855442edf9e19cf883d7862a787f"
 }