Skip to content
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

css-library: add source-sans normalize token, rename base to root #1399

Merged
merged 6 commits into from
Nov 14, 2024
Merged

css-library: add source-sans normalize token, rename base to root #1399

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
6 commits
Select commit Hold shift + click to select a range
3643807
css-library: add source-sans normalize token, rename base to root
powellkerry Nov 12, 2024
195cc35
remove duplicate root variable
powellkerry Nov 13, 2024
24abb26
keep base utility class
powellkerry Nov 13, 2024
506d020
revert changes to re-add base and remove vads-font-size-root variable
powellkerry Nov 13, 2024
3892788
keep font-size-base token
powellkerry Nov 13, 2024
9883387
Merge branch 'main' into 3452-update-font-tokens
powellkerry Nov 13, 2024
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
36 changes: 29 additions & 7 deletions packages/css-library/dist/stylesheets/utilities.css
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion packages/css-library/dist/stylesheets/utilities.css.map
View file
Open in desktop

Large diffs are not rendered by default.

5 changes: 3 additions & 2 deletions packages/css-library/dist/tokens/css/variables.css
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
/**
* Do not edit directly
* Generated on Fri, 01 Nov 2024 17:33:49 GMT
* Generated on Wed, 13 Nov 2024 16:49:15 GMT
*/

:root {
Expand Down Expand Up @@ -120,7 +120,7 @@
--font-style-normal: normal;
--font-style-italic: italic;
--font-size-sm: 0.938rem;
--font-size-base: 1rem;
--font-size-root: 1rem;
--font-size-md: 1.063rem;
--font-size-lg: 1.25rem;
--font-size-xl: 1.875rem;
Expand All @@ -135,6 +135,7 @@
--vads-font-line-height-body-lead: 1.75;
--vads-font-line-height-default: 1.5;
--vads-font-line-height-heading: 1.2;
--vads-font-size-source-sans-normalized: 1.06rem;
--vads-font-size-body-large: 20px;
--vads-font-size-body-lead: 20px;
--vads-font-size-body-medium: 17px;
Expand Down
27 changes: 23 additions & 4 deletions packages/css-library/dist/tokens/json/variables.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2169,23 +2169,23 @@
"sm"
]
},
"base": {
"root": {
"value": "1rem",
"filePath": "tokens/fonts.json",
"isSource": true,
"original": {
"value": "1rem"
},
"name": "font-size-base",
"name": "font-size-root",
"attributes": {
"category": "font",
"type": "size",
"item": "base"
"item": "root"
},
"path": [
"font",
"size",
"base"
"root"
]
},
"md": {
Expand Down Expand Up @@ -2464,6 +2464,25 @@
}
},
"size": {
"source-sans-normalized": {
"value": "1.06rem",
"filePath": "tokens/fonts.json",
"isSource": true,
"original": {
"value": "1.06rem"
},
"name": "vads-font-size-source-sans-normalized",
"attributes": {
"category": "vads-font",
"type": "size",
"item": "source-sans-normalized"
},
"path": [
"vads-font",
"size",
"source-sans-normalized"
]
},
"body": {
"large": {
"value": "20px",
Expand Down
5 changes: 3 additions & 2 deletions packages/css-library/dist/tokens/scss/variables.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@

// Do not edit directly
// Generated on Fri, 01 Nov 2024 17:33:49 GMT
// Generated on Wed, 13 Nov 2024 16:49:15 GMT

$xsmall-screen: 320px;
$small-screen: 481px;
Expand Down Expand Up @@ -118,7 +118,7 @@ $font-weight-bold: 700;
$font-style-normal: normal;
$font-style-italic: italic;
$font-size-sm: 0.938rem;
$font-size-base: 1rem;
$font-size-root: 1rem;
$font-size-md: 1.063rem;
$font-size-lg: 1.25rem;
$font-size-xl: 1.875rem;
Expand All @@ -133,6 +133,7 @@ $v3-font-base-size: 16px;
$vads-font-line-height-body-lead: 1.75;
$vads-font-line-height-default: 1.5;
$vads-font-line-height-heading: 1.2;
$vads-font-size-source-sans-normalized: 1.06rem;
$vads-font-size-body-large: 20px;
$vads-font-size-body-lead: 20px;
$vads-font-size-body-medium: 17px;
Expand Down
3 changes: 2 additions & 1 deletion packages/css-library/src/tokens/font.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,8 +6,9 @@ $tokens-font-family: (
);

$tokens-font-size: (
'source-sans-normalized': $font-size-md,
'sm': $font-size-sm,
'base': $font-size-base,
'root': $font-size-root,
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

For now, you can keep this as base with the updated value so the utility class remains the same.

Suggested change
'root': $font-size-root,
'base': $font-size-root,

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I did update this on the documentation site PR. Should we keep root and base or should I revert that change on the documentation site PR?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I left some comments on your doc site PR. I think some of the changes need to be reverted for the utility class updates there, and some changes need to be modified because we're not actually generating a vads-font-size-root token, just a token named font-size-root

'md': $font-size-md,
'lg': $font-size-lg,
'xl': $font-size-xl,
Expand Down
3 changes: 2 additions & 1 deletion packages/css-library/tokens/fonts.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -18,7 +18,7 @@
},
"size": {
"sm": { "value": "0.938rem" },
"base": { "value": "1rem" },
"root": { "value": "1rem" },
"md": { "value": "1.063rem" },
"lg": { "value": "1.25rem" },
"xl": { "value": "1.875rem" },
Expand All @@ -43,6 +43,7 @@
"heading": { "value": "1.2" }
},
"size": {
"source-sans-normalized": { "value": "1.06rem" },
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@powellkerry I looked back at our original slack conversation.

Currently in this PR we're just generating a font-size-root token, given your changes above on line 21. If we want to additionally add a vads-font-size-root token, then another entry needs to be added here in the vads-font.size object, similar to what you've added above for source-sans-normalized. Adding a "root": {"value": "1rem"} entry here should generate a token named vads-font-size-root.

"body": {
"large": { "value": "20px" },
"lead": { "value": "20px" },
Expand Down
Loading