Skip to content

Commit

Permalink
💄(react) update Alert and Toast icon size
Browse files Browse the repository at this point in the history
We realized that even if the Figma sketches indicates that the icons
are 16px in reality the rendered DOM was not visualy matching the
sketches. We needs 19px to match the sketches.
  • Loading branch information
NathanVss committed Jan 8, 2024
1 parent 5c5964c commit 540cdc6
Show file tree
Hide file tree
Showing 7 changed files with 13 additions and 8 deletions.
5 changes: 5 additions & 0 deletions .changeset/olive-coats-smile.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"@openfun/cunningham-react": patch
---

update Alert and Toast icon size
2 changes: 1 addition & 1 deletion packages/react/src/components/Alert/tokens.ts
Original file line number Diff line number Diff line change
Expand Up @@ -6,7 +6,7 @@ export const tokens = (defaults: DefaultTokens) => {
"border-radius": "4px",
"font-weight": defaults.theme.font.weights.medium,
color: defaults.theme.colors["greyscale-900"],
"icon-size": defaults.theme.font.sizes.l,
"icon-size": "19px",
"additional-font-weight": defaults.theme.font.weights.regular,
"additional-color": defaults.theme.colors["greyscale-700"],
};
Expand Down
2 changes: 1 addition & 1 deletion packages/react/src/components/Toast/tokens.ts
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ export const tokens = (defaults: DefaultTokens) => {
"background-color": defaults.theme.colors["greyscale-100"],
color: defaults.theme.colors["greyscale-900"],
"font-weight": defaults.theme.font.weights.regular,
"icon-size": defaults.theme.font.sizes.l,
"icon-size": "19px",
"progress-bar-height": "3px",
};
};
4 changes: 2 additions & 2 deletions packages/react/src/cunningham-tokens.css
Original file line number Diff line number Diff line change
Expand Up @@ -117,7 +117,7 @@
--c--components--toast--background-color: var(--c--theme--colors--greyscale-100);
--c--components--toast--color: var(--c--theme--colors--greyscale-900);
--c--components--toast--font-weight: var(--c--theme--font--weights--regular);
--c--components--toast--icon-size: var(--c--theme--font--sizes--l);
--c--components--toast--icon-size: 19px;
--c--components--toast--progress-bar-height: 3px;
--c--components--forms-textarea--font-weight: var(--c--theme--font--weights--regular);
--c--components--forms-textarea--font-size: var(--c--theme--font--sizes--l);
Expand Down Expand Up @@ -261,7 +261,7 @@
--c--components--alert--border-radius: 4px;
--c--components--alert--font-weight: var(--c--theme--font--weights--medium);
--c--components--alert--color: var(--c--theme--colors--greyscale-900);
--c--components--alert--icon-size: var(--c--theme--font--sizes--l);
--c--components--alert--icon-size: 19px;
--c--components--alert--additional-font-weight: var(--c--theme--font--weights--regular);
--c--components--alert--additional-color: var(--c--theme--colors--greyscale-700);
}
Expand Down
2 changes: 1 addition & 1 deletion packages/react/src/cunningham-tokens.js

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

4 changes: 2 additions & 2 deletions packages/react/src/cunningham-tokens.scss
Original file line number Diff line number Diff line change
Expand Up @@ -140,7 +140,7 @@ $themes: (
'background-color': #FAFAFB,
'color': #0C1A2B,
'font-weight': 400,
'icon-size': 1rem,
'icon-size': 19px,
'progress-bar-height': 3px
),
'forms-textarea': (
Expand Down Expand Up @@ -308,7 +308,7 @@ $themes: (
'border-radius': 4px,
'font-weight': 500,
'color': #0C1A2B,
'icon-size': 1rem,
'icon-size': 19px,
'additional-font-weight': 400,
'additional-color': #555F6B
)
Expand Down
Loading

0 comments on commit 540cdc6

Please sign in to comment.