11import { ColorStates } from "./constants" ;
22
3+ interface Measurements {
4+ [ key : string ] : string ;
5+ }
6+
37interface TextPalette extends ColorStates {
48 primary : string ;
59 secondary : string ;
@@ -9,20 +13,47 @@ interface TextPalette extends ColorStates {
913
1014interface Typography {
1115 palette : TextPalette ;
16+ lineHeights : Measurements ;
17+ sizes : Measurements ;
1218}
1319
20+ const FONT_SIZES = [ 12 , 14 , 16 , 20 , 24 , 30 , 36 , 48 , 60 ] ;
1421const PRIMARY_TEXT_COLOR = "" ;
1522const SECODARY_TEXT_COLOR = "" ;
1623const PRESSED_TEXT_COLOR = "" ;
1724const DISABLED_TEXT_COLOR = "" ;
1825
26+ const palette : TextPalette = {
27+ primary : PRIMARY_TEXT_COLOR ,
28+ secondary : SECODARY_TEXT_COLOR ,
29+ disabled : DISABLED_TEXT_COLOR ,
30+ pressed : PRESSED_TEXT_COLOR
31+ } ;
32+
33+ const lineHeights : Measurements = {
34+ xs : "19px" ,
35+ sm : "23px" ,
36+ rg : "26px" ,
37+ md : "32px" ,
38+ lg : "39px" ,
39+ xl : "49px"
40+ } ;
41+ const sizes : Measurements = {
42+ xs : `${ FONT_SIZES [ 0 ] } px` ,
43+ sm : `${ FONT_SIZES [ 1 ] } px` ,
44+ rg : `${ FONT_SIZES [ 2 ] } px` ,
45+ md : `${ FONT_SIZES [ 3 ] } px` ,
46+ lg : `${ FONT_SIZES [ 4 ] } px` ,
47+ xl : `${ FONT_SIZES [ 5 ] } px` ,
48+ subheader2 : `${ FONT_SIZES [ 6 ] } px` ,
49+ subheader : `${ FONT_SIZES [ 7 ] } px` ,
50+ header : `${ FONT_SIZES [ 8 ] } px`
51+ } ;
52+
1953const typography : Typography = {
20- palette : {
21- primary : PRIMARY_TEXT_COLOR ,
22- secondary : SECODARY_TEXT_COLOR ,
23- disabled : DISABLED_TEXT_COLOR ,
24- pressed : PRESSED_TEXT_COLOR
25- }
54+ palette,
55+ lineHeights,
56+ sizes
2657} ;
2758
2859export { Typography , typography } ;
0 commit comments