Skip to content

Commit

Permalink
Merge pull request #90 from klac503/set-mat-font-css-vars
Browse files Browse the repository at this point in the history 
Set line-height & letter-spacing
  • Loading branch information
@BeataKr
BeataKr authored Dec 10, 2024
2 parents 63f3a37 + e099f89 commit 2d9c0db
Showing 1 changed file with 41 additions and 11 deletions.
52 changes: 41 additions & 11 deletions libs/angular-theme/lib/core/typography/_typography.scss
View file
Original file line number Diff line number Diff line change
Expand Up @@ -9,67 +9,97 @@ $typography-config: mat.m2-define-typography-config(
mat.m2-define-typography-level(
$font-family: map.get(fds-variables.$properties, 'headline-1', 'font-family'),
$font-size: map.get(fds-variables.$properties, 'headline-1', 'font-size'),
$font-weight: map.get(fds-variables.$properties, 'headline-1', 'font-weight')
$font-weight: map.get(fds-variables.$properties, 'headline-1', 'font-weight'),
$line-height: map.get(fds-variables.$properties, 'headline-1', 'line-height'),
$letter-spacing: map.get(fds-variables.$properties, 'headline-1', 'letter-spacing')
),
$headline-2:
mat.m2-define-typography-level(
$font-family: map.get(fds-variables.$properties, 'headline-2', 'font-family'),
$font-size: map.get(fds-variables.$properties, 'headline-2', 'font-size'),
$font-weight: map.get(fds-variables.$properties, 'headline-2', 'font-weight')
$font-weight: map.get(fds-variables.$properties, 'headline-2', 'font-weight'),
$line-height: map.get(fds-variables.$properties, 'headline-2', 'line-height'),
$letter-spacing: map.get(fds-variables.$properties, 'headline-2', 'letter-spacing')
),
$headline-3:
mat.m2-define-typography-level(
$font-family: map.get(fds-variables.$properties, 'headline-3', 'font-family'),
$font-size: map.get(fds-variables.$properties, 'headline-3', 'font-size'),
$font-weight: map.get(fds-variables.$properties, 'headline-3', 'font-weight')
$font-weight: map.get(fds-variables.$properties, 'headline-3', 'font-weight'),
$line-height: map.get(fds-variables.$properties, 'headline-3', 'line-height'),
$letter-spacing: map.get(fds-variables.$properties, 'headline-3', 'letter-spacing')
),
$headline-4:
mat.m2-define-typography-level(
$font-family: map.get(fds-variables.$properties, 'headline-4', 'font-family'),
$font-size: map.get(fds-variables.$properties, 'headline-4', 'font-size'),
$font-weight: map.get(fds-variables.$properties, 'headline-4', 'font-weight')
$font-weight: map.get(fds-variables.$properties, 'headline-4', 'font-weight'),
$line-height: map.get(fds-variables.$properties, 'headline-4', 'line-height'),
$letter-spacing: map.get(fds-variables.$properties, 'headline-4', 'letter-spacing')
),
$headline-5:
mat.m2-define-typography-level(
$font-family: map.get(fds-variables.$properties, 'headline-5', 'font-family'),
$font-size: map.get(fds-variables.$properties, 'headline-5', 'font-size'),
$font-weight: map.get(fds-variables.$properties, 'headline-5', 'font-weight')
$font-weight: map.get(fds-variables.$properties, 'headline-5', 'font-weight'),
$line-height: map.get(fds-variables.$properties, 'headline-5', 'line-height'),
$letter-spacing: map.get(fds-variables.$properties, 'headline-5', 'letter-spacing')
),
$headline-6:
mat.m2-define-typography-level(
$font-family: map.get(fds-variables.$properties, 'headline-6', 'font-family'),
$font-size: map.get(fds-variables.$properties, 'headline-6', 'font-size'),
$font-weight: map.get(fds-variables.$properties, 'headline-6', 'font-weight')
$font-weight: map.get(fds-variables.$properties, 'headline-6', 'font-weight'),
$line-height: map.get(fds-variables.$properties, 'headline-6', 'line-height'),
$letter-spacing: map.get(fds-variables.$properties, 'headline-6', 'letter-spacing')
),
$subtitle-1:
mat.m2-define-typography-level(
$font-family: map.get(fds-variables.$properties, 'subtitle-1', 'font-family'),
$font-size: map.get(fds-variables.$properties, 'subtitle-1', 'font-size'),
$font-weight: map.get(fds-variables.$properties, 'subtitle-1', 'font-weight')
$font-weight: map.get(fds-variables.$properties, 'subtitle-1', 'font-weight'),
$line-height: map.get(fds-variables.$properties, 'subtitle-1', 'line-height'),
$letter-spacing: map.get(fds-variables.$properties, 'subtitle-1', 'letter-spacing')
),
$subtitle-2:
mat.m2-define-typography-level(
$font-family: map.get(fds-variables.$properties, 'subtitle-2', 'font-family'),
$font-size: map.get(fds-variables.$properties, 'subtitle-2', 'font-size'),
$font-weight: map.get(fds-variables.$properties, 'subtitle-2', 'font-weight')
$font-weight: map.get(fds-variables.$properties, 'subtitle-2', 'font-weight'),
$line-height: map.get(fds-variables.$properties, 'subtitle-2', 'line-height'),
$letter-spacing: map.get(fds-variables.$properties, 'subtitle-2', 'letter-spacing')
),
$body-1:
mat.m2-define-typography-level(
$font-family: map.get(fds-variables.$properties, 'body-1', 'font-family'),
$font-size: map.get(fds-variables.$properties, 'body-1', 'font-size'),
$font-weight: map.get(fds-variables.$properties, 'body-1', 'font-weight')
$font-weight: map.get(fds-variables.$properties, 'body-1', 'font-weight'),
$line-height: map.get(fds-variables.$properties, 'body-1', 'line-height'),
$letter-spacing: map.get(fds-variables.$properties, 'body-1', 'letter-spacing')
),
$body-2:
mat.m2-define-typography-level(
$font-family: map.get(fds-variables.$properties, 'body-2', 'font-family'),
$font-size: map.get(fds-variables.$properties, 'body-2', 'font-size'),
$font-weight: map.get(fds-variables.$properties, 'body-2', 'font-weight')
$font-weight: map.get(fds-variables.$properties, 'body-2', 'font-weight'),
$line-height: map.get(fds-variables.$properties, 'body-2', 'line-height'),
$letter-spacing: map.get(fds-variables.$properties, 'body-2', 'letter-spacing')
),
$caption:
mat.m2-define-typography-level(
$font-family: map.get(fds-variables.$properties, 'caption', 'font-family'),
$font-size: map.get(fds-variables.$properties, 'caption', 'font-size'),
$font-weight: map.get(fds-variables.$properties, 'caption', 'font-weight')
$font-weight: map.get(fds-variables.$properties, 'caption', 'font-weight'),
$line-height: map.get(fds-variables.$properties, 'caption', 'line-height'),
$letter-spacing: map.get(fds-variables.$properties, 'caption', 'letter-spacing')
),
$button:
mat.m2-define-typography-level(
$font-family: map.get(fds-variables.$properties, 'button-1', 'font-family'),
$font-size: map.get(fds-variables.$properties, 'button-1', 'font-size'),
$font-weight: map.get(fds-variables.$properties, 'button-1', 'font-weight'),
$line-height: map.get(fds-variables.$properties, 'button-1', 'line-height'),
$letter-spacing: map.get(fds-variables.$properties, 'button-1', 'letter-spacing')
)
);
@include mat.typography-hierarchy($typography-config);
Expand Down

0 comments on commit 2d9c0db

Please sign in to comment.