Skip to content

Design tokens updated #38

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Design tokens updated #38

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
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
128 changes: 17 additions & 111 deletions build/css/_variables.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,113 +1,19 @@
: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-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-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-h4-strike-through-text-case: none;
--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;
--not-exported: rgb(254, 80, 80);
--colors-semi-red: rgba(255, 95, 4, 0.5);
--colors-multiple-fills-0: rgb(64, 255, 186);
--colors-multiple-fills-1: rgba(0, 0, 0, 0.1);
--colors-single-blue: rgb(4, 74, 255);
--colors-ref-blue: rgb(4, 74, 255);
--colors-empty: rgba(0, 0, 0, 0);
--colors-special-characters: rgb(64, 223, 80);
--colors-special-characters-nderung: rgb(52, 86, 175);
--design-tokens-functional-colors-successcolor: rgb(18, 240, 160);
--design-tokens-functional-colors-fancyref: rgb(18, 240, 160);
--design-tokens-number: 22px;
--design-tokens-string: Hello World;
--base-colors-fancygreen: rgb(18, 240, 160);
--base-basenumber: 22px;
--base-others-base-string: String value;
--base-numvar: 1.78px;
}
22 changes: 13 additions & 9 deletions build/ios-swift/StyleDictionaryColor.swift
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,18 +4,22 @@
//

// Do not edit directly
// Generated on Mon, 08 May 2023 07:37:37 GMT
// Generated on Mon, 25 Mar 2024 15:46:09 GMT


import UIKit

public enum StyleDictionaryColor {
public static let colorsEmpty = UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 0)
public static let colorsMultipleFills0 = UIColor(red: 0.251, green: 1.000, blue: 0.729, alpha: 1)
public static let colorsMultipleFills1 = UIColor(red: 0.000, green: 0.000, blue: 0.000, alpha: 0.10196078431372549)
public static let colorsRefBlue = UIColor(red: 0.016, green: 0.290, blue: 1.000, alpha: 1)
public static let colorsSemiRed = UIColor(red: 1.000, green: 0.373, blue: 0.016, alpha: 0.5019607843137255)
public static let colorsSingleBlue = UIColor(red: 0.016, green: 0.290, blue: 1.000, alpha: 1)
public static let colorsSpecialCharacters = UIColor(red: 0.251, green: 0.875, blue: 0.314, alpha: 1)
public static let colorsSpecialCharactersNderung = UIColor(red: 0.204, green: 0.337, blue: 0.686, alpha: 1)
public static let = #fe5050ff
public static let colorsFancygreen = #12f0a0ff
public static let empty = #00000000
public static let functionalColorsFancyref = #12f0a0ff
public static let functionalColorsSuccesscolor = #12f0a0ff
public static let multipleFills0 = #40ffbaff
public static let multipleFills1 = #0000001a
public static let refBlue = #044affff
public static let semiRed = #ff5f0480
public static let singleBlue = #044affff
public static let specialCharacters = #40df50ff
public static let specialCharactersNderung = #3456afff
}
22 changes: 13 additions & 9 deletions build/ios/StyleDictionaryColor.h
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,20 +4,24 @@
//

// Do not edit directly
// Generated on Mon, 08 May 2023 07:37:37 GMT
// Generated on Mon, 25 Mar 2024 15:46:09 GMT


#import <UIKit/UIKit.h>

typedef NS_ENUM(NSInteger, StyleDictionaryColorName) {
ColorColorsSemiRed,
ColorColorsMultipleFills0,
ColorColorsMultipleFills1,
ColorColorsSingleBlue,
ColorColorsRefBlue,
ColorColorsEmpty,
ColorColorsSpecialCharacters,
ColorColorsSpecialCharactersNderung
NotExported,
ColorsSemiRed,
ColorsMultipleFills0,
ColorsMultipleFills1,
ColorsSingleBlue,
ColorsRefBlue,
ColorsEmpty,
ColorsSpecialCharacters,
ColorsSpecialCharactersNderung,
DesignTokensFunctionalColorsSuccesscolor,
DesignTokensFunctionalColorsFancyref,
BaseColorsFancygreen
};

@interface StyleDictionaryColor : NSObject
Expand Down
22 changes: 13 additions & 9 deletions build/ios/StyleDictionaryColor.m
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,7 +4,7 @@
//

// Do not edit directly
// Generated on Mon, 08 May 2023 07:37:37 GMT
// Generated on Mon, 25 Mar 2024 15:46:09 GMT


#import "StyleDictionaryColor.h"
Expand All @@ -21,14 +21,18 @@ + (NSArray *)values {

dispatch_once(&onceToken, ^{
colorArray = @[
[UIColor colorWithRed:1.000f green:0.373f blue:0.016f alpha:0.502f],
[UIColor colorWithRed:0.251f green:1.000f blue:0.729f alpha:1.000f],
[UIColor colorWithRed:0.000f green:0.000f blue:0.000f alpha:0.102f],
[UIColor colorWithRed:0.016f green:0.290f blue:1.000f alpha:1.000f],
[UIColor colorWithRed:0.016f green:0.290f blue:1.000f alpha:1.000f],
[UIColor colorWithRed:0.000f green:0.000f blue:0.000f alpha:0.000f],
[UIColor colorWithRed:0.251f green:0.875f blue:0.314f alpha:1.000f],
[UIColor colorWithRed:0.204f green:0.337f blue:0.686f alpha:1.000f]
#fe5050ff,
#ff5f0480,
#40ffbaff,
#0000001a,
#044affff,
#044affff,
#00000000,
#40df50ff,
#3456afff,
#12f0a0ff,
#12f0a0ff,
#12f0a0ff
];
});

Expand Down
130 changes: 18 additions & 112 deletions build/json/styles.json
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,113 +1,19 @@
{
"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",
"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,"textCase":"none"},
"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},
"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,
"TypographyBodyH4StrikeThroughTextCase": "none",
"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"
}
"NotExported": "#fe5050ff",
"ColorsSemiRed": "#ff5f0480",
"ColorsMultipleFills0": "#40ffbaff",
"ColorsMultipleFills1": "#0000001a",
"ColorsSingleBlue": "#044affff",
"ColorsRefBlue": "#044affff",
"ColorsEmpty": "#00000000",
"ColorsSpecialCharacters": "#40df50ff",
"ColorsSpecialCharactersNderung": "#3456afff",
"DesignTokensFunctionalColorsSuccesscolor": "#12f0a0ff",
"DesignTokensFunctionalColorsFancyref": "#12f0a0ff",
"DesignTokensNumber": 22,
"DesignTokensString": "Hello World",
"BaseColorsFancygreen": "#12f0a0ff",
"BaseBasenumber": 22,
"BaseOthersBaseString": "String value",
"BaseNumvar": 1.78
}
Loading