@oslokommune/punkt-css 17.0.5 → 17.0.7

package/dist/scss/components/_timepicker.scss

@@ -56,8 +56,7 @@ pkt-timepicker {
       border: 0;
       height: auto;
       min-height: 0;
-      padding-top: 0;
-      padding-bottom: 0;
+      padding-block: 0;
       flex: 0 0 auto;
     }
 
@@ -99,10 +98,10 @@ pkt-timepicker {
         }
       }
       &.pkt-timepicker__button--prev {
-        margin-right: 0.25rem;
+        margin-inline-end: 0.25rem;
       }
       &.pkt-timepicker__button--next {
-        margin-left: 0.25rem;
+        margin-inline-start: 0.25rem;
       }
     }
 
@@ -152,7 +151,7 @@ pkt-timepicker {
 
   // Stepper variant: no left padding — the prev button takes that space
   &--stepper .pkt-input__container {
-    padding-left: 0;
+    padding-inline-start: 0;
   }
 
   &--fullwidth {
@@ -166,7 +165,7 @@ pkt-timepicker {
   &--fullwidth:not(.pkt-timepicker--stepper) {
     .pkt-input__container {
       .pkt-input-icon {
-        margin-left: auto;
+        margin-inline-start: auto;
       }
     }
   }
@@ -175,11 +174,11 @@ pkt-timepicker {
   &--fullwidth.pkt-timepicker--stepper {
     .pkt-input__container {
       .pkt-timepicker__button--prev + .pkt-timepicker__input {
-        margin-left: auto;
+        margin-inline-start: auto;
       }
 
       .pkt-timepicker__separator + .pkt-timepicker__input {
-        margin-right: auto;
+        margin-inline-end: auto;
       }
     }
   }
@@ -234,7 +233,7 @@ pkt-timepicker {
     top: 100%;
     left: 0;
     z-index: 2;
-    margin-top: 0.5rem;
+    margin-block-start: 0.5rem;
     display: flex;
     padding: 0;
     background: var(--pkt-color-background-default);

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

@@ -21,17 +21,17 @@ $-module-name: 'pkt-input-check';
 
     &-label {
       color: var(--pkt-color-text-body-default);
-      padding-left: 0.5rem;
+      padding-inline-start: 0.5rem;
       @include typography.get-text('pkt-txt-16-light');
 
       &--left {
-        padding-left: 0;
-        padding-right: 0.5rem;
+        padding-inline-start: 0;
+        padding-inline-end: 0.5rem;
       }
     }
 
     &-helptext {
-      padding-top: 0.5rem;
+      padding-block-start: 0.5rem;
       max-width: 21.875rem;
       color: var(--pkt-color-text-body-default);
       @include typography.get-text('pkt-txt-14-light');

package/dist/scss/elements/_form.scss

@@ -24,7 +24,7 @@
  */
 .pkt-form {
   &-group {
-    margin-bottom: map.get(variables.$spacing, 'size-24');
+    margin-block-end: map.get(variables.$spacing, 'size-24');
 
     &:focus-within {
       color: var(--pkt-color-brand-warm-blue-1000);

package/dist/scss/elements/_list.scss

@@ -45,15 +45,15 @@
   padding: 0;
 
   li {
-    padding-right: map.get(variables.$spacing, 'size-16');
+    padding-inline-end: map.get(variables.$spacing, 'size-16');
   }
 
   li+li {
-    padding-left: map.get(variables.$spacing, 'size-16');
+    padding-inline-start: map.get(variables.$spacing, 'size-16');
   }
 
   li:last-child {
-    padding-right: 0;
+    padding-inline-end: 0;
   }
 
   &.bordered {

package/dist/scss/elements/_section.scss

@@ -89,9 +89,9 @@
 }
 
 [class*='ok-section-'] > [class^='ok-title-'] {
-  margin-top: 0;
+  margin-block-start: 0;
 }
 
 .pkt-section--margin-top {
-  margin-top: 2.5rem;
+  margin-block-start: 2.5rem;
 }

package/dist/scss/elements/_table.scss

@@ -114,7 +114,7 @@ $-spacing-size-16: map.get(variables.$spacing, 'size-16');
       .pkt-table__data-cell,
       td {
         &::before {
-          padding-top: 1rem;
+          padding-block-start: 1rem;
         }
       }
     }

package/dist/scss/pkt-grid.scss

@@ -0,0 +1,6 @@
+@charset "utf-8";
+
+// Grid, celler og containere. Krever pkt-tokens.
+@forward 'base/containers';
+@forward 'base/grid';
+@forward 'base/layouts';

package/dist/scss/pkt-tokens.scss

@@ -0,0 +1,5 @@
+@charset "utf-8";
+
+// Fargevariabler, dark mode og @font-face
+@forward 'base/oslo-sans';
+@forward 'base/colors-tokens';

package/dist/scss/pkt-utilities.scss

@@ -0,0 +1,6 @@
+@charset "utf-8";
+
+// Hjelpeklasser for spacing, farger og visibility. Krever pkt-tokens.
+@forward 'base/colors-utilities';
+@forward 'base/spacing';
+@forward 'base/visibility';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@oslokommune/punkt-css",
-  "version": "17.0.5",
+  "version": "17.0.7",
   "description": "CSS-rammeverket til Punkt, et designsystem laget av Oslo Origo",
   "homepage": "https://punkt.oslo.kommune.no",
   "author": "Team Designsystem, Oslo Origo",
@@ -62,5 +62,5 @@
   "dependencies": {
     "astro": "^7.2.0"
   },
-  "gitHead": "a22393f8532e91c261c04e739cfc471f8d609cec"
+  "gitHead": "d13f13397fd20b7d41aee384f6ae985b32d8b507"
 }