Skip to content

Commit

Permalink
feat(plasma-asdk): fix typography configs
Browse files Browse the repository at this point in the history
  • Loading branch information
TitanKuzmich committed Dec 23, 2023
1 parent 9a28b2e commit 82c6332
Show file tree
Hide file tree
Showing 12 changed files with 321 additions and 202 deletions.
62 changes: 42 additions & 20 deletions packages/plasma-asdk/src/components/Typography/Body.config.ts
Original file line number Diff line number Diff line change
@@ -1,26 +1,8 @@
import { css, typographyTokens } from '@salutejs/plasma-new-hope/styled-components';

export const defaults = {
m: {
size: 'm',
},
l: {
size: 'l',
},
s: {
size: 's',
},
xs: {
size: 'xs',
},
xxs: {
size: 'xxs',
},
};

export const config = {
export const configL = {
defaults: {
size: 'm',
size: 'l',
},
variations: {
size: {
Expand All @@ -33,6 +15,16 @@ export const config = {
${typographyTokens.typoFontLetterSpacing}: var(--plasma-typo-body-l-letter-spacing);
${typographyTokens.typoFontLineHeight}: var(--plasma-typo-body-l-line-height);
`,
},
},
};

export const configM = {
defaults: {
size: 'm',
},
variations: {
size: {
m: css`
${typographyTokens.typoFontFamily}: var(--plasma-typo-body-m-font-family);
${typographyTokens.typoFontSize}: var(--plasma-typo-body-m-font-size);
Expand All @@ -42,6 +34,16 @@ export const config = {
${typographyTokens.typoFontLetterSpacing}: var(--plasma-typo-body-m-letter-spacing);
${typographyTokens.typoFontLineHeight}: var(--plasma-typo-body-m-line-height);
`,
},
},
};

export const configS = {
defaults: {
size: 's',
},
variations: {
size: {
s: css`
${typographyTokens.typoFontFamily}: var(--plasma-typo-body-s-font-family);
${typographyTokens.typoFontSize}: var(--plasma-typo-body-s-font-size);
Expand All @@ -51,6 +53,16 @@ export const config = {
${typographyTokens.typoFontLetterSpacing}: var(--plasma-typo-body-s-letter-spacing);
${typographyTokens.typoFontLineHeight}: var(--plasma-typo-body-s-line-height);
`,
},
},
};

export const configXS = {
defaults: {
size: 'xs',
},
variations: {
size: {
xs: css`
${typographyTokens.typoFontFamily}: var(--plasma-typo-body-xs-font-family);
${typographyTokens.typoFontSize}: var(--plasma-typo-body-xs-font-size);
Expand All @@ -60,6 +72,16 @@ export const config = {
${typographyTokens.typoFontLetterSpacing}: var(--plasma-typo-body-xs-letter-spacing);
${typographyTokens.typoFontLineHeight}: var(--plasma-typo-body-xs-line-height);
`,
},
},
};

export const configXXS = {
defaults: {
size: 'xxs',
},
variations: {
size: {
xxs: css`
${typographyTokens.typoFontFamily}: var(--plasma-typo-body-xxs-font-family);
${typographyTokens.typoFontSize}: var(--plasma-typo-body-xxs-font-size);
Expand Down
36 changes: 22 additions & 14 deletions packages/plasma-asdk/src/components/Typography/Dspl.config.ts
Original file line number Diff line number Diff line change
@@ -1,20 +1,8 @@
import { css, typographyTokens } from '@salutejs/plasma-new-hope/styled-components';

export const defaults = {
m: {
size: 'm',
},
l: {
size: 'l',
},
s: {
size: 's',
},
};

export const config = {
export const configL = {
defaults: {
size: 'm',
size: 'l',
},
variations: {
size: {
Expand All @@ -27,6 +15,16 @@ export const config = {
${typographyTokens.typoFontLetterSpacing}: var(--plasma-typo-dspl-l-letter-spacing);
${typographyTokens.typoFontLineHeight}: var(--plasma-typo-dspl-l-line-height);
`,
},
},
};

export const configM = {
defaults: {
size: 'm',
},
variations: {
size: {
m: css`
${typographyTokens.typoFontFamily}: var(--plasma-typo-dspl-m-font-family);
${typographyTokens.typoFontSize}: var(--plasma-typo-dspl-m-font-size);
Expand All @@ -36,6 +34,16 @@ export const config = {
${typographyTokens.typoFontLetterSpacing}: var(--plasma-typo-dspl-m-letter-spacing);
${typographyTokens.typoFontLineHeight}: var(--plasma-typo-dspl-m-line-height);
`,
},
},
};

export const configS = {
defaults: {
size: 's',
},
variations: {
size: {
s: css`
${typographyTokens.typoFontFamily}: var(--plasma-typo-dspl-s-font-family);
${typographyTokens.typoFontSize}: var(--plasma-typo-dspl-s-font-size);
Expand Down
58 changes: 38 additions & 20 deletions packages/plasma-asdk/src/components/Typography/Heading.config.ts
Original file line number Diff line number Diff line change
@@ -1,26 +1,8 @@
import { css, typographyTokens } from '@salutejs/plasma-new-hope/styled-components';

export const defaults = {
h1: {
size: 'h1',
},
h2: {
size: 'h2',
},
h3: {
size: 'h3',
},
h4: {
size: 'h4',
},
h5: {
size: 'h5',
},
};

export const config = {
export const configH1 = {
defaults: {
size: 'h2',
size: 'h1',
},
variations: {
size: {
Expand All @@ -33,6 +15,15 @@ export const config = {
${typographyTokens.typoFontLetterSpacing}: var(--plasma-typo-h1-letter-spacing);
${typographyTokens.typoFontLineHeight}: var(--plasma-typo-h1-line-height);
`,
},
},
};
export const configH2 = {
defaults: {
size: 'h2',
},
variations: {
size: {
h2: css`
${typographyTokens.typoFontFamily}: var(--plasma-typo-h2-font-family);
${typographyTokens.typoFontSize}: var(--plasma-typo-h2-font-size);
Expand All @@ -42,6 +33,15 @@ export const config = {
${typographyTokens.typoFontLetterSpacing}: var(--plasma-typo-h2-letter-spacing);
${typographyTokens.typoFontLineHeight}: var(--plasma-typo-h2-line-height);
`,
},
},
};
export const configH3 = {
defaults: {
size: 'h3',
},
variations: {
size: {
h3: css`
${typographyTokens.typoFontFamily}: var(--plasma-typo-h3-font-family);
${typographyTokens.typoFontSize}: var(--plasma-typo-h3-font-size);
Expand All @@ -51,6 +51,15 @@ export const config = {
${typographyTokens.typoFontLetterSpacing}: var(--plasma-typo-h3-letter-spacing);
${typographyTokens.typoFontLineHeight}: var(--plasma-typo-h3-line-height);
`,
},
},
};
export const configH4 = {
defaults: {
size: 'h4',
},
variations: {
size: {
h4: css`
${typographyTokens.typoFontFamily}: var(--plasma-typo-h4-font-family);
${typographyTokens.typoFontSize}: var(--plasma-typo-h4-font-size);
Expand All @@ -60,6 +69,15 @@ export const config = {
${typographyTokens.typoFontLetterSpacing}: var(--plasma-typo-h4-letter-spacing);
${typographyTokens.typoFontLineHeight}: var(--plasma-typo-h4-line-height);
`,
},
},
};
export const configH5 = {
defaults: {
size: 'h5',
},
variations: {
size: {
h5: css`
${typographyTokens.typoFontFamily}: var(--plasma-typo-h5-font-family);
${typographyTokens.typoFontSize}: var(--plasma-typo-h5-font-size);
Expand Down
34 changes: 21 additions & 13 deletions packages/plasma-asdk/src/components/Typography/Old/Body.config.ts
Original file line number Diff line number Diff line change
@@ -1,18 +1,6 @@
import { css, typographyTokens } from '@salutejs/plasma-new-hope/styled-components';

export const defaults = {
body1: {
size: 'body1',
},
body2: {
size: 'body2',
},
body3: {
size: 'body3',
},
};

export const config = {
export const configBody1 = {
defaults: {
size: 'body1',
},
Expand All @@ -26,6 +14,16 @@ export const config = {
${typographyTokens.typoFontLetterSpacing}: var(--plasma-typo-body1-letter-spacing);
${typographyTokens.typoFontLineHeight}: var(--plasma-typo-body1-line-height);
`,
},
},
};

export const configBody2 = {
defaults: {
size: 'body2',
},
variations: {
size: {
body2: css`
${typographyTokens.typoFontFamily}: var(--plasma-typo-body2-font-family);
${typographyTokens.typoFontSize}: var(--plasma-typo-body2-font-size);
Expand All @@ -34,6 +32,16 @@ export const config = {
${typographyTokens.typoFontLetterSpacing}: var(--plasma-typo-body2-letter-spacing);
${typographyTokens.typoFontLineHeight}: var(--plasma-typo-body2-line-height);
`,
},
},
};

export const configBody3 = {
defaults: {
size: 'body3',
},
variations: {
size: {
body3: css`
${typographyTokens.typoFontFamily}: var(--plasma-typo-body3-font-family);
${typographyTokens.typoFontSize}: var(--plasma-typo-body3-font-size);
Expand Down
21 changes: 11 additions & 10 deletions packages/plasma-asdk/src/components/Typography/Old/Button.config.ts
Original file line number Diff line number Diff line change
@@ -1,15 +1,6 @@
import { css, typographyTokens } from '@salutejs/plasma-new-hope/styled-components';

export const defaults = {
button1: {
size: 'button1',
},
button2: {
size: 'button2',
},
};

export const config = {
export const configButton1 = {
defaults: {
size: 'button1',
},
Expand All @@ -23,6 +14,16 @@ export const config = {
${typographyTokens.typoFontLetterSpacing}: var(--plasma-typo-button1-letter-spacing);
${typographyTokens.typoFontLineHeight}: var(--plasma-typo-button1-line-height);
`,
},
},
};

export const configButton2 = {
defaults: {
size: 'button2',
},
variations: {
size: {
button2: css`
${typographyTokens.typoFontFamily}: var(--plasma-typo-button2-font-family);
${typographyTokens.typoFontSize}: var(--plasma-typo-button2-font-size);
Expand Down
Original file line number Diff line number Diff line change
@@ -1,18 +1,6 @@
import { css, typographyTokens } from '@salutejs/plasma-new-hope/styled-components';

export const defaults = {
display1: {
size: 'display1',
},
display2: {
size: 'display2',
},
display3: {
size: 'display3',
},
};

export const config = {
export const configDisplay1 = {
defaults: {
size: 'display1',
},
Expand All @@ -26,6 +14,16 @@ export const config = {
${typographyTokens.typoFontLetterSpacing}: var(--plasma-typo-display1-letter-spacing);
${typographyTokens.typoFontLineHeight}: var(--plasma-typo-display1-line-height);
`,
},
},
};

export const configDisplay2 = {
defaults: {
size: 'display2',
},
variations: {
size: {
display2: css`
${typographyTokens.typoFontFamily}: var(--plasma-typo-display2-font-family);
${typographyTokens.typoFontSize}: var(--plasma-typo-display2-font-size);
Expand All @@ -34,6 +32,16 @@ export const config = {
${typographyTokens.typoFontLetterSpacing}: var(--plasma-typo-display2-letter-spacing);
${typographyTokens.typoFontLineHeight}: var(--plasma-typo-display2-line-height);
`,
},
},
};

export const configDisplay3 = {
defaults: {
size: 'display3',
},
variations: {
size: {
display3: css`
${typographyTokens.typoFontFamily}: var(--plasma-typo-display3-font-family);
${typographyTokens.typoFontSize}: var(--plasma-typo-display3-font-size);
Expand Down
Loading

0 comments on commit 82c6332

Please sign in to comment.