@sbb-esta/lyne-elements 3.10.0 → 3.12.0

package/core/styles/mixins/layout.scss

@@ -1,7 +1,7 @@
 @use '../core/mediaqueries';
 
 @mixin page-spacing {
-  padding-inline: var(--sbb-layout-base-offset-responsive);
+  padding-inline: var(--sbb-page-spacing-padding, var(--sbb-layout-base-offset-responsive));
   margin-inline: auto;
 
   // If using page-spacing in flex context,
@@ -10,14 +10,15 @@
 
   @include mediaqueries.mq($from: ultra) {
     // Subtract padding to get real max-width
-    max-width: calc(
-      var(--sbb-layout-base-page-max-width) + 2 * var(--sbb-layout-base-offset-responsive)
+    max-width: var(
+      --sbb-spacing-max-width,
+      calc(var(--sbb-layout-base-page-max-width) + 2 * var(--sbb-layout-base-offset-responsive))
     );
   }
 }
 
 @mixin page-spacing-expanded {
-  padding-inline: var(--sbb-spacing-responsive-xxs);
+  padding-inline: var(--sbb-page-spacing-padding, var(--sbb-spacing-responsive-xxs));
 }
 
 @mixin grid-base {

package/core/styles/mixins/link.scss

@@ -6,17 +6,10 @@
 @mixin link-common-variables {
   --sbb-link-color-hover: light-dark(var(--sbb-color-primary125), var(--sbb-color-graphite));
   --sbb-link-color-active: light-dark(var(--sbb-color-primary150), var(--sbb-color-metal));
-  --sbb-link-text-decoration-color: light-dark(
-    color-mix(in srgb, currentcolor 80%, white),
-    color-mix(in srgb, currentcolor 80%, black)
-  );
-  --sbb-link-text-decoration-color-hover: currentcolor;
 }
 
 @mixin link-common-variables--negative {
   --sbb-focus-outline-color: var(--sbb-focus-outline-color-dark);
-  --sbb-link-text-decoration-color: color-mix(in srgb, currentcolor 80%, black);
-  --sbb-link-text-decoration-color-hover: currentcolor;
 }
 
 @mixin block-link-variables {
@@ -39,14 +32,12 @@
 @mixin block-link-variables--active {
   --sbb-link-color-normal: light-dark(var(--sbb-color-black), var(--sbb-color-cement));
   --sbb-link-text-decoration-line: underline;
-  --sbb-link-text-decoration-color: currentcolor;
 }
 
 // To display a current active page, e.g. if the CSS class sbb-active is set
 @mixin block-link-variables--active-negative {
   --sbb-link-color-normal: var(--sbb-color-cement);
   --sbb-link-text-decoration-line: underline;
-  --sbb-link-text-decoration-color: currentcolor;
 }
 
 @mixin link-variables {
@@ -73,7 +64,6 @@
 @mixin link-base {
   color: var(--sbb-link-color-normal);
   text-decoration-line: var(--sbb-link-text-decoration-line, underline);
-  text-decoration-color: var(--sbb-link-text-decoration-color);
   text-decoration-thickness: #{functions.px-to-rem-build(1)};
   text-underline-offset: 0.3125em; // 5px
   user-select: none;
@@ -95,7 +85,6 @@
   @include mediaqueries.hover-mq($hover: true) {
     color: var(--sbb-link-color-hover);
     text-decoration-line: var(--sbb-link-hover-text-decoration, underline);
-    text-decoration-color: var(--sbb-link-text-decoration-color-hover);
   }
 }
 

package/core.css

@@ -1625,8 +1625,7 @@ sbb-menu,
 sbb-navigation,
 sbb-overlay,
 sbb-popover,
-sbb-toast,
-sbb-tooltip) {
+sbb-toast) {
   margin: 0;
   padding: 0;
   border: none;
@@ -1913,4 +1912,24 @@ sbb-status:has(sbb-title) {
   --sbb-option-text-overflow: ellipsis;
   --sbb-option-overflow: hidden;
   --sbb-option-white-space: nowrap;
+}
+
+sbb-mini-calendar[orientation=horizontal] sbb-mini-calendar-month {
+  --sbb-mini-calendar-grid-auto-flow: row;
+  --sbb-mini-calendar-month-height: 3rem;
+  --sbb-mini-calendar-month-grid-template-rows: none;
+  --sbb-mini-calendar-month-grid-template-columns: repeat(7, 1fr);
+}
+sbb-mini-calendar[orientation=horizontal] sbb-mini-calendar-month sbb-mini-calendar-day:first-child {
+  grid-column-start: var(--sbb-mini-calendar-month-offset);
+}
+
+sbb-mini-calendar[orientation=vertical] sbb-mini-calendar-month {
+  --sbb-mini-calendar-grid-auto-flow: column;
+  --sbb-mini-calendar-month-height: auto;
+  --sbb-mini-calendar-month-grid-template-rows: repeat(7, 1fr);
+  --sbb-mini-calendar-month-grid-template-columns: none;
+}
+sbb-mini-calendar[orientation=vertical] sbb-mini-calendar-month sbb-mini-calendar-day:first-child {
+  grid-row-start: var(--sbb-mini-calendar-month-offset);
 }