npm - @marioschmidt/design-system-tokens - Versions diffs - 1.0.64 → 1.0.66 - Mend

@marioschmidt/design-system-tokens 1.0.64 → 1.0.66

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (3096) hide show

package/dist/css/sportbild/components/newsticker.css CHANGED Viewed

@@ -1,7 +1,7 @@
 /**
  * Do not edit directly, this file was auto-generated.
  *
- * SPORTBILD Design System Tokens v1.0.64
+ * SPORTBILD Design System Tokens v1.0.66
  * Generated by Style Dictionary v4.0.0
  *
  * Brand: Sportbild | Bundle: NewsTicker Component Tokens
@@ -12,30 +12,6 @@
  * Documentation: https://github.com/UXWizard25/vv-token-test-v3#readme
  */
-/* === COLOR TOKENS (LIGHT MODE) === */
-[data-brand="sportbild"][data-theme="light"] {
-  /* ============================================
-     OTHER
-     ============================================ */
-  --news-ticker-timestamp-color: var(--label-color-tertiary, #8C9196);
-  --news-ticker-badge-icons-color: var(--label-color-tertiary, #8C9196);
-}
-/* === COLOR TOKENS (DARK MODE) === */
-[data-brand="sportbild"][data-theme="dark"] {
-  /* ============================================
-     OTHER
-     ============================================ */
-  --news-ticker-timestamp-color: var(--label-color-tertiary, #8C9196);
-  --news-ticker-badge-icons-color: var(--label-color-tertiary, #8C9196);
-}
 /* === TYPOGRAPHY TOKENS === */
 [data-brand="sportbild"] {
@@ -49,15 +25,15 @@
   .news-ticker-kicker {
     font-family: var(--font-family-antenna-extra-cond, AntennaExtraCond);
     font-weight: var(--font-weight-bold, 700);
-    font-size: var(--kicker3-font-size, 16px);
-    line-height: var(--kicker3-line-height, 17.6px);
+    font-size: var(--kicker-3-font-size, 16px);
+    line-height: var(--kicker-3-line-height, 17.6px);
   }
   .news-ticker-headline {
     font-family: var(--font-family-antenna-extra-cond, AntennaExtraCond);
     font-weight: 900;
-    font-size: var(--headline3-font-size, 30px);
-    line-height: var(--headline3-line-height, 33px);
+    font-size: var(--headline-3-font-size, 30px);
+    line-height: var(--headline-3-line-height, 33px);
     font-style: italic;
   }
@@ -70,35 +46,34 @@
   --news-ticker-time-font-weight: var(--font-weight-bold, 700);
   --news-ticker-time-font-family: var(--font-family-antenna-extra-cond, AntennaExtraCond);
   --news-ticker-time-line-height: 20.8;
-  --news-ticker-content-stack-space: var(--gap-space-const-xs, 4px);
-  --news-ticker-kicker-inner-stack-space: var(--space0p25x, 2px);
+  --news-ticker-content-stack-space: var(--gap-space-const-xs);
+  --news-ticker-kicker-inner-stack-space: var(--space-0-p-25-x, 2px);
   --news-ticker-titles-inline-space: 18px;
-  --news-ticker-badges-inline-space: var(--space1x, 8px);
-  --news-ticker-time-kicker-stack-space: var(--space0p5x, 4px);
-  --news-ticker-entries-stack-space: var(--space2p75x, 22px);
-  --news-ticker-kicker-inner-inline-space: var(--space0p5x, 4px);
-  --news-ticker-skeleton-bottom-space: var(--space8x, 64px);
-  --news-ticker-red-dot-size: var(--size1p5x, 12px);
-  --news-ticker-entries-left-inline-space: var(--space2p75x, 22px);
-  --news-ticker-line-inline-space: var(--space0p75x, 6px);
+  --news-ticker-badges-inline-space: var(--space-1-x, 8px);
+  --news-ticker-time-kicker-stack-space: var(--space-0-p-5-x, 4px);
+  --news-ticker-entries-stack-space: var(--space-2-p-75-x, 22px);
+  --news-ticker-kicker-inner-inline-space: var(--space-0-p-5-x, 4px);
+  --news-ticker-skeleton-bottom-space: var(--space-8-x, 64px);
+  --news-ticker-red-dot-size: var(--size-1-p-5-x, 12px);
+  --news-ticker-entries-left-inline-space: var(--space-2-p-75-x, 22px);
+  --news-ticker-line-inline-space: var(--space-0-p-75-x, 6px);
   --news-ticker-app-card-height-size: 116px;
   --news-ticker-app-card-width-size: 250px;
 }
 @media (min-width: 390px) {
   [data-brand="sportbild"] {
-    --news-ticker-time-font-family: var(--label-font-family, AntennaExtraCond);
+    --news-ticker-time-font-family: var(--label-font-family);
   }
 }
 @media (min-width: 600px) {
   [data-brand="sportbild"] {
-    --news-ticker-time-font-family: var(--label-font-family, AntennaExtraCond);
-    --news-ticker-titles-inline-space: var(--space3x, 24px);
-    --news-ticker-badges-inline-space: var(--space1p5x, 12px);
-    --news-ticker-time-kicker-stack-space: var(--space0p75x, 6px);
+    --news-ticker-titles-inline-space: var(--space-3-x, 24px);
+    --news-ticker-badges-inline-space: var(--space-1-p-5-x, 12px);
+    --news-ticker-time-kicker-stack-space: var(--space-0-p-75-x, 6px);
     --news-ticker-skeleton-bottom-space: 0px;
-    --news-ticker-red-dot-size: var(--size1p75x, 14px);
+    --news-ticker-red-dot-size: var(--size-1-p-75-x, 14px);
     --news-ticker-line-inline-space: 7px;
     --news-ticker-app-card-height-size: 150px;
     --news-ticker-app-card-width-size: 300px;
@@ -108,15 +83,17 @@
 @media (min-width: 1024px) {
   [data-brand="sportbild"] {
     --news-ticker-time-font-size: 18px;
-    --news-ticker-time-font-family: var(--label-font-family, AntennaExtraCond);
     --news-ticker-time-line-height: 23.4;
     --news-ticker-titles-inline-space: 30px;
-    --news-ticker-badges-inline-space: var(--space2x, 16px);
-    --news-ticker-time-kicker-stack-space: var(--space0p75x, 6px);
-    --news-ticker-skeleton-bottom-space: 0px;
-    --news-ticker-red-dot-size: var(--size2x, 16px);
-    --news-ticker-line-inline-space: var(--space1x, 8px);
-    --news-ticker-app-card-height-size: 150px;
-    --news-ticker-app-card-width-size: 300px;
+    --news-ticker-badges-inline-space: var(--space-2-x, 16px);
+    --news-ticker-red-dot-size: var(--size-2-x, 16px);
+    --news-ticker-line-inline-space: var(--space-1-x, 8px);
   }
 }
+/* === OTHER TOKENS === */
+[data-brand="sportbild"] {
+  --news-ticker-timestamp-color: var(--label-color-tertiary);
+  --news-ticker-badge-icons-color: var(--label-color-tertiary);
+}

package/dist/css/sportbild/components/pagination.css CHANGED Viewed

@@ -1,7 +1,7 @@
 /**
  * Do not edit directly, this file was auto-generated.
  *
- * SPORTBILD Design System Tokens v1.0.64
+ * SPORTBILD Design System Tokens v1.0.66
  * Generated by Style Dictionary v4.0.0
  *
  * Brand: Sportbild | Bundle: Pagination Component Tokens
@@ -15,31 +15,17 @@
 /* === COLOR TOKENS (LIGHT MODE) === */
 [data-brand="sportbild"][data-theme="light"] {
-  /* ============================================
-     OTHER
-     ============================================ */
-  --pagination-element-color-default: var(--bild085, #CED4DA);
-  --pagination-element-color-active: var(--accent-color-primary, #174482);
-  --gallery-pagination-element-active-opacity: var(--layer-opacity100, 1);
-  --scroll-bar-track-bg-color: var(--black-alpha10, rgba(0, 0, 0, 0.1));
-  --scroll-bar-thumb-bg-color: var(--bild060, #8C9196);
+  --pagination-element-color-default: var(--color-neutral-85, #CED4DA);
+  --scroll-bar-track-bg-color: var(--alpha-black-10, rgba(0, 0, 0, 0.1));
+  --scroll-bar-thumb-bg-color: var(--color-neutral-60, #8C9196);
 }
 /* === COLOR TOKENS (DARK MODE) === */
 [data-brand="sportbild"][data-theme="dark"] {
-  /* ============================================
-     OTHER
-     ============================================ */
-  --pagination-element-color-default: var(--bild060, #8C9196);
-  --pagination-element-color-active: var(--accent-color-primary, #F7F9FD);
-  --gallery-pagination-element-active-opacity: var(--layer-opacity100, 1);
-  --scroll-bar-track-bg-color: var(--white-alpha10, rgba(255, 255, 255, 0.1));
-  --scroll-bar-thumb-bg-color: var(--bild060, #8C9196);
+  --pagination-element-color-default: var(--color-neutral-60, #8C9196);
+  --scroll-bar-track-bg-color: var(--alpha-white-10, rgba(255, 255, 255, 0.1));
+  --scroll-bar-thumb-bg-color: var(--color-neutral-60, #8C9196);
 }
 /* === TYPOGRAPHY TOKENS === */
@@ -48,9 +34,9 @@
   .numbered-pagination-active {
     font-family: var(--font-family-antenna-extra-cond, AntennaExtraCond);
     font-weight: var(--font-weight-bold, 700);
-    font-size: var(--label1-font-size, 17px);
-    line-height: var(--label1-line-height, 20.4px);
-    letter-spacing: var(--letter-space0p25, 0.25px);
+    font-size: var(--label-1-font-size, 17px);
+    line-height: var(--label-1-line-height, 20.4px);
+    letter-spacing: var(--letter-space-0-p-25, 0.25px);
     text-decoration: underline;
   }
@@ -59,23 +45,23 @@
 /* === BREAKPOINT TOKENS === */
 [data-brand="sportbild"] {
-  --gallery-pagination-item-height-size: var(--size0-5x, 4px);
-  --gallery-pagination-container-web-inline-space: var(--inline-space-const-sm, 8px);
-  --gallery-pagination-container-stack-space: var(--stack-space-const-md, 12px);
-  --gallery-pagination-container-app-inline-space: var(--inline-space-const-md, 12px);
-  --scroll-bar-thickness-size: var(--size1x, 8px);
+  --gallery-pagination-item-height-size: var(--size-0-p-5-x, 4px);
+  --gallery-pagination-container-web-inline-space: var(--inline-space-const-sm);
+  --gallery-pagination-container-stack-space: var(--stack-space-const-md);
+  --gallery-pagination-container-app-inline-space: var(--inline-space-const-md);
+  --scroll-bar-thickness-size: var(--size-1-x, 8px);
 }
 @media (min-width: 600px) {
   [data-brand="sportbild"] {
-    --gallery-pagination-container-web-inline-space: var(--inline-space-const-md, 12px);
-    --gallery-pagination-container-stack-space: var(--stack-space-const-lg, 16px);
+    --gallery-pagination-container-web-inline-space: var(--inline-space-const-md);
+    --gallery-pagination-container-stack-space: var(--stack-space-const-lg);
   }
 }
-@media (min-width: 1024px) {
-  [data-brand="sportbild"] {
-    --gallery-pagination-container-web-inline-space: var(--inline-space-const-md, 12px);
-    --gallery-pagination-container-stack-space: var(--stack-space-const-lg, 16px);
-  }
+/* === OTHER TOKENS === */
+[data-brand="sportbild"] {
+  --pagination-element-color-active: var(--accent-color-primary);
+  --gallery-pagination-element-active-opacity: var(--layer-opacity-100);
 }

package/dist/css/sportbild/components/partnerlinks.css CHANGED Viewed

@@ -1,7 +1,7 @@
 /**
  * Do not edit directly, this file was auto-generated.
  *
- * SPORTBILD Design System Tokens v1.0.64
+ * SPORTBILD Design System Tokens v1.0.66
  * Generated by Style Dictionary v4.0.0
  *
  * Brand: Sportbild | Bundle: PartnerLinks Component Tokens
@@ -19,11 +19,11 @@
      OTHER
      ============================================ */
-  --partner-links-border-color-idle: var(--bild085, #CED4DA);
-  --partner-links-border-color-active: var(--bild015, #232629);
-  --partner-links-bg-color-idle: var(--white100, #FFFFFF);
-  --partner-links-bg-color-active: var(--bild093, #E9ECEF);
-  --partner-links-container-border-color: var(--bild085, #CED4DA);
+  --partner-links-border-color-idle: var(--color-neutral-85, #CED4DA);
+  --partner-links-border-color-active: var(--color-neutral-15, #232629);
+  --partner-links-bg-color-idle: var(--color-neutral-100, #FFFFFF);
+  --partner-links-bg-color-active: var(--color-neutral-93, #E9ECEF);
+  --partner-links-container-border-color: var(--color-neutral-85, #CED4DA);
 }
@@ -34,10 +34,10 @@
      OTHER
      ============================================ */
-  --partner-links-border-color-idle: var(--bild085, #CED4DA);
-  --partner-links-border-color-active: var(--bild093, #E9ECEF);
-  --partner-links-bg-color-idle: var(--bild025, #343C41);
-  --partner-links-bg-color-active: var(--bild060, #8C9196);
-  --partner-links-container-border-color: var(--bild035, #4B525A);
+  --partner-links-border-color-idle: var(--color-neutral-85, #CED4DA);
+  --partner-links-border-color-active: var(--color-neutral-93, #E9ECEF);
+  --partner-links-bg-color-idle: var(--color-neutral-25, #343C41);
+  --partner-links-bg-color-active: var(--color-neutral-60, #8C9196);
+  --partner-links-container-border-color: var(--color-neutral-35, #4B525A);
 }

package/dist/css/sportbild/components/paywall.css CHANGED Viewed

@@ -1,7 +1,7 @@
 /**
  * Do not edit directly, this file was auto-generated.
  *
- * SPORTBILD Design System Tokens v1.0.64
+ * SPORTBILD Design System Tokens v1.0.66
  * Generated by Style Dictionary v4.0.0
  *
  * Brand: Sportbild | Bundle: Paywall Component Tokens
@@ -18,17 +18,17 @@
   .paywall-card-price-tag {
     font-family: var(--font-family-antenna-cond, AntennaCond);
     font-weight: var(--font-weight-black, 800);
-    font-size: var(--size8x, 64px);
-    line-height: var(--size8x, 64px);
-    letter-spacing: var(--letter-space-neg0p5, -0.5px);
+    font-size: var(--size-8-x, 64px);
+    line-height: var(--size-8-x, 64px);
+    letter-spacing: var(--letter-space-neg-0-p-5, -0.5px);
   }
   .paywall-card-note {
     font-family: var(--font-family-antenna-cond, AntennaCond);
     font-weight: var(--font-weight-black, 800);
-    font-size: var(--size5x, 40px);
-    line-height: var(--size5x, 40px);
-    letter-spacing: var(--letter-space-neg0p5, -0.5px);
+    font-size: var(--size-5-x, 40px);
+    line-height: var(--size-5-x, 40px);
+    letter-spacing: var(--letter-space-neg-0-p-5, -0.5px);
   }
 }
@@ -37,10 +37,10 @@
 [data-brand="sportbild"] {
   --paywall-container-gap-space: -48px;
-  --paywall-header-bottom-stack-space: var(--space10x, 80px);
+  --paywall-header-bottom-stack-space: var(--space-10-x, 80px);
   --paywall-card-max-width-size: 346px;
-  --paywall-card-price-tag-font-size: var(--size8x, 64px);
-  --paywall-card-price-tag-line-height: var(--size8x, 64);
-  --paywall-card-price-note-line-height: var(--size5x, 40);
-  --paywall-card-price-note-font-size: var(--size5x, 40px);
+  --paywall-card-price-tag-font-size: var(--size-8-x, 64px);
+  --paywall-card-price-tag-line-height: var(--size-8-x, 64);
+  --paywall-card-price-note-line-height: var(--size-5-x, 40);
+  --paywall-card-price-note-font-size: var(--size-5-x, 40px);
 }

package/dist/css/sportbild/components/quote.css CHANGED Viewed

@@ -1,7 +1,7 @@
 /**
  * Do not edit directly, this file was auto-generated.
  *
- * SPORTBILD Design System Tokens v1.0.64
+ * SPORTBILD Design System Tokens v1.0.66
  * Generated by Style Dictionary v4.0.0
  *
  * Brand: Sportbild | Bundle: Quote Component Tokens
@@ -15,25 +15,22 @@
 /* === BREAKPOINT TOKENS === */
 [data-brand="sportbild"] {
-  --quote-container-inline-space: var(--inline-space-const-lg, 16px);
-  --quote-container-stack-space: var(--stack-space-resp-lg, 16px);
-  --quote-quotation-marks-font-size: var(--size3p5x, 28px);
-  --quote-content-gap-space: var(--gap-space-const-lg, 16px);
+  --quote-container-inline-space: var(--inline-space-const-lg);
+  --quote-container-stack-space: var(--stack-space-resp-lg);
+  --quote-quotation-marks-font-size: var(--size-3-p-5-x, 28px);
+  --quote-content-gap-space: var(--gap-space-const-lg);
 }
 @media (min-width: 600px) {
   [data-brand="sportbild"] {
-    --quote-container-stack-space: var(--stack-space-resp-lg, 24px);
-    --quote-quotation-marks-font-size: var(--size4x, 32px);
-    --quote-content-gap-space: var(--gap-space-const3-xl, 48px);
+    --quote-quotation-marks-font-size: var(--size-4-x, 32px);
+    --quote-content-gap-space: var(--gap-space-const-3-xl);
   }
 }
 @media (min-width: 1024px) {
   [data-brand="sportbild"] {
-    --quote-container-inline-space: var(--space3p5x, 28px);
-    --quote-container-stack-space: var(--stack-space-resp-lg, 32px);
-    --quote-quotation-marks-font-size: var(--size4p5x, 36px);
-    --quote-content-gap-space: var(--gap-space-const3-xl, 48px);
+    --quote-container-inline-space: var(--space-3-p-5-x, 28px);
+    --quote-quotation-marks-font-size: var(--size-4-p-5-x, 36px);
   }
 }

package/dist/css/sportbild/components/radiobutton.css CHANGED Viewed

@@ -1,7 +1,7 @@
 /**
  * Do not edit directly, this file was auto-generated.
  *
- * SPORTBILD Design System Tokens v1.0.64
+ * SPORTBILD Design System Tokens v1.0.66
  * Generated by Style Dictionary v4.0.0
  *
  * Brand: Sportbild | Bundle: RadioButton Component Tokens
@@ -15,6 +15,6 @@
 /* === BREAKPOINT TOKENS === */
 [data-brand="sportbild"] {
-  --radio-selector-size: var(--size2p5x, 20px);
-  --radio-selector-dot-active-size: var(--size1p5x, 12px);
+  --radio-selector-size: var(--size-2-p-5-x, 20px);
+  --radio-selector-dot-active-size: var(--size-1-p-5-x, 12px);
 }

package/dist/css/sportbild/components/search.css CHANGED Viewed

@@ -1,7 +1,7 @@
 /**
  * Do not edit directly, this file was auto-generated.
  *
- * SPORTBILD Design System Tokens v1.0.64
+ * SPORTBILD Design System Tokens v1.0.66
  * Generated by Style Dictionary v4.0.0
  *
  * Brand: Sportbild | Bundle: Search Component Tokens
@@ -15,5 +15,5 @@
 /* === BREAKPOINT TOKENS === */
 [data-brand="sportbild"] {
-  --search-result-badge-height-size: var(--size2p25x, 18px);
+  --search-result-badge-height-size: var(--size-2-p-25-x, 18px);
 }

package/dist/css/sportbild/components/sectiontitle.css CHANGED Viewed

@@ -1,7 +1,7 @@
 /**
  * Do not edit directly, this file was auto-generated.
  *
- * SPORTBILD Design System Tokens v1.0.64
+ * SPORTBILD Design System Tokens v1.0.66
  * Generated by Style Dictionary v4.0.0
  *
  * Brand: Sportbild | Bundle: SectionTitle Component Tokens
@@ -15,15 +15,15 @@
 /* === BREAKPOINT TOKENS === */
 [data-brand="sportbild"] {
-  --section-title-inner-stack-bottom-space: var(--space1p5x, 12px);
-  --section-title-height-size: var(--size4x, 32px);
+  --section-title-inner-stack-bottom-space: var(--space-1-p-5-x, 12px);
+  --section-title-height-size: var(--size-4-x, 32px);
   --section-title-arrow-inline-space: 5px;
   --section-title-arrow-inline-space-active: 5px;
 }
 @media (min-width: 1024px) {
   [data-brand="sportbild"] {
-    --section-title-height-size: var(--size5x, 40px);
+    --section-title-height-size: var(--size-5-x, 40px);
     --section-title-arrow-inline-space-active: 8px;
   }
 }

package/dist/css/sportbild/components/selection.css CHANGED Viewed

@@ -1,7 +1,7 @@
 /**
  * Do not edit directly, this file was auto-generated.
  *
- * SPORTBILD Design System Tokens v1.0.64
+ * SPORTBILD Design System Tokens v1.0.66
  * Generated by Style Dictionary v4.0.0
  *
  * Brand: Sportbild | Bundle: Selection Component Tokens
@@ -19,7 +19,7 @@
      OTHER
      ============================================ */
-  --selection-border-color: var(--bild035, #4B525A);
+  --selection-border-color: var(--color-neutral-35, #4B525A);
 }
@@ -30,6 +30,6 @@
      OTHER
      ============================================ */
-  --selection-border-color: var(--bild060, #8C9196);
+  --selection-border-color: var(--color-neutral-60, #8C9196);
 }

package/dist/css/sportbild/components/separator.css CHANGED Viewed

@@ -1,7 +1,7 @@
 /**
  * Do not edit directly, this file was auto-generated.
  *
- * SPORTBILD Design System Tokens v1.0.64
+ * SPORTBILD Design System Tokens v1.0.66
  * Generated by Style Dictionary v4.0.0
  *
  * Brand: Sportbild | Bundle: Separator Component Tokens
@@ -15,5 +15,5 @@
 /* === BREAKPOINT TOKENS === */
 [data-brand="sportbild"] {
-  --separator-thickness-size: var(--border-width-thick, 2px);
+  --separator-thickness-size: var(--border-width-thick);
 }

package/dist/css/sportbild/components/skeletons.css CHANGED Viewed

@@ -1,7 +1,7 @@
 /**
  * Do not edit directly, this file was auto-generated.
  *
- * SPORTBILD Design System Tokens v1.0.64
+ * SPORTBILD Design System Tokens v1.0.66
  * Generated by Style Dictionary v4.0.0
  *
  * Brand: Sportbild | Bundle: Skeletons Component Tokens
@@ -16,25 +16,16 @@
 [data-brand="sportbild"] {
   --headlines-skeleton-image-placeholder-max-width: 282px;
-  --article-skeleton-image-inline-space: var(--grid-space-resp-base, 12px);
+  --article-skeleton-image-inline-space: var(--grid-space-resp-base);
   --article-skeleton-text-inline-space: 0px;
   --article-text-skeleton-height-size: 270px;
 }
 @media (min-width: 600px) {
   [data-brand="sportbild"] {
-    --headlines-skeleton-image-placeholder-max-width: var(--size20x, 160px);
-    --article-skeleton-image-inline-space: var(--space6x, 48px);
-    --article-skeleton-text-inline-space: var(--space6x, 48px);
-    --article-text-skeleton-height-size: 720px;
-  }
-}
-@media (min-width: 1024px) {
-  [data-brand="sportbild"] {
-    --headlines-skeleton-image-placeholder-max-width: var(--size20x, 160px);
-    --article-skeleton-image-inline-space: var(--space6x, 48px);
-    --article-skeleton-text-inline-space: var(--space6x, 48px);
+    --headlines-skeleton-image-placeholder-max-width: var(--size-20-x, 160px);
+    --article-skeleton-image-inline-space: var(--space-6-x, 48px);
+    --article-skeleton-text-inline-space: var(--space-6-x, 48px);
     --article-text-skeleton-height-size: 720px;
   }
 }

package/dist/css/sportbild/components/slider.css CHANGED Viewed

@@ -1,7 +1,7 @@
 /**
  * Do not edit directly, this file was auto-generated.
  *
- * SPORTBILD Design System Tokens v1.0.64
+ * SPORTBILD Design System Tokens v1.0.66
  * Generated by Style Dictionary v4.0.0
  *
  * Brand: Sportbild | Bundle: Slider Component Tokens
@@ -15,32 +15,26 @@
 /* === COLOR TOKENS (LIGHT MODE) === */
 [data-brand="sportbild"][data-theme="light"] {
-  /* ============================================
-     OTHER
-     ============================================ */
-  --slider-button-opacity: var(--layer-opacity90, 0.9);
-  --slider-track-bg-color: var(--white-alpha35, rgba(255, 255, 255, 0.35));
+  --slider-track-bg-color: var(--alpha-white-35, rgba(255, 255, 255, 0.35));
 }
 /* === COLOR TOKENS (DARK MODE) === */
 [data-brand="sportbild"][data-theme="dark"] {
-  /* ============================================
-     OTHER
-     ============================================ */
+  --slider-track-bg-color: var(--alpha-white-35, rgba(255, 255, 255, 0.35));
+}
-  --slider-button-opacity: var(--layer-opacity90, 0.9);
-  --slider-track-bg-color: var(--white-alpha35, rgba(255, 255, 255, 0.35));
+/* === BREAKPOINT TOKENS === */
+[data-brand="sportbild"] {
+  --slider-progress-bar-idle-height-size: var(--size-0-p-5-x, 4px);
+  --slider-progress-bar-hover-height-size: var(--size-1-x, 8px);
+  --slider-progress-inactive-height-size: var(--size-0-p-25-x, 2px);
+  --vid-player-progress-bar-height-size: var(--size-1-p-5-x, 12px);
 }
-/* === BREAKPOINT TOKENS === */
+/* === OTHER TOKENS === */
 [data-brand="sportbild"] {
-  --slider-progress-bar-idle-height-size: var(--size0-5x, 4px);
-  --slider-progress-bar-hover-height-size: var(--size1x, 8px);
-  --slider-progress-inactive-height-size: var(--size0p25x, 2px);
-  --vid-player-progress-bar-height-size: var(--size1p5x, 12px);
+  --slider-button-opacity: var(--layer-opacity-90);
 }

package/dist/css/sportbild/components/socialsharebutton.css CHANGED Viewed

@@ -1,7 +1,7 @@
 /**
  * Do not edit directly, this file was auto-generated.
  *
- * SPORTBILD Design System Tokens v1.0.64
+ * SPORTBILD Design System Tokens v1.0.66
  * Generated by Style Dictionary v4.0.0
  *
  * Brand: Sportbild | Bundle: SocialShareButton Component Tokens
@@ -19,10 +19,10 @@
      OTHER
      ============================================ */
-  --social-share-button-label-color-default: var(--white100, #FFFFFF);
-  --social-share-button-label-color-active: var(--white100, #FFFFFF);
-  --social-share-button-bg-color-active: var(--bild025, #343C41);
-  --social-share-button-bg-color-default: var(--bild035, #4B525A);
+  --social-share-button-label-color-default: var(--color-neutral-100, #FFFFFF);
+  --social-share-button-label-color-active: var(--color-neutral-100, #FFFFFF);
+  --social-share-button-bg-color-active: var(--color-neutral-25, #343C41);
+  --social-share-button-bg-color-default: var(--color-neutral-35, #4B525A);
 }
@@ -33,9 +33,9 @@
      OTHER
      ============================================ */
-  --social-share-button-label-color-default: var(--white100, #FFFFFF);
-  --social-share-button-label-color-active: var(--white100, #FFFFFF);
-  --social-share-button-bg-color-active: var(--bild025, #343C41);
-  --social-share-button-bg-color-default: var(--bild035, #4B525A);
+  --social-share-button-label-color-default: var(--color-neutral-100, #FFFFFF);
+  --social-share-button-label-color-active: var(--color-neutral-100, #FFFFFF);
+  --social-share-button-bg-color-active: var(--color-neutral-25, #343C41);
+  --social-share-button-bg-color-default: var(--color-neutral-35, #4B525A);
 }

package/dist/css/sportbild/components/specialnavi.css CHANGED Viewed

@@ -1,7 +1,7 @@
 /**
  * Do not edit directly, this file was auto-generated.
  *
- * SPORTBILD Design System Tokens v1.0.64
+ * SPORTBILD Design System Tokens v1.0.66
  * Generated by Style Dictionary v4.0.0
  *
  * Brand: Sportbild | Bundle: SpecialNavi Component Tokens
@@ -18,8 +18,8 @@
   .special-navi-item-label {
     font-family: var(--font-family-antenna-extra-cond, AntennaExtraCond);
     font-weight: 700;
-    font-size: var(--size2p25x, 18px);
-    line-height: var(--size2p25x, 18px);
+    font-size: var(--size-2-p-25-x, 18px);
+    line-height: var(--size-2-p-25-x, 18px);
     font-style: italic;
   }
@@ -28,11 +28,11 @@
 /* === BREAKPOINT TOKENS === */
 [data-brand="sportbild"] {
-  --special-navi-inline-space: var(--space3x, 24px);
+  --special-navi-inline-space: var(--space-3-x, 24px);
 }
 @media (min-width: 1024px) {
   [data-brand="sportbild"] {
-    --special-navi-inline-space: var(--space4x, 32px);
+    --special-navi-inline-space: var(--space-4-x, 32px);
   }
 }