Implement an easier way to modify the default typography
mlaursen opened this issue · 0 comments
mlaursen commented
Description
Update the typography behavior so that the different typography parts can be updated with non-global variables.
$rmd-typography-default-headline-1-styles$rmd-typography-headline-1-styles$rmd-typography-default-headline-2-styles$rmd-typography-headline-2-styles$rmd-typography-default-headline-3-styles$rmd-typography-headline-3-styles$rmd-typography-default-headline-4-styles$rmd-typography-headline-4-styles$rmd-typography-default-headline-5-styles$rmd-typography-headline-5-styles$rmd-typography-default-headline-6-styles$rmd-typography-headline-6-styles$rmd-typography-default-body-1-styles$rmd-typography-body-1-styles$rmd-typography-default-body-2-styles$rmd-typography-body-2-styles$rmd-typography-default-button-styles$rmd-typography-button-styles$rmd-typography-default-caption-styles$rmd-typography-caption-styles$rmd-typography-default-overline-styles$rmd-typography-overline-styles
Ideal API
@use "react-md" as * with (
$rmd-typography-headline-1-styles: (
font-size: 4rem,
line-height: 4rem,
margin: 0,
),
$rmd-typography-headline-2-styles: (
font-size: 3.5rem,
line-height: 3.5rem,
margin: 0,
),
$rmd-typography-headline-3-styles: (
margin: 0,
),
$rmd-typography-headline-4-styles: (
margin: 0,
),
$rmd-typography-headline-5-styles: (
margin: 0,
),
$rmd-typography-headline-6-styles: (
margin: 0,
),
$rmd-typography-subtitle-1-styles: (),
$rmd-typography-subtitle-2-styles: (),
$rmd-typography-body-1-styles: (),
$rmd-typography-body-2-styles: (),
$rmd-typography-caption-styles: (),
$rmd-typography-button-styles: (),
$rmd-typography-overline-styles: (),
);