@swisspost/design-system-styles 5.4.1 → 6.1.0

package/components/type.scss

@@ -4,71 +4,43 @@
 @use 'sass:meta';
 
 @use './../lic/bootstrap-license';
-@use './../themes/bootstrap/overrides' as *;
+@use './../themes/bootstrap/core' as *;
 @use './../themes/bootstrap/type' as bt;
 
 @use './../variables/color';
 @use './../variables/commons';
 @use './../variables/type';
+@use './../variables/heading';
 @use './../variables/spacing';
 @use './../variables/components/paragraph';
 @use './../layouts/portal/type' as portal;
 @use './../placeholders/text';
 @use './../mixins/type' as type-mx;
 
-h1,
-.h1,
-h2,
-.h2,
-h3,
-.h3,
-h4,
-.h4,
-h5,
-.h5,
-h6,
-.h6 {
-  font-weight: type.$font-weight-bold;
-}
-
-h6,
-.h6,
-.font-curve-tiny {
-  @include type-mx.font-curve('tiny');
-}
-
-.font-curve-small {
-  @include type-mx.font-curve('small');
-}
-
-.font-curve-regular {
-  @include type-mx.font-curve('regular');
-}
-
-h5,
-.h5,
-.font-curve-bigger-regular {
-  @include type-mx.font-curve('bigger-regular');
+// Deprecated
+@each $key, $curve in type.$font-curves {
+  .font-curve-#{$key} {
+    @include type-mx.font-curve($key);
+  }
 }
 
-h3,
-.h3,
-h4,
-.h4,
-.font-curve-medium {
-  @include type-mx.font-curve('medium');
+// Generate heading sizes using the sizes map and the font-curve mixin
+@each $heading in ('h1', 'h2', 'h3', 'h4', 'h5', 'h6') {
+  #{$heading},
+  .#{$heading} {
+    @include type-mx.font-curve('heading-sizes-#{$heading}', heading.$heading-sizes);
+  }
 }
 
-h2,
-.h2,
-.font-curve-large {
-  @include type-mx.font-curve('large');
-}
+@each $key, $font-size in type.$font-size-map {
+  .font-size-#{$key} {
+    font-size: $font-size;
 
-h1,
-.h1,
-.font-curve-big {
-  @include type-mx.font-curve('big');
+    // Font sizes bigger than 24px can have a reduced line height
+    @if ($key >= 24) {
+      line-height: type.$line-height-heading;
+    }
+  }
 }
 
 .blockquote {

package/components/utilities.scss

@@ -3,7 +3,7 @@
 @use 'sass:map';
 @use 'sass:list';
 @use './../lic/bootstrap-license';
-@use './../themes/bootstrap/overrides' as bootstrap;
+@use './../themes/bootstrap/core' as *;
 @use './../themes/bootstrap/utilities' as bu; // TODO: Move Design System utilities to utilities folder.
 @use './../mixins/utilities';
 @use './../variables/color';
@@ -30,25 +30,25 @@
 }
 
 .h-visuallyhidden-up-md {
-  @include bootstrap.media-breakpoint-up(md) {
+  @include media-breakpoint-up(md) {
     @include utilities.visuallyhidden;
   }
 }
 
 .h-visuallyhidden-down-rg {
-  @include bootstrap.media-breakpoint-down(rg) {
+  @include media-breakpoint-down(rg) {
     @include utilities.visuallyhidden;
   }
 }
 
 .h-visuallyhidden-down-lg {
-  @include bootstrap.media-breakpoint-down(lg) {
+  @include media-breakpoint-down(lg) {
     @include utilities.visuallyhidden;
   }
 }
 
 .h-clearfix {
-  @include bootstrap.clearfix;
+  @include clearfix;
 }
 
 //-- Legacy --

package/core.scss

@@ -2,4 +2,4 @@
 @forward './variables';
 @forward './mixins';
 
-@import './themes/bootstrap/overrides';
+@import './themes/bootstrap/core';

package/functions/_sizing.scss

@@ -32,6 +32,7 @@
 
 // Hardcoded numbers come directly from design (new CI/CD)
 // line-height always depends on font-size
+// Deprecated
 @function line-height-calc($val) {
   @if $val < px-to-rem(17) {
     @return 1.5;