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

fix(border, text): add border and text tokens #261

Merged
merged 9 commits into from
Apr 4, 2024
+15 −6
Merged

fix(border, text): add border and text tokens #261

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
e87ee65
fix(border): add color-border-inverse token
portikM Apr 3, 2024
12db08e
fix(navigation): fix white rgba tokens
portikM Apr 3, 2024
c235168
fix(border): formatting fix
portikM Apr 3, 2024
27cf9ff
fix(text): add color-text-primary-weak token
portikM Apr 3, 2024
f6b9e9d
fix(border): add color-border-neutral token
portikM Apr 3, 2024
e9dcdef
fix(border): remove color-border-neutral token
portikM Apr 3, 2024
7614b1e
fix(background): add color-background-overlay-inverse token
portikM Apr 3, 2024
1aa3acc
fix(background): remove color-background-overlay-inverse token
portikM Apr 4, 2024
fb199c9
Merge branch 'main' into fix/border-inverse-token
portikM Apr 4, 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
1 change: 1 addition & 0 deletions tokens/alias/color/index.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -306,6 +306,7 @@
},
"white": {
"comment": "Alias for #FFF.",
"rgb": "255, 255, 255",
"value": "#FFF"
},
"yellow": {
Expand Down
4 changes: 4 additions & 0 deletions tokens/source/color/border.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -45,6 +45,10 @@
"comment": "Border color for disabled elements (gray.20).",
"value": "{color.alias.gray.20.value}"
},
"inverse": {
"comment": "Inverse border color (rgba(white, 0.2)).",
"value": "rgba({color.alias.white.rgb}, 0.2)"
},
"neutral": {
"weak": {
"comment": "Weak border color for neutral elements (gray.40)",
Expand Down
4 changes: 4 additions & 0 deletions tokens/source/color/text.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -85,6 +85,10 @@
"strongest": {
"comment": "Strongest text color for primary actions or messages (blue.90).",
"value": "{color.alias.blue.90.value}"
},
"weak": {
"comment": "Weak text color for primary actions or messages (blue.40).",
"value": "{color.alias.blue.40.value}"
}
},
"success": {
Expand Down
12 changes: 6 additions & 6 deletions tokens/source/components/navigation.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,21 +8,21 @@
},
"selected": {
"comment": "The background color of a selected navigation item.",
"value": "rgba(255, 255, 255, 0.12)"
"value": "rgba({color.alias.white.rgb}, 0.12)"
}
},
"border": {
"_": {
"comment": "rgba(255, 255, 255, 0.12)",
"value": "rgba(255, 255, 255, 0.12)"
"comment": "rgba(white, 0.12)",
"value": "rgba({color.alias.white.rgb}, 0.12)"
},
"child": {
"comment": "The border color for a selected child navigation item.",
"value": "{color.alias.green.30.value}"
},
"divider": {
"comment": "The color of the navigation section divider.",
"value": "rgba(255, 255, 255, 0.24)"
"value": "rgba({color.alias.white.rgb}, 0.24)"
}
},
"text": {
Expand All @@ -48,7 +48,7 @@
"border": {
"_": {
"comment": "The box-shadow for a focus-visible navigation link.",
"value": "0 0 0 1px rgba(255, 255, 255, 0.12) inset"
"value": "0 0 0 1px rgba({color.alias.white.rgb}, 0.12) inset"
},
"child": {
"comment": "The left box-shadow for an active child navigation link.",
Expand All @@ -57,7 +57,7 @@
},
"focus": {
"comment": "Navigation link focus-visible box-shadow.",
"value": "0 0 0 1px rgba(255, 255, 255, 0.60) inset"
"value": "0 0 0 1px rgba({color.alias.white.rgb}, 0.60) inset"
}
}
}
Expand Down