@marioschmidt/design-system-tokens 1.0.19 → 1.0.21

package/dist/scss/shared/colorprimitive.scss

@@ -1,97 +1,160 @@
+//
+// colorprimitive.scss
+// Generiert am: 2025-11-24T20:34:53.372Z
+// Nicht manuell bearbeiten!
+//
+
+// ============================================
+// BILD
+// ============================================
+
+// BILD - alpha
+$alpha-black20: rgba(0, 0, 0, 0.20000000298023224);
+$alpha-black10: rgba(0, 0, 0, 0.10000000149011612);
+// Used on elevation effects.
+$alpha-black60: rgba(0, 0, 0, 0.6000000238418579);
+$alpha-black30: rgba(0, 0, 0, 0.30000001192092896);
+// Used on elevation effects.
+$alpha-black70: rgba(0, 0, 0, 0.699999988079071);
+$alpha-white10: rgba(255, 255, 255, 0.10000000149011612);
+$alpha-white20: rgba(255, 255, 255, 0.20000000298023224);
+$alpha-white30: rgba(255, 255, 255, 0.30000001192092896);
+// Used on elevation effects.
+$alpha-white60: rgba(255, 255, 255, 0.6000000238418579);
+// Used on elevation effects.
+$alpha-white70: rgba(255, 255, 255, 0.699999988079071);
+$alpha-white35: rgba(255, 255, 255, 0.3499999940395355);
+// Used on elevation effects.
+$alpha-bildred80: rgba(221, 0, 0, 0.800000011920929);
+// Used on elevation effects.
+$alpha-black80: rgba(0, 0, 0, 0.800000011920929);
+// Used on elevation effects.
+$alpha-white80: rgba(255, 255, 255, 0.800000011920929);
+$alpha-black35: rgba(0, 0, 0, 0.3499999940395355);
+$alpha-black0: rgba(0, 0, 0, 0);
+$alpha-black50: rgba(0, 0, 0, 0.5);
+$alpha-black05: rgba(0, 0, 0, 0.05000000074505806);
+
+// BILD - blue
+// This Blue color was taken from the Weather 2024 project. Tone: 069
+$bildblue: #00B1FF;
+
+// BILD - gray
+$bild015: #232629;
+$bild085: #CED4DA;
+$bild035: #4B525A;
+$bild025: #343C41;
+$bild060: #8C9196;
+$bild096: #F2F4F5;
+$bild093: #E9ECEF;
+// The 50% opacity on this color makes it equivalent to BILD093.
+$bild085-50: rgba(206, 212, 218, 0.5);
+$bild073: #AEB4B9;
+$bild045: #666B70;
+$bild010: #1C1C1C;
+$bild020: #2C3138;
+
+// BILD - green
+$bildgreen070: #00C373;
+$bildgreen063: #00AF67;
+$bildgreen093: #CEF4E4;
+$bildgreen093-50: rgba(206, 244, 228, 0.5);
+$bildgreen056-50: rgba(0, 155, 90, 0.5);
+// This value of green was found in a text field's text color.
+$bildgreen040: #006E3E;
+$bildgreen056: #18995C;
+
+// BILD - neutral
+$bild100: #FFFFFF;
+$bildblack: #000000;
+
+// BILD - orange
+// Tone: 067
+$bildorange: #FD8227;
+
+// BILD - purple
+// Tone: 020
+$bildberry: #551937;
+
+// BILD - red
+// Tone 046
+$bildred: #DD0000;
+$bildred035: #AF0002;
+$bildred053: #F52D2D;
+
+// BILD - yellow
+// Tone: 081
+$bildyellow: #FFBF00;
+
+
+// ============================================
+// OPACITY
+// ============================================
+
+$opacity05: 5px;
+$opacity10: 10px;
+$opacity20: 20px;
+$opacity40: 40px;
+$opacity60: 60px;
+$opacity80: 80px;
+$opacity100: 100px;
+$opacity90: 90px;
+$opacity30: 30px;
+$opacity50: 50px;
+$opacity00: 0px;
+$opacity70: 70px;
+
+
+// ============================================
+// PARTNER
+// ============================================
+
+// Partner - Aubi
+$aubi-core: #F00000;
+
+// Partner - Bz
+$bz-core: #E3001B;
+
+// Partner - ComputerBILD
+$cobi-core: #DC231C;
+
+// Partner - Fitbook
+$fitbook-core: #FF97B7;
+
+// Partner - Kaufberater
+$kaufberater-core: #55476E;
+
+// Partner - MyHome
+$myhome-core: #66CCCC;
+
+// Partner - Petbook
+$petbook-core: #B9DB91;
+
+// Partner - Techbook
+$techbook-core: #93E4FF;
+
+// Partner - Travelbook
+$travelbook-core: #8EF0ED;
+
+
+// ============================================
+// SPORTBILD
+// ============================================
+
+// SportBILD - alpha
+$spobi-blue016-0: rgba(10, 39, 80, 0);
+$spobi-blue016-70: rgba(10, 39, 80, 0.699999988079071);
+
+// SportBILD - blue
+$spobi-blue098: #F7F9FD;
+$spobi-blue081: #BDCADB;
+// This variable in the current online CSS is called secondary-tenant-color
+$spobi-blue029: #174482;
+// This variable in the current online CSS is called main-tenant-color for the spobi tenant.
+$spobi-blue016: #0A2750;
+$spobi-blue010: #081828;
+$spobi-blue038: #315998;
+
+// SportBILD - red
+$spobi-red: #E52528;
 
-// Do not edit directly, this file was auto-generated.
-
-$bild-red-bild-red: #DD0000; // Tone 046
-$bild-red-bild-red035: #AF0002;
-$bild-red-bild-red053: #F52D2D;
-$bild-gray-bild015: #232629;
-$bild-gray-bild085: #CED4DA;
-$bild-gray-bild035: #4B525A;
-$bild-gray-bild025: #343C41;
-$bild-gray-bild060: #8C9196;
-$bild-gray-bild096: #F2F4F5;
-$bild-gray-bild093: #E9ECEF;
-$bild-gray-bild085-50: rgba(206, 212, 218, 0.5); // The 50% opacity on this color makes it equivalent to BILD093.
-$bild-gray-bild073: #AEB4B9;
-$bild-gray-bild045: #666B70;
-$bild-gray-bild010: #1C1C1C;
-$bild-gray-bild020: #2C3138;
-$bild-neutral-bild100: #FFFFFF;
-$bild-neutral-bild-black: #000000;
-$bild-orange-bild-orange: #FD8227; // Tone: 067
-$bild-green-bild-green070: #00C373;
-$bild-green-bild-green063: #00AF67;
-$bild-green-bild-green093: #CEF4E4;
-$bild-green-bild-green093-50: rgba(206, 244, 228, 0.5);
-$bild-green-bild-green056-50: rgba(0, 155, 90, 0.5);
-$bild-green-bild-green040: #006E3E; // This value of green was found in a text field's text color.
-$bild-green-bild-green056: #18995C;
-$bild-text-labels-bild-red: BILDRed; // This is a variable used only for documentation purposes in the design system Figma Foundations pages.
-$bild-text-labels-bild100: BILD100; // This is a variable used only for documentation purposes in the design system Figma Foundations pages.
-$bild-text-labels-bild096: BILD096; // This is a variable used only for documentation purposes in the design system Figma Foundations pages.
-$bild-text-labels-bild085: BILD085; // This is a variable used only for documentation purposes in the design system Figma Foundations pages.
-$bild-text-labels-bild060: BILD060; // This is a variable used only for documentation purposes in the design system Figma Foundations pages.
-$bild-text-labels-bild035: BILD035; // This is a variable used only for documentation purposes in the design system Figma Foundations pages.
-$bild-text-labels-bild025: BILD025; // This is a variable used only for documentation purposes in the design system Figma Foundations pages.
-$bild-text-labels-bild015: BILD015; // This is a variable used only for documentation purposes in the design system Figma Foundations pages.
-$bild-text-labels-bild-orange: BILDOrange; // This is a variable used only for documentation purposes in the design system Figma Foundations pages.
-$bild-text-labels-bild-red053: BILDRed053; // This is a variable used only for documentation purposes in the design system Figma Foundations pages.
-$bild-text-labels-bild-red035: BILDRed035; // This is a variable used only for documentation purposes in the design system Figma Foundations pages.
-$bild-text-labels-bild-green093: BILDGreen093; // This is a variable used only for documentation purposes in the design system Figma Foundations pages.
-$bild-text-labels-bild-green070: BILDGreen070; // This is a variable used only for documentation purposes in the design system Figma Foundations pages.
-$bild-text-labels-bild-green063: BILDGreen063; // This is a variable used only for documentation purposes in the design system Figma Foundations pages.
-$bild-text-labels-bild093: BILD093; // This is a variable used only for documentation purposes in the design system Figma Foundations pages.
-$bild-text-labels-bild-yellow: BILDYellow; // This is a variable used only for documentation purposes in the design system Figma Foundations pages.
-$bild-text-labels-bild073: BILD073; // This is a variable used only for documentation purposes in the design system Figma Foundations pages.
-$bild-text-labels-bild045: BILD045; // This is a variable used only for documentation purposes in the design system Figma Foundations pages.
-$bild-yellow-bild-yellow: #FFBF00; // Tone: 081
-$bild-purple-bild-berry: #551937; // Tone: 020
-$bild-alpha-alpha-black20: rgba(0, 0, 0, 0.20000000298023224);
-$bild-alpha-alpha-black10: rgba(0, 0, 0, 0.10000000149011612);
-$bild-alpha-alpha-black60: rgba(0, 0, 0, 0.6000000238418579); // Used on elevation effects.
-$bild-alpha-alpha-black30: rgba(0, 0, 0, 0.30000001192092896);
-$bild-alpha-alpha-black70: rgba(0, 0, 0, 0.699999988079071); // Used on elevation effects.
-$bild-alpha-alpha-white10: rgba(255, 255, 255, 0.10000000149011612);
-$bild-alpha-alpha-white20: rgba(255, 255, 255, 0.20000000298023224);
-$bild-alpha-alpha-white30: rgba(255, 255, 255, 0.30000001192092896);
-$bild-alpha-alpha-white60: rgba(255, 255, 255, 0.6000000238418579); // Used on elevation effects.
-$bild-alpha-alpha-white70: rgba(255, 255, 255, 0.699999988079071); // Used on elevation effects.
-$bild-alpha-alpha-white35: rgba(255, 255, 255, 0.3499999940395355);
-$bild-alpha-alpha-bild-red80: rgba(221, 0, 0, 0.800000011920929); // Used on elevation effects.
-$bild-alpha-alpha-black80: rgba(0, 0, 0, 0.800000011920929); // Used on elevation effects.
-$bild-alpha-alpha-white80: rgba(255, 255, 255, 0.800000011920929); // Used on elevation effects.
-$bild-alpha-alpha-black35: rgba(0, 0, 0, 0.3499999940395355);
-$bild-alpha-alpha-black0: rgba(0, 0, 0, 0);
-$bild-alpha-alpha-black50: rgba(0, 0, 0, 0.5);
-$bild-alpha-alpha-black05: rgba(0, 0, 0, 0.05000000074505806);
-$bild-blue-bild-blue: #00B1FF; // This Blue color was taken from the Weather 2024 project. Tone: 069
-$partner-fitbook-fitbook-core: #FF97B7;
-$partner-petbook-petbook-core: #B9DB91;
-$partner-my-home-myhome-core: #66CCCC;
-$partner-travelbook-travelbook-core: #8EF0ED;
-$partner-techbook-techbook-core: #93E4FF;
-$partner-kaufberater-kaufberater-core: #55476E;
-$partner-bz-bz-core: #E3001B;
-$partner-aubi-aubi-core: #F00000;
-$partner-computer-bild-cobi-core: #DC231C;
-$sport-bild-blue-spobi-blue098: #F7F9FD;
-$sport-bild-blue-spobi-blue081: #BDCADB;
-$sport-bild-blue-spobi-blue029: #174482; // This variable in the current online CSS is called secondary-tenant-color
-$sport-bild-blue-spobi-blue016: #0A2750; // This variable in the current online CSS is called main-tenant-color for the spobi tenant.
-$sport-bild-blue-spobi-blue010: #081828;
-$sport-bild-blue-spobi-blue038: #315998;
-$sport-bild-red-spobi-red: #E52528;
-$sport-bild-alpha-spobi-blue016-0: rgba(10, 39, 80, 0);
-$sport-bild-alpha-spobi-blue016-70: rgba(10, 39, 80, 0.699999988079071);
-$opacity-opacity05: 5px;
-$opacity-opacity10: 10px;
-$opacity-opacity20: 20px;
-$opacity-opacity40: 40px;
-$opacity-opacity60: 60px;
-$opacity-opacity80: 80px;
-$opacity-opacity100: 100px;
-$opacity-opacity90: 90px;
-$opacity-opacity30: 30px;
-$opacity-opacity50: 50px;
-$opacity-opacity00: 0px;
-$opacity-opacity70: 70px;

package/dist/scss/shared/fontprimitive.scss

@@ -1,14 +1,33 @@
+//
+// fontprimitive.scss
+// Generiert am: 2025-11-24T20:34:53.452Z
+// Nicht manuell bearbeiten!
+//
 
-// Do not edit directly, this file was auto-generated.
+// ============================================
+// FONTFAMILY
+// ============================================
 
-$font-family-bild-font-family-gotham-x-narrow: Gotham XNarrow;
-$font-family-bild-font-family-gotham-cond: Gotham Condensed;
-$font-family-bild-font-family-gotham: Gotham;
-$font-family-advertorial-font-family-lucida-grande: Lucida Grande;
-$font-family-sport-bild-font-family-antenna-extra-cond: AntennaExtraCond;
-$font-family-sport-bild-font-family-antenna-cond: AntennaCond;
-$font-family-sport-bild-font-family-inter: Inter;
-$font-weight-700-black-font-weight: 700; // 700 is considered black weight because Gotham Condensed is the primary font family (most used in headlines). In other font families 700 is not black weight but bold.
+// FontFamily - Advertorial
+$font-family-lucida-grande: Lucida Grande;
+
+// FontFamily - BILD
+$font-family-gotham-xnarrow: Gotham XNarrow;
+$font-family-gotham-cond: Gotham Condensed;
+$font-family-gotham: Gotham;
+
+// FontFamily - SportBILD
+$font-family-antenna-extra-cond: AntennaExtraCond;
+$font-family-antenna-cond: AntennaCond;
+$font-family-inter: Inter;
+
+
+// ============================================
+// FONTWEIGHT
+// ============================================
+
+// 700 is considered black weight because Gotham Condensed is the primary font family (most used in headlines). In other font families 700 is not black weight but bold.
+$font-weight-700-black-font-weight: 700;
 $font-weight-900-extra-black-font-weight: 900;
 $font-weight-400-book-font-weight: 400;
 $font-weight-1000-ultra-font-weight: 1000;
@@ -16,22 +35,17 @@ $font-weight-800-black-font-weight: 800;
 $font-weight-350-book-font-weight: 350;
 $font-weight-600-bold-font-weight: 600;
 $font-weight-100-thin-font-weight: 100;
-$font-weight-300-light-font-weight: 300;
+$300-light-font-weight: 300;
 $font-weight-200-extra-light-font-weight: 200;
 $font-weight-500-medium-font-weight: 500;
-$font-weight-bold-italic-font-weight-st: Bold Italic;
-$font-weight-black-font-weight-st: Black;
-$letter-spacing-letter-space-0-25: -0.25px; // This variable is a primitive for use in creating semantic text styles that need to use a subtle small letter spacing value of -0.25.
-$letter-spacing-letter-space-0: 0px; // This variable is a primitive for use in creating semantic text styles that need to use a default letter spacing value of 0.
-$letter-spacing-letter-space1: 1px; // This variable is a primitive for use in creating semantic text styles that need to use a positive letter spacing value of 1.
-$letter-spacing-letter-space0-5: 0.5px; // This variable is a primitive for use in creating semantic text styles that need to use a slight positive letter spacing value of 0.5.
-$letter-spacing-letter-space0-25: 0.25px; // This variable is a primitive for use in creating semantic text styles that need to use a subtle positive letter spacing value of 0.25.
-$letter-spacing-letter-space-0-5: -0.5px; // This variable is a primitive for use in creating semantic variables that need to use a subtle negative letter spacing value of -0.5.
-$letter-spacing-letter-space2: 2px; // This variable is a primitive for use in creating semantic text styles that need to use a large letter spacing value of 2.
-$letter-spacing-letter-space-1: -1px; // This variable is a primitive for use in creating semantic variables that need to use a negative letter spacing value of -1.
-$letter-spacing-letter-space-2: -2px; // This variable is a primitive for use in creating semantic text styles that need to use a large negative letter spacing value of -2. This is usually reserved for large texts styles that are used on titles or headlines.
-$letter-spacing-letter-space3: 3px; // This variable is a primitive for use in creating semantic text styles that need to use a much larger letter spacing value of 3. Text styles that have smaller font sizes should use increasingly positive values for their letter spacings on smaller device sizes.
-$letter-spacing-letter-space-3: -3px; // This variable is a primitive for use in creating semantic text styles that need to use a large negative letter spacing value of -3. Text styles that have larger font sizes should use increasingly negative values for their letter spacings on larger device sizes.
+$bold-italic-font-weight-st: Bold Italic;
+$black-font-weight-st: Black;
+
+
+// ============================================
+// FONTWEIGHTSTRING
+// ============================================
+
 $font-weight-string-1000-ultra-font-weight: 1000;
 $font-weight-string-900-extra-black-font-weight: 900;
 $font-weight-string-800-black-font-weight: 800;
@@ -42,5 +56,34 @@ $font-weight-string-400-book-font-weight: 400;
 $font-weight-string-350-book-font-weight: 350;
 $font-weight-string-200-extra-light-font-weight: 200;
 $font-weight-string-100-thin-font-weight: 100;
-$font-weight-string-600-bold-italic-font-weight: Bold Italic;
-$font-weight-string-700-black-italic-font-weight: Black Italic;
+$600-bold-italic-font-weight: Bold Italic;
+$700-black-italic-font-weight: Black Italic;
+
+
+// ============================================
+// LETTERSPACING
+// ============================================
+
+// This variable is a primitive for use in creating semantic text styles that need to use a subtle small letter spacing value of -0.25.
+$letter-space-0-25: -0.25px;
+// This variable is a primitive for use in creating semantic text styles that need to use a default letter spacing value of 0.
+$letter-space-0: 0px;
+// This variable is a primitive for use in creating semantic text styles that need to use a positive letter spacing value of 1.
+$letter-space1: 1px;
+// This variable is a primitive for use in creating semantic text styles that need to use a slight positive letter spacing value of 0.5.
+$letter-space0-5: 0.5px;
+// This variable is a primitive for use in creating semantic text styles that need to use a subtle positive letter spacing value of 0.25.
+$letter-space0-25: 0.25px;
+// This variable is a primitive for use in creating semantic variables that need to use a subtle negative letter spacing value of -0.5.
+$letter-space-0-5: -0.5px;
+// This variable is a primitive for use in creating semantic text styles that need to use a large letter spacing value of 2.
+$letter-space2: 2px;
+// This variable is a primitive for use in creating semantic variables that need to use a negative letter spacing value of -1.
+$letter-space-1: -1px;
+// This variable is a primitive for use in creating semantic text styles that need to use a large negative letter spacing value of -2. This is usually reserved for large texts styles that are used on titles or headlines.
+$letter-space-2: -2px;
+// This variable is a primitive for use in creating semantic text styles that need to use a much larger letter spacing value of 3. Text styles that have smaller font sizes should use increasingly positive values for their letter spacings on smaller device sizes.
+$letter-space3: 3px;
+// This variable is a primitive for use in creating semantic text styles that need to use a large negative letter spacing value of -3. Text styles that have larger font sizes should use increasingly negative values for their letter spacings on larger device sizes.
+$letter-space-3: -3px;
+

package/dist/scss/shared/sizeprimitive.scss

@@ -1,5 +1,12 @@
+//
+// sizeprimitive.scss
+// Generiert am: 2025-11-24T20:34:53.511Z
+// Nicht manuell bearbeiten!
+//
 
-// Do not edit directly, this file was auto-generated.
+// ============================================
+// OTHER
+// ============================================
 
 $size6x: 48px;
 $size3x: 24px;
@@ -50,3 +57,4 @@ $size18-5x: 148px;
 $size100x: 800px;
 $size0x: 0px;
 $size0-125x: 1px;
+

package/dist/scss/shared/spaceprimitive.scss

@@ -1,5 +1,12 @@
+//
+// spaceprimitive.scss
+// Generiert am: 2025-11-24T20:34:53.559Z
+// Nicht manuell bearbeiten!
+//
 
-// Do not edit directly, this file was auto-generated.
+// ============================================
+// OTHER
+// ============================================
 
 $space1x: 8px;
 $space0-5x: 4px;
@@ -26,3 +33,4 @@ $space12x: 96px;
 $space1-75x: 14px;
 $space8-5x: 68px;
 $space3-5x: 28px;
+

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@marioschmidt/design-system-tokens",
-  "version": "1.0.19",
+  "version": "1.0.21",
   "description": "BILD Design System Token Pipeline with Style Dictionary - Multi-brand design tokens for BILD, SportBILD, and Advertorial",
   "main": "dist/index.js",
   "module": "dist/index.mjs",