Skip to content
This repository has been archived by the owner on Aug 15, 2023. It is now read-only.

Design tokens updated #3

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
125 changes: 4 additions & 121 deletions build/css/_variables.css
Original file line number Diff line number Diff line change
@@ -1,123 +1,6 @@
:root {
--sizes-32: 32.72px;
--sizes-40: 40px;
--sizes-60: 60px;
--sizes-80: 80px;
--sizes-plain-token: 200px;
--sizes-token-in-frame: 200px;
--sizes-token-in-group: 200px;
--sizes-in-variant-60: 60px;
--sizes-in-variant-90: 90px;
--sizes-in-variant-120: 120px;
--sizes-frame: 32px;
--sizes-rect: 32px;
--sizes-shape-in-component: 32px;
--breakpoints-lg: 1280px;
--breakpoints-sm: 768px;
--breakpoints-md: 1024px;
--spacing-10: 10px;
--spacing-mixed: 10px 20px 30px 20px;
--spacing-top: 10px 0px 0px 0px;
--radius-5: 5px;
--radii-smoothing: 10px;
--radii-mixed: 5.5px 10px 20px 15px;
--gradient-gradient-single-with-multiple-color-stops: radial-gradient(rgb(255, 184, 0) 0%, rgb(255, 138, 0) 34%, rgb(255, 46, 0) 65%, rgb(255, 0, 0) 100%);
--gradient-gradient-multiplegrad-0: linear-gradient(180deg, rgb(255, 184, 0) 0%, rgba(255, 184, 0, 0) 100%);
--gradient-gradient-multiplegrad-1: radial-gradient(rgb(255, 255, 255) 0%, rgba(255, 255, 255, 0) 100%);
--gradient-gradient-multiplegrad-2: undefined;
--gradient-gradient-multiplegrad-3: undefined;
--color-colors-semi-red: rgba(255, 95, 4, 0.5);
--color-colors-multiple-fills-0: rgb(64, 255, 186);
--color-colors-multiple-fills-1: rgba(0, 0, 0, 0.1);
--color-colors-single-blue: rgb(4, 74, 255);
--color-colors-ref-blue: rgb(4, 74, 255);
--color-colors-empty: rgba(0, 0, 0, 0);
--color-colors-special-characters: rgb(64, 223, 80);
--color-colors-special-characters-nderung: rgb(52, 86, 175);
--font-body-variable-font: italic 500 16/19.2 Roboto;
--font-body-h3: condensed 700 20/32 Akzidenz-Grotesk Pro;
--font-body-h4-strike-through: italic 500 16/19.2 Roboto;
--font-body-italic: italic 400 12/14 Roboto;
--font-body-extra-bold-condensed-italic: condensed italic 800 12/14.4 Akzidenz-Grotesk Pro;
--font-body-medium-extended-italic: expanded italic 500 20/24 Akzidenz-Grotesk Pro;
--font-body-super: 900 22/26.4 Akzidenz-Grotesk Pro;
--effect-drop-shadow-single: 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
--effect-inner-shadow-multiple-0: inset 0px 4px 4px 0px rgba(0, 0, 0, 0.25);
--effect-inner-shadow-multiple-1: inset 10px 100px 1px 0.5px rgb(0, 0, 0);
--effect-inner-shadow-multiple-2: inset -4px 2px 3px 11px rgba(0, 0, 0, 0.25);
--typography-body-variable-font-font-size: 16px;
--typography-body-variable-font-text-decoration: line-through;
--typography-body-variable-font-font-family: Roboto;
--typography-body-variable-font-font-weight: 500;
--typography-body-variable-font-font-style: italic;
--typography-body-variable-font-font-stretch: normal;
--typography-body-variable-font-letter-spacing: 0;
--typography-body-variable-font-line-height: 19.2px;
--typography-body-variable-font-paragraph-indent: 0;
--typography-body-variable-font-paragraph-spacing: 0;
--typography-body-h3-font-size: 20px;
--typography-body-h3-text-decoration: none;
--typography-body-h3-font-family: Akzidenz-Grotesk Pro;
--typography-body-h3-font-weight: 700;
--typography-body-h3-font-style: normal;
--typography-body-h3-font-stretch: condensed;
--typography-body-h3-letter-spacing: 0.4px;
--typography-body-h3-line-height: 32px;
--typography-body-h3-paragraph-indent: 5px;
--typography-body-h3-paragraph-spacing: 8px;
--typography-body-h3-text-case: uppercase;
--typography-body-h4-strike-through-font-size: 16px;
--typography-body-h4-strike-through-text-decoration: line-through;
--typography-body-h4-strike-through-font-family: Roboto;
--typography-body-h4-strike-through-font-weight: 500;
--typography-body-h4-strike-through-font-style: italic;
--typography-body-h4-strike-through-font-stretch: normal;
--typography-body-h4-strike-through-letter-spacing: 0;
--typography-body-h4-strike-through-line-height: 19.2px;
--typography-body-h4-strike-through-paragraph-indent: 0;
--typography-body-h4-strike-through-paragraph-spacing: 0;
--typography-body-italic-font-size: 12px;
--typography-body-italic-text-decoration: none;
--typography-body-italic-font-family: Roboto;
--typography-body-italic-font-weight: 400;
--typography-body-italic-font-style: italic;
--typography-body-italic-font-stretch: normal;
--typography-body-italic-letter-spacing: 0;
--typography-body-italic-line-height: 14px;
--typography-body-italic-paragraph-indent: 0;
--typography-body-italic-paragraph-spacing: 0;
--typography-body-italic-text-case: none;
--typography-body-extra-bold-condensed-italic-font-size: 12px;
--typography-body-extra-bold-condensed-italic-text-decoration: none;
--typography-body-extra-bold-condensed-italic-font-family: Akzidenz-Grotesk Pro;
--typography-body-extra-bold-condensed-italic-font-weight: 800;
--typography-body-extra-bold-condensed-italic-font-style: italic;
--typography-body-extra-bold-condensed-italic-font-stretch: condensed;
--typography-body-extra-bold-condensed-italic-letter-spacing: 0;
--typography-body-extra-bold-condensed-italic-line-height: 14.4px;
--typography-body-extra-bold-condensed-italic-paragraph-indent: 0;
--typography-body-extra-bold-condensed-italic-paragraph-spacing: 0;
--typography-body-extra-bold-condensed-italic-text-case: none;
--typography-body-medium-extended-italic-font-size: 20px;
--typography-body-medium-extended-italic-text-decoration: none;
--typography-body-medium-extended-italic-font-family: Akzidenz-Grotesk Pro;
--typography-body-medium-extended-italic-font-weight: 500;
--typography-body-medium-extended-italic-font-style: italic;
--typography-body-medium-extended-italic-font-stretch: expanded;
--typography-body-medium-extended-italic-letter-spacing: 0;
--typography-body-medium-extended-italic-line-height: 24px;
--typography-body-medium-extended-italic-paragraph-indent: 0;
--typography-body-medium-extended-italic-paragraph-spacing: 0;
--typography-body-medium-extended-italic-text-case: none;
--typography-body-super-font-size: 22px;
--typography-body-super-text-decoration: none;
--typography-body-super-font-family: Akzidenz-Grotesk Pro;
--typography-body-super-font-weight: 900;
--typography-body-super-font-style: normal;
--typography-body-super-font-stretch: normal;
--typography-body-super-letter-spacing: 0;
--typography-body-super-line-height: 26.4px;
--typography-body-super-paragraph-indent: 0;
--typography-body-super-paragraph-spacing: 0;
--typography-body-super-text-case: none;
--radius-1: 4px;
--radius-2: 8px;
--radius-3: 10px;
--radius-4: 12px;
}
125 changes: 4 additions & 121 deletions build/json/styles.json
Original file line number Diff line number Diff line change
@@ -1,123 +1,6 @@
{
"Sizes32": 32.72,
"Sizes40": 40,
"Sizes60": 60,
"Sizes80": 80,
"SizesPlainToken": 200,
"SizesTokenInFrame": 200,
"SizesTokenInGroup": 200,
"SizesInVariant60": 60,
"SizesInVariant90": 90,
"SizesInVariant120": 120,
"SizesFrame": 32,
"SizesRect": 32,
"SizesShapeInComponent": 32,
"BreakpointsLg": 1280,
"BreakpointsSm": 768,
"BreakpointsMd": 1024,
"Spacing10": {"top":10,"bottom":10,"left":10,"right":10},
"SpacingMixed": {"top":10,"bottom":30,"left":20,"right":20},
"SpacingTop": {"top":10,"bottom":0,"left":0,"right":0},
"Radius5": {"smoothing":0,"topLeft":5,"topRight":5,"bottomLeft":5,"bottomRight":5},
"RadiiSmoothing": {"smoothing":0.75,"topLeft":10,"topRight":10,"bottomLeft":10,"bottomRight":10},
"RadiiMixed": {"smoothing":0,"topLeft":5.5,"topRight":10,"bottomLeft":20,"bottomRight":15},
"GradientGradientSingleWithMultipleColorStops": {"gradientType":"radial","rotation":180,"stops":[{"position":0,"color":"#ffb800ff"},{"position":0.34,"color":"#ff8a00ff"},{"position":0.65,"color":"#ff2e00ff"},{"position":1,"color":"#ff0000ff"}]},
"GradientGradientMultiplegrad0": {"gradientType":"linear","rotation":180,"stops":[{"position":0,"color":"#ffb800ff"},{"position":1,"color":"#ffb80000"}]},
"GradientGradientMultiplegrad1": {"gradientType":"radial","rotation":180,"stops":[{"position":0,"color":"#ffffffff"},{"position":1,"color":"#ffffff00"}]},
"GradientGradientMultiplegrad2": {"gradientType":"angular","rotation":180,"stops":[{"position":0,"color":"#cf3030ff"},{"position":1,"color":"#ffffff00"}]},
"GradientGradientMultiplegrad3": {"gradientType":"diamond","rotation":180,"stops":[{"position":0,"color":"#4a4fccff"},{"position":0.23,"color":"#ffffff00"}]},
"ColorColorsSemiRed": "#ff5f04",
"ColorColorsMultipleFills0": "#40ffba",
"ColorColorsMultipleFills1": "#000000",
"ColorColorsSingleBlue": "#044aff",
"ColorColorsRefBlue": "#044aff",
"ColorColorsEmpty": "#000000",
"ColorColorsSpecialCharacters": "#40df50",
"ColorColorsSpecialCharactersNderung": "#3456af",
"FontBodyVariableFont": {"fontSize":16,"textDecoration":"line-through","fontFamily":"Roboto","fontWeight":500,"fontStyle":"italic","fontStretch":"normal","letterSpacing":0,"lineHeight":19.2,"paragraphIndent":0,"paragraphSpacing":0},
"FontBodyH3": {"fontSize":20,"textDecoration":"none","fontFamily":"Akzidenz-Grotesk Pro","fontWeight":700,"fontStyle":"normal","fontStretch":"condensed","letterSpacing":0.4,"lineHeight":32,"paragraphIndent":5,"paragraphSpacing":8,"textCase":"uppercase"},
"FontBodyH4StrikeThrough": {"fontSize":16,"textDecoration":"line-through","fontFamily":"Roboto","fontWeight":500,"fontStyle":"italic","fontStretch":"normal","letterSpacing":0,"lineHeight":19.2,"paragraphIndent":0,"paragraphSpacing":0},
"FontBodyItalic": {"fontSize":12,"textDecoration":"none","fontFamily":"Roboto","fontWeight":400,"fontStyle":"italic","fontStretch":"normal","letterSpacing":0,"lineHeight":14,"paragraphIndent":0,"paragraphSpacing":0,"textCase":"none"},
"FontBodyExtraBoldCondensedItalic": {"fontSize":12,"textDecoration":"none","fontFamily":"Akzidenz-Grotesk Pro","fontWeight":800,"fontStyle":"italic","fontStretch":"condensed","letterSpacing":0,"lineHeight":14.4,"paragraphIndent":0,"paragraphSpacing":0,"textCase":"none"},
"FontBodyMediumExtendedItalic": {"fontSize":20,"textDecoration":"none","fontFamily":"Akzidenz-Grotesk Pro","fontWeight":500,"fontStyle":"italic","fontStretch":"expanded","letterSpacing":0,"lineHeight":24,"paragraphIndent":0,"paragraphSpacing":0,"textCase":"none"},
"FontBodySuper": {"fontSize":22,"textDecoration":"none","fontFamily":"Akzidenz-Grotesk Pro","fontWeight":900,"fontStyle":"normal","fontStretch":"normal","letterSpacing":0,"lineHeight":26.4,"paragraphIndent":0,"paragraphSpacing":0,"textCase":"none"},
"EffectDropShadowSingle": {"shadowType":"dropShadow","radius":4,"color":"#00000040","offsetX":0,"offsetY":4,"spread":0},
"EffectInnerShadowMultiple0": {"shadowType":"innerShadow","radius":4,"color":"#00000040","offsetX":0,"offsetY":4,"spread":0},
"EffectInnerShadowMultiple1": {"shadowType":"innerShadow","radius":1,"color":"#000000ff","offsetX":10,"offsetY":100,"spread":0.5},
"EffectInnerShadowMultiple2": {"shadowType":"innerShadow","radius":3,"color":"#00000040","offsetX":-4,"offsetY":2,"spread":11},
"TypographyBodyVariableFontFontSize": 16,
"TypographyBodyVariableFontTextDecoration": "line-through",
"TypographyBodyVariableFontFontFamily": "Roboto",
"TypographyBodyVariableFontFontWeight": 500,
"TypographyBodyVariableFontFontStyle": "italic",
"TypographyBodyVariableFontFontStretch": "normal",
"TypographyBodyVariableFontLetterSpacing": 0,
"TypographyBodyVariableFontLineHeight": 19.2,
"TypographyBodyVariableFontParagraphIndent": 0,
"TypographyBodyVariableFontParagraphSpacing": 0,
"TypographyBodyH3FontSize": 20,
"TypographyBodyH3TextDecoration": "none",
"TypographyBodyH3FontFamily": "Akzidenz-Grotesk Pro",
"TypographyBodyH3FontWeight": 700,
"TypographyBodyH3FontStyle": "normal",
"TypographyBodyH3FontStretch": "condensed",
"TypographyBodyH3LetterSpacing": 0.4,
"TypographyBodyH3LineHeight": 32,
"TypographyBodyH3ParagraphIndent": 5,
"TypographyBodyH3ParagraphSpacing": 8,
"TypographyBodyH3TextCase": "uppercase",
"TypographyBodyH4StrikeThroughFontSize": 16,
"TypographyBodyH4StrikeThroughTextDecoration": "line-through",
"TypographyBodyH4StrikeThroughFontFamily": "Roboto",
"TypographyBodyH4StrikeThroughFontWeight": 500,
"TypographyBodyH4StrikeThroughFontStyle": "italic",
"TypographyBodyH4StrikeThroughFontStretch": "normal",
"TypographyBodyH4StrikeThroughLetterSpacing": 0,
"TypographyBodyH4StrikeThroughLineHeight": 19.2,
"TypographyBodyH4StrikeThroughParagraphIndent": 0,
"TypographyBodyH4StrikeThroughParagraphSpacing": 0,
"TypographyBodyItalicFontSize": 12,
"TypographyBodyItalicTextDecoration": "none",
"TypographyBodyItalicFontFamily": "Roboto",
"TypographyBodyItalicFontWeight": 400,
"TypographyBodyItalicFontStyle": "italic",
"TypographyBodyItalicFontStretch": "normal",
"TypographyBodyItalicLetterSpacing": 0,
"TypographyBodyItalicLineHeight": 14,
"TypographyBodyItalicParagraphIndent": 0,
"TypographyBodyItalicParagraphSpacing": 0,
"TypographyBodyItalicTextCase": "none",
"TypographyBodyExtraBoldCondensedItalicFontSize": 12,
"TypographyBodyExtraBoldCondensedItalicTextDecoration": "none",
"TypographyBodyExtraBoldCondensedItalicFontFamily": "Akzidenz-Grotesk Pro",
"TypographyBodyExtraBoldCondensedItalicFontWeight": 800,
"TypographyBodyExtraBoldCondensedItalicFontStyle": "italic",
"TypographyBodyExtraBoldCondensedItalicFontStretch": "condensed",
"TypographyBodyExtraBoldCondensedItalicLetterSpacing": 0,
"TypographyBodyExtraBoldCondensedItalicLineHeight": 14.4,
"TypographyBodyExtraBoldCondensedItalicParagraphIndent": 0,
"TypographyBodyExtraBoldCondensedItalicParagraphSpacing": 0,
"TypographyBodyExtraBoldCondensedItalicTextCase": "none",
"TypographyBodyMediumExtendedItalicFontSize": 20,
"TypographyBodyMediumExtendedItalicTextDecoration": "none",
"TypographyBodyMediumExtendedItalicFontFamily": "Akzidenz-Grotesk Pro",
"TypographyBodyMediumExtendedItalicFontWeight": 500,
"TypographyBodyMediumExtendedItalicFontStyle": "italic",
"TypographyBodyMediumExtendedItalicFontStretch": "expanded",
"TypographyBodyMediumExtendedItalicLetterSpacing": 0,
"TypographyBodyMediumExtendedItalicLineHeight": 24,
"TypographyBodyMediumExtendedItalicParagraphIndent": 0,
"TypographyBodyMediumExtendedItalicParagraphSpacing": 0,
"TypographyBodyMediumExtendedItalicTextCase": "none",
"TypographyBodySuperFontSize": 22,
"TypographyBodySuperTextDecoration": "none",
"TypographyBodySuperFontFamily": "Akzidenz-Grotesk Pro",
"TypographyBodySuperFontWeight": 900,
"TypographyBodySuperFontStyle": "normal",
"TypographyBodySuperFontStretch": "normal",
"TypographyBodySuperLetterSpacing": 0,
"TypographyBodySuperLineHeight": 26.4,
"TypographyBodySuperParagraphIndent": 0,
"TypographyBodySuperParagraphSpacing": 0,
"TypographyBodySuperTextCase": "none"
"Radius1": {"smoothing":0,"topLeft":4,"topRight":4,"bottomLeft":4,"bottomRight":4},
"Radius2": {"smoothing":0,"topLeft":8,"topRight":8,"bottomLeft":8,"bottomRight":8},
"Radius3": {"smoothing":0,"topLeft":10,"topRight":10,"bottomLeft":10,"bottomRight":10},
"Radius4": {"smoothing":0,"topLeft":12,"topRight":12,"bottomLeft":12,"bottomRight":12}
}
Loading