@oslokommune/punkt-css 5.1.19 → 5.2.1

package/dist/scss/abstracts/mixins/_typography.scss

@@ -10,32 +10,23 @@
   .#{$name} {
     font-size: map.get(variables.$font-size, map.get($style, 'size'));
     font-weight: map.get(variables.$font-weight, map.get($style, 'weight'));
-    letter-spacing: map.get(
-      variables.$letter-spacing,
-      map.get($style, 'letter-spacing')
-    );
-    line-height: map.get(
-      variables.$line-height,
-      map.get($style, 'line-height')
-    );
+    letter-spacing: map.get(variables.$letter-spacing,
+        map.get($style, 'letter-spacing'));
+    line-height: map.get(variables.$line-height,
+        map.get($style, 'line-height'));
   }
 }
 
 // Fetch pkt get-text from settings files
 @mixin get-text($name) {
-  font-size: map.get(
-    variables.$font-size,
-    functions.map-deep-get(variables.$pkt-styles, $name, 'size')
-  );
-  font-weight: map.get(
-    variables.$font-weight,
-    functions.map-deep-get(variables.$pkt-styles, $name, 'weight')
-  );
-  letter-spacing: map.get(
-    variables.$letter-spacing,
-    functions.map-deep-get(variables.$pkt-styles, $name, 'letter-spacing')
-  );
-  line-height: 1.5em;
+  font-size: map.get(variables.$font-size,
+      functions.map-deep-get(variables.$pkt-styles, $name, 'size'));
+  font-weight: map.get(variables.$font-weight,
+      functions.map-deep-get(variables.$pkt-styles, $name, 'weight'));
+  letter-spacing: map.get(variables.$letter-spacing,
+      functions.map-deep-get(variables.$pkt-styles, $name, 'letter-spacing'));
+  line-height: map.get(variables.$line-height,
+      functions.map-deep-get(variables.$pkt-styles, $name, 'line-height'));
 }
 
 @mixin truncate-text() {

package/dist/scss/abstracts/variables/_typography.scss

@@ -4,52 +4,46 @@ $font-path: '@oslokommune/punkt-assets/dist' !default;
 $font-family: (
   'normal': "'Oslo Sans', arial, sans-serif",
   'icon': "'Oslo Icons', sans-serif",
-) !default;
+  ) !default;
 
 $font-face: (
-  'regular': (
-    'family': Oslo Sans,
+  'regular': ('family': Oslo Sans,
     'style': normal,
     'weight': 400,
     'src-woff': '#{$font-path}/fonts/OsloSans-Regular.woff',
     'src-woff2': '#{$font-path}/fonts/OsloSans-Regular.woff2',
   ),
-  'regular-italic': (
-    'family': Oslo Sans,
+  'regular-italic': ('family': Oslo Sans,
     'style': italic,
     'weight': 400,
     'src-woff': '#{$font-path}/fonts/OsloSans-RegularItalic.woff',
     'src-woff2': '#{$font-path}/fonts/OsloSans-RegularItalic.woff2',
   ),
-  'light': (
-    'family': Oslo Sans,
+  'light': ('family': Oslo Sans,
     'style': normal,
     'weight': 300,
     'src-woff': '#{$font-path}/fonts/OsloSans-Light.woff',
     'src-woff2': '#{$font-path}/fonts/OsloSans-Light.woff2',
   ),
-  'medium': (
-    'family': Oslo Sans,
+  'medium': ('family': Oslo Sans,
     'style': normal,
     'weight': 500,
     'src-woff': '#{$font-path}/fonts/OsloSans-Medium.woff',
     'src-woff2': '#{$font-path}/fonts/OsloSans-Medium.woff2',
   ),
-  'bold': (
-    'family': Oslo Sans,
+  'bold': ('family': Oslo Sans,
     'style': normal,
     'weight': 700,
     'src-woff': '#{$font-path}/fonts/OsloSans-Bold.woff',
     'src-woff2': '#{$font-path}/fonts/OsloSans-Bold.woff2',
   ),
-  'icons': (
-    'family': Oslo Icons,
+  'icons': ('family': Oslo Icons,
     'style': normal,
     'weight': 400,
     'src-woff': '#{$font-path}/fonts/OsloIcons.woff',
     'src-woff2': '#{$font-path}/fonts/OsloIcons.woff2',
   ),
-) !default;
+  ) !default;
 
 $font-size-base: 16px;
 $font-size: (
@@ -66,17 +60,17 @@ $font-size: (
   'size-36': 2.25rem,
   'size-40': 2.5rem,
   'size-54': 3.375rem,
-) !default;
+  ) !default;
 
 $font-weight: (
   'light': 300,
   'regular': 400,
   'medium': 500,
   'bold': 700,
-) !default;
+  ) !default;
 
 $line-height: (
-  'body': 1.5em,
+  'body': 1.5rem,
   'lh-82': 5.125rem,
   'lh-60': 3.75rem,
   'lh-54': 3.375rem,
@@ -90,339 +84,283 @@ $line-height: (
   'lh-24': 1.5rem,
   'lh-22': 1.375rem,
   'lh-20': 1.25rem,
-) !default;
+  ) !default;
 
 $letter-spacing: (
   'tighter': -0.4px,
   'tight': -0.2px,
   'normal': normal,
-) !default;
+  ) !default;
 
 $pkt-font-weight: (
-  'pkt-font-light': (
-    'weight': 'light',
+  'pkt-font-light': ('weight': 'light',
   ),
-  'pkt-font-regular': (
-    'weight': 'regular',
+  'pkt-font-regular': ('weight': 'regular',
   ),
-  'pkt-font-medium': (
-    'weight': 'medium',
+  'pkt-font-medium': ('weight': 'medium',
   ),
-  'pkt-font-bold': (
-    'weight': 'bold',
+  'pkt-font-bold': ('weight': 'bold',
   ),
 );
 
 // pkt specific styles
 $pkt-styles: (
-  'pkt-txt-54': (
-    'size': 'size-54',
+  'pkt-txt-54': ('size': 'size-54',
     'weight': 'regular',
     'letter-spacing': 'tighter',
     'line-height': 'lh-82',
   ),
-  'pkt-txt-40': (
-    'size': 'size-40',
+  'pkt-txt-40': ('size': 'size-40',
     'weight': 'regular',
     'letter-spacing': 'tight',
     'line-height': 'lh-60',
   ),
-  'pkt-txt-36': (
-    'size': 'size-36',
+  'pkt-txt-36': ('size': 'size-36',
     'weight': 'regular',
     'letter-spacing': 'tight',
     'line-height': 'lh-54',
   ),
-  'pkt-txt-30': (
-    'size': 'size-30',
+  'pkt-txt-30': ('size': 'size-30',
     'weight': 'regular',
     'letter-spacing': 'tight',
     'line-height': 'lh-44',
   ),
-  'pkt-txt-28': (
-    'size': 'size-28',
+  'pkt-txt-28': ('size': 'size-28',
     'weight': 'regular',
     'letter-spacing': 'tight',
     'line-height': 'lh-42',
   ),
-  'pkt-txt-26': (
-    'size': 'size-26',
+  'pkt-txt-26': ('size': 'size-26',
     'weight': 'regular',
     'letter-spacing': 'tight',
     'line-height': 'lh-40',
   ),
-  'pkt-txt-24': (
-    'size': 'size-24',
+  'pkt-txt-24': ('size': 'size-24',
     'weight': 'regular',
     'letter-spacing': 'tight',
     'line-height': 'lh-36',
   ),
-  'pkt-txt-22': (
-    'size': 'size-22',
+  'pkt-txt-22': ('size': 'size-22',
     'weight': 'regular',
     'letter-spacing': 'tight',
     'line-height': 'lh-34',
   ),
-  'pkt-txt-20': (
-    'size': 'size-20',
+  'pkt-txt-20': ('size': 'size-20',
     'weight': 'regular',
     'letter-spacing': 'tight',
     'line-height': 'lh-32',
   ),
-  'pkt-txt-18': (
-    'size': 'size-18',
+  'pkt-txt-18': ('size': 'size-18',
     'weight': 'regular',
     'letter-spacing': 'tight',
     'line-height': 'lh-28',
   ),
-  'pkt-txt-16': (
-    'size': 'size-16',
+  'pkt-txt-16': ('size': 'size-16',
     'weight': 'regular',
     'letter-spacing': 'tight',
     'line-height': 'lh-24',
   ),
-  'pkt-txt-14': (
-    'size': 'size-14',
+  'pkt-txt-14': ('size': 'size-14',
     'weight': 'regular',
     'letter-spacing': 'tight',
     'line-height': 'lh-22',
   ),
-  'pkt-txt-12': (
-    'size': 'size-12',
+  'pkt-txt-12': ('size': 'size-12',
     'weight': 'regular',
     'letter-spacing': 'tight',
     'line-height': 'lh-20',
   ),
-  'pkt-txt-54-medium': (
-    'size': 'size-54',
+  'pkt-txt-54-medium': ('size': 'size-54',
     'weight': 'medium',
     'letter-spacing': 'tighter',
     'line-height': 'lh-82',
   ),
-  'pkt-txt-40-medium': (
-    'size': 'size-40',
+  'pkt-txt-40-medium': ('size': 'size-40',
     'weight': 'medium',
     'letter-spacing': 'tight',
     'line-height': 'lh-60',
   ),
-  'pkt-txt-36-medium': (
-    'size': 'size-36',
+  'pkt-txt-36-medium': ('size': 'size-36',
     'weight': 'medium',
     'letter-spacing': 'tight',
     'line-height': 'lh-54',
   ),
-  'pkt-txt-30-medium': (
-    'size': 'size-30',
+  'pkt-txt-30-medium': ('size': 'size-30',
     'weight': 'medium',
     'letter-spacing': 'tight',
     'line-height': 'lh-44',
   ),
-  'pkt-txt-28-medium': (
-    'size': 'size-28',
+  'pkt-txt-28-medium': ('size': 'size-28',
     'weight': 'medium',
     'letter-spacing': 'tight',
     'line-height': 'lh-42',
   ),
-  'pkt-txt-26-medium': (
-    'size': 'size-26',
+  'pkt-txt-26-medium': ('size': 'size-26',
     'weight': 'medium',
     'letter-spacing': 'tight',
     'line-height': 'lh-40',
   ),
-  'pkt-txt-24-medium': (
-    'size': 'size-24',
+  'pkt-txt-24-medium': ('size': 'size-24',
     'weight': 'medium',
     'letter-spacing': 'tight',
     'line-height': 'lh-36',
   ),
-  'pkt-txt-22-medium': (
-    'size': 'size-22',
+  'pkt-txt-22-medium': ('size': 'size-22',
     'weight': 'medium',
     'letter-spacing': 'tight',
     'line-height': 'lh-34',
   ),
-  'pkt-txt-20-medium': (
-    'size': 'size-20',
+  'pkt-txt-20-medium': ('size': 'size-20',
     'weight': 'medium',
     'letter-spacing': 'tight',
     'line-height': 'lh-32',
   ),
-  'pkt-txt-18-medium': (
-    'size': 'size-18',
+  'pkt-txt-18-medium': ('size': 'size-18',
     'weight': 'medium',
     'letter-spacing': 'tight',
     'line-height': 'lh-28',
   ),
-  'pkt-txt-16-medium': (
-    'size': 'size-16',
+  'pkt-txt-16-medium': ('size': 'size-16',
     'weight': 'medium',
     'letter-spacing': 'tight',
     'line-height': 'lh-24',
   ),
-  'pkt-txt-14-medium': (
-    'size': 'size-14',
+  'pkt-txt-14-medium': ('size': 'size-14',
     'weight': 'medium',
     'letter-spacing': 'tight',
     'line-height': 'lh-22',
   ),
-  'pkt-txt-12-medium': (
-    'size': 'size-12',
+  'pkt-txt-12-medium': ('size': 'size-12',
     'weight': 'medium',
     'letter-spacing': 'tight',
     'line-height': 'lh-20',
   ),
-  'pkt-txt-54-bold': (
-    'size': 'size-54',
+  'pkt-txt-54-bold': ('size': 'size-54',
     'weight': 'bold',
     'letter-spacing': 'tighter',
     'line-height': 'lh-82',
   ),
-  'pkt-txt-40-bold': (
-    'size': 'size-40',
+  'pkt-txt-40-bold': ('size': 'size-40',
     'weight': 'bold',
     'letter-spacing': 'tight',
     'line-height': 'lh-60',
   ),
-  'pkt-txt-36-bold': (
-    'size': 'size-36',
+  'pkt-txt-36-bold': ('size': 'size-36',
     'weight': 'bold',
     'letter-spacing': 'tight',
     'line-height': 'lh-54',
   ),
-  'pkt-txt-30-bold': (
-    'size': 'size-30',
+  'pkt-txt-30-bold': ('size': 'size-30',
     'weight': 'bold',
     'letter-spacing': 'tight',
     'line-height': 'lh-44',
   ),
-  'pkt-txt-28-bold': (
-    'size': 'size-28',
+  'pkt-txt-28-bold': ('size': 'size-28',
     'weight': 'bold',
     'letter-spacing': 'tight',
     'line-height': 'lh-42',
   ),
-  'pkt-txt-26-bold': (
-    'size': 'size-26',
+  'pkt-txt-26-bold': ('size': 'size-26',
     'weight': 'bold',
     'letter-spacing': 'tight',
     'line-height': 'lh-40',
   ),
-  'pkt-txt-24-bold': (
-    'size': 'size-24',
+  'pkt-txt-24-bold': ('size': 'size-24',
     'weight': 'bold',
     'letter-spacing': 'tight',
     'line-height': 'lh-36',
   ),
-  'pkt-txt-22-bold': (
-    'size': 'size-22',
+  'pkt-txt-22-bold': ('size': 'size-22',
     'weight': 'bold',
     'letter-spacing': 'tight',
     'line-height': 'lh-34',
   ),
-  'pkt-txt-20-bold': (
-    'size': 'size-20',
+  'pkt-txt-20-bold': ('size': 'size-20',
     'weight': 'bold',
     'letter-spacing': 'tight',
     'line-height': 'lh-32',
   ),
-  'pkt-txt-18-bold': (
-    'size': 'size-18',
+  'pkt-txt-18-bold': ('size': 'size-18',
     'weight': 'bold',
     'letter-spacing': 'tight',
     'line-height': 'lh-28',
   ),
-  'pkt-txt-16-bold': (
-    'size': 'size-16',
+  'pkt-txt-16-bold': ('size': 'size-16',
     'weight': 'bold',
     'letter-spacing': 'tight',
     'line-height': 'lh-24',
   ),
-  'pkt-txt-14-bold': (
-    'size': 'size-14',
+  'pkt-txt-14-bold': ('size': 'size-14',
     'weight': 'bold',
     'letter-spacing': 'tight',
     'line-height': 'lh-22',
   ),
-  'pkt-txt-12-bold': (
-    'size': 'size-12',
+  'pkt-txt-12-bold': ('size': 'size-12',
     'weight': 'bold',
     'letter-spacing': 'tight',
     'line-height': 'lh-20',
   ),
-  'pkt-txt-54-light': (
-    'size': 'size-54',
+  'pkt-txt-54-light': ('size': 'size-54',
     'weight': 'light',
     'letter-spacing': 'tighter',
     'line-height': 'lh-82',
   ),
-  'pkt-txt-40-light': (
-    'size': 'size-40',
+  'pkt-txt-40-light': ('size': 'size-40',
     'weight': 'light',
     'letter-spacing': 'tight',
     'line-height': 'lh-60',
   ),
-  'pkt-txt-36-light': (
-    'size': 'size-36',
+  'pkt-txt-36-light': ('size': 'size-36',
     'weight': 'light',
     'letter-spacing': 'tight',
     'line-height': 'lh-54',
   ),
-  'pkt-txt-30-light': (
-    'size': 'size-30',
+  'pkt-txt-30-light': ('size': 'size-30',
     'weight': 'light',
     'letter-spacing': 'tight',
     'line-height': 'lh-44',
   ),
-  'pkt-txt-28-light': (
-    'size': 'size-28',
+  'pkt-txt-28-light': ('size': 'size-28',
     'weight': 'light',
     'letter-spacing': 'tight',
     'line-height': 'lh-42',
   ),
-  'pkt-txt-26-light': (
-    'size': 'size-26',
+  'pkt-txt-26-light': ('size': 'size-26',
     'weight': 'light',
     'letter-spacing': 'tight',
     'line-height': 'lh-40',
   ),
-  'pkt-txt-24-light': (
-    'size': 'size-24',
+  'pkt-txt-24-light': ('size': 'size-24',
     'weight': 'light',
     'letter-spacing': 'tight',
     'line-height': 'lh-36',
   ),
-  'pkt-txt-22-light': (
-    'size': 'size-22',
+  'pkt-txt-22-light': ('size': 'size-22',
     'weight': 'light',
     'letter-spacing': 'tight',
     'line-height': 'lh-34',
   ),
-  'pkt-txt-20-light': (
-    'size': 'size-20',
+  'pkt-txt-20-light': ('size': 'size-20',
     'weight': 'light',
     'letter-spacing': 'tight',
     'line-height': 'lh-32',
   ),
-  'pkt-txt-18-light': (
-    'size': 'size-18',
+  'pkt-txt-18-light': ('size': 'size-18',
     'weight': 'light',
     'letter-spacing': 'tight',
     'line-height': 'lh-28',
   ),
-  'pkt-txt-16-light': (
-    'size': 'size-16',
+  'pkt-txt-16-light': ('size': 'size-16',
     'weight': 'light',
     'letter-spacing': 'tight',
     'line-height': 'lh-24',
   ),
-  'pkt-txt-14-light': (
-    'size': 'size-14',
+  'pkt-txt-14-light': ('size': 'size-14',
     'weight': 'light',
     'letter-spacing': 'tight',
     'line-height': 'lh-22',
   ),
-  'pkt-txt-12-light': (
-    'size': 'size-12',
+  'pkt-txt-12-light': ('size': 'size-12',
     'weight': 'light',
     'letter-spacing': 'tight',
     'line-height': 'lh-20',

package/dist/scss/base/_typography.scss

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

package/dist/scss/components/_index.scss

@@ -10,3 +10,4 @@
 @forward 'messagebox';
 @forward 'linkcard';
 @forward 'tag';
+@forward 'textinput';