@oslokommune/punkt-css 11.2.2 → 11.3.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/11.2/icons' !default;
+$icon-path: 'https://punkt-cdn.oslo.kommune.no/11.3/icons' !default;
 
 // Borders
 $border-width: (

package/dist/scss/components/_alert.scss

@@ -105,8 +105,10 @@ $-border-thickness: map.get(variables.$spacing, 'size-4');
 }
 
 // Utelukkende for bruk i feilmeldinger i InputWrapper
-.#{$-module-name}--slim {
-  padding: map.get(variables.$spacing, 'size-12') map.get(variables.$spacing, 'size-16') map.get(variables.$spacing, 'size-12') map.get(variables.$spacing, 'size-4');
+.#{$-module-name}--compact {
+  padding: map.get(variables.$spacing, 'size-12')
+    map.get(variables.$spacing, 'size-16')
+    map.get(variables.$spacing, 'size-12') map.get(variables.$spacing, 'size-4');
 
   .#{$-module-name}__icon {
     width: 1.375rem;
@@ -117,6 +119,9 @@ $-border-thickness: map.get(variables.$spacing, 'size-4');
 
   .#{$-module-name}__text {
     @include get-text('pkt-txt-16-light');
-    margin: 0 0 0 2.875rem;
+    margin: 0 2.875rem;
+  }
+  .#{$-module-name}__close {
+    top: 0.25rem;
   }
 }

package/dist/scss/components/_messagebox.scss

@@ -1,4 +1,4 @@
-/* 
+/*
  * Messagebox component
  */
 @use 'sass:map';
@@ -10,6 +10,7 @@ $-module-name: 'pkt-messagebox';
 
 // Spacing
 $-messagebox-spacing: map.get(variables.$spacing, 'size-24');
+$-messagebox-spacing-compact: map.get(variables.$spacing, 'size-16');
 $-border-thickness: map.get(variables.$spacing, 'size-4');
 
 // default is "info"
@@ -35,7 +36,8 @@ $-border-thickness: map.get(variables.$spacing, 'size-4');
 }
 
 .#{$-module-name} {
-  padding: $-messagebox-spacing $-messagebox-spacing $-messagebox-spacing calc($-messagebox-spacing - $-border-thickness);
+  padding: $-messagebox-spacing $-messagebox-spacing $-messagebox-spacing
+    calc($-messagebox-spacing - $-border-thickness);
   display: block;
   position: relative;
   border-left: $-border-thickness solid var(--pkt-color-messagebox-bc);
@@ -60,3 +62,17 @@ $-border-thickness: map.get(variables.$spacing, 'size-4');
     }
   }
 }
+
+// Compact variant
+.#{$-module-name}--compact {
+  padding: $-messagebox-spacing-compact $-messagebox-spacing-compact
+    $-messagebox-spacing-compact
+    calc($-messagebox-spacing-compact - $-border-thickness);
+  .#{$-module-name}__title {
+    @include get-text('pkt-txt-16-medium');
+  }
+
+  .#{$-module-name}__text {
+    @include get-text('pkt-txt-16-light');
+  }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oslokommune/punkt-css",
-  "version": "11.2.2",
+  "version": "11.3.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": "774e405fe043821677feddd5ad6bdeeefd2d6cdb"
+  "gitHead": "14f97a3b27054b3ef5b50b800e49c039e2b2be23"
 }