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.

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

style(tokens): new token sets for core, semantic, and branding #318

Open
wants to merge 71 commits into
base: main
Choose a base branch
from
Open
Changes from 1 commit
Commits
Show all changes
71 commits
Select commit Hold shift + click to select a range
cdaa8e4
style: create new core tokenset
dev-kjbot Oct 29, 2024
1cda9af
style: change font-weight to use numerical values in core tokenset
dev-kjbot Oct 29, 2024
624fc1c
style: adds half of semantic tokens
dev-kjbot Oct 29, 2024
7f40bd5
style: adds the second half of the semantic tokens
dev-kjbot Oct 29, 2024
21d1eea
style: add kajabi products themes and mode (light and dark)
dev-kjbot Oct 29, 2024
b782987
feat: add sd-transformations to generate tokens from token-studio
ju-Skinner Oct 29, 2024
367d60e
style(transform): refactor transform scripts to be more modular
ju-Skinner Oct 30, 2024
6b677bf
style: update themes to include component/avatar
dev-kjbot Oct 30, 2024
bb83584
style: remove old core and semantic tokens
dev-kjbot Oct 30, 2024
265fedc
style: changes for brand semantic and modes
dev-kjbot Oct 31, 2024
1d9aa55
style(tokens): working version of token studio to figma variables wit…
dev-kjbot Nov 1, 2024
7ba1f72
style(tokens): add color.brand to kajabi semantic tokens
dev-kjbot Nov 6, 2024
657f952
style(tokens): cleanup semantic tokens and a few core tokens for dime…
dev-kjbot Nov 6, 2024
cb98e75
style(tokens): newly generated tokens from style dictionary
ju-Skinner Nov 6, 2024
ec8901f
style(tokens): restructure semantic brand token names and locations
ju-Skinner Nov 7, 2024
f5d5e5d
style(button): update styles to use semantic tokens
ju-Skinner Nov 7, 2024
44dc49d
style(token-studio): update tokens
dev-kjbot Nov 7, 2024
833cce8
style(tokens): generate new style sheets from sd-transforms
ju-Skinner Nov 7, 2024
6d37418
style(avatar): clean up testing of component semantic level tokens
ju-Skinner Nov 7, 2024
6723bcb
style(application): add a the brand semantic style sheet for testing
ju-Skinner Nov 7, 2024
437b661
style(token-studio): remove border-radius default and none
dev-kjbot Nov 8, 2024
446a9db
style(token-studio): add font-family semantic tokens
dev-kjbot Nov 8, 2024
6190959
style(token-studio): adds color.background.container.hover semantic t…
dev-kjbot Nov 8, 2024
ddf70fc
style(tokens): update the semantic tokens by running build.tokens
ju-Skinner Nov 8, 2024
30e5569
style(token-studio): add line-spacing for headings and new dimension …
dev-kjbot Nov 12, 2024
4677778
style(button): change styles to use semantic tokens (#288)
ju-Skinner Nov 13, 2024
17998d4
style(checkbox): change or remove CSS Custom props to use semantic to…
ju-Skinner Nov 13, 2024
c120027
style(divider): change tokens to use new semantic tokens from token s…
ju-Skinner Nov 13, 2024
749e17d
style(copytext): update copytext tokens (#293)
anechol Nov 13, 2024
03407ef
style(token-studio): add fallback for font-families Greet and Inter
dev-kjbot Nov 13, 2024
b08468d
style(accordion): update accordion tokens (#292)
anechol Nov 13, 2024
a7bd66a
style(token-studio): update sentiment colors to *-100 colors
ju-Skinner Nov 13, 2024
d3206eb
style: updates component with semantic tokens (#297)
anechol Nov 13, 2024
b720be4
style: updates component with semantic tokens (#298)
anechol Nov 13, 2024
aff72f8
style(input): update input component to use new semantic tokens (#299)
ju-Skinner Nov 13, 2024
509b8e7
style(loader): change css properties to use semantic tokens (#300)
ju-Skinner Nov 13, 2024
21aec5b
style(progress): change progress css custom props to become semantic …
ju-Skinner Nov 14, 2024
1e0790d
style(tooltip): updates component with semantic tokens (#302)
anechol Nov 14, 2024
08f843b
style(radio): change radio component to use new semantic tokens (#303)
ju-Skinner Nov 14, 2024
915ee32
style(tabs): updates component with semantic tokens (#306)
anechol Nov 14, 2024
7e4cbc5
style(switch): updates component with semantic tokens (#308)
anechol Nov 14, 2024
8d34f9c
style(box): use semantic tokens in box stylesheet (#304)
ju-Skinner Nov 14, 2024
953bbb1
style(sortable): change tokens to use semantic tokens (#305)
ju-Skinner Nov 14, 2024
e2d8383
style(table): change css custom props to use semantic tokens (#309)
ju-Skinner Nov 15, 2024
d16a474
style(chip): change css props to use semantic tokens (#312)
ju-Skinner Nov 15, 2024
c1bcb1d
chore: removes base css file from components (#313)
anechol Nov 15, 2024
989cefe
style(avatar): clean up missing semantic tokens
ju-Skinner Nov 18, 2024
fd8cf6e
style(button): change text color to match their variant
ju-Skinner Nov 18, 2024
ed846e0
style(token-studio): change sentiment colors to use *-500
ju-Skinner Nov 18, 2024
39fb137
style(token-studio): create semantic tokens for chip
dev-kjbot Nov 18, 2024
39015f7
style(token-studio): refactor component generator
ju-Skinner Nov 19, 2024
6a6f560
style(tokens-studio): remove avatar semantic tokens
dev-kjbot Nov 19, 2024
26b6535
style(tokens): refactor sd-tranforms to read component names from tok…
ju-Skinner Nov 19, 2024
dd8f7a3
style(box): refactor to use new semantic tokens (#319)
ju-Skinner Nov 20, 2024
4459c5c
fix: update incorrect core color token values (#322)
pixelflips Dec 2, 2024
c2e2dd6
style: updates some components with semantic tokens (#325)
anechol Dec 3, 2024
0137230
style(tokens-studio): update background container disabled token
ju-Skinner Dec 10, 2024
66d6b50
style(input): sync styles for readonly and disabled label and input e…
ju-Skinner Dec 11, 2024
86b2e27
style(textarea): sync styles for readonly and disabled label and text…
ju-Skinner Dec 11, 2024
0c5b75f
refactor(label): moves label to a style utils
ju-Skinner Dec 11, 2024
066fec9
style(textarea): refactor to use utils/label.scss
ju-Skinner Dec 11, 2024
5c69f0f
style(fonts): add Greet Condensed font family
ju-Skinner Jan 14, 2025
f222bf8
test: fix failling specs for readonly components
ju-Skinner Jan 14, 2025
701b8f3
style: update line-heights to percentage
ju-Skinner Jan 16, 2025
390b71e
style: update Font Family's to match the system installed font name
ju-Skinner Jan 16, 2025
b083bda
style: update references for Figma
dev-kjbot Jan 16, 2025
b6c8720
style: refactor border-radius to dimension
ju-Skinner Jan 22, 2025
8177304
style: token studio changes
dev-kjbot Jan 22, 2025
a714266
style: add new typography tokens for body and body-sm
dev-kjbot Jan 23, 2025
d456c9f
style: update line-height to unit-less
dev-kjbot Jan 24, 2025
43d40f5
style(fonts): fix misspelling of sprig filename variable
ju-Skinner Jan 27, 2025
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
Prev Previous commit
Next Next commit
style(button): change text color to match their variant
ju-Skinner committed Jan 14, 2025
commit fd8cf6e17d0ec8ff7deb52f317bca0469255f2d0
8 changes: 4 additions & 4 deletions libs/core/src/components/pds-button/pds-button.scss
Original file line number Diff line number Diff line change
@@ -61,17 +61,17 @@
--color-background-default: var(--pine-color-accent);
--color-background-hover: var(--pine-color-accent-hover);
--color-background-disabled: var(--pine-color-accent-disabled);
--color-text-default: var(--pine-color-text-primary);
--color-text-disabled: var(--pine-color-text-primary-disabled);
--color-text-default: var(--pine-color-text-accent);
--color-text-disabled: var(--pine-color-text-accent-disabled);
--color-outline: var(--pine-color-focus-ring);
}

.pds-button--destructive {
--color-background-default: var(--pine-color-danger);
--color-background-hover: var(--pine-color-danger-hover);
--color-background-disabled: var(--pine-color-danger-disabled);
--color-text-default: var(--pine-color-text-primary);
--color-text-disabled: var(--pine-color-text-primary-disabled);
--color-text-default: var(--pine-color-text-danger);
--color-text-disabled: var(--pine-color-text-danger-disabled);
--color-outline: var(--pine-color-focus-ring-danger);

&:focus-visible {