refactor(ui): use design tokens instead of hardcoded colors on new lo…#14998
Open
ksitton58 wants to merge 1 commit into
Open
refactor(ui): use design tokens instead of hardcoded colors on new lo…#14998ksitton58 wants to merge 1 commit into
ksitton58 wants to merge 1 commit into
Conversation
Contributor
|
Re-kicking that one test... |
Contributor
|
@ksitton58 BTW, you can get the tests to rekick (though it's all of them) if you close and reopen the PR |
…gin page The new Tailwind login page hardcoded hex color values that exactly duplicate the design tokens defined in components/tailwind.css. Swap them for the corresponding var(--color-*) tokens so the page stays in sync with the design system if the palette changes. The token values are identical to the previously hardcoded hex, so there is no visual change. The control-label color (#333333) and the alpha-channel rgba() shadows are left as-is since they have no exact token equivalent.
ksitton58
force-pushed
the
fix/login-page-semantic-color-tokens
branch
from
34bce93 to
bf8b784
Compare
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Description
The new Tailwind login page (
dojo/templates/dojo/login.html) hardcoded hexcolor values that exactly duplicate the design tokens defined in
components/tailwind.css(@theme). This swaps them for the correspondingvar(--color-*)tokens so the login page stays in sync with the design systemif the palette ever changes, instead of silently drifting.
The compiled token values are byte-identical to the hex they replace, so there
is no visual change:
#e8f3fb,#f7f8f9,#fff(gradient)--color-dd-primary-50,--color-surface-2,--color-surface#191919/#666666--color-text/--color-text-muted#DCDCDC--color-border#1779C5/#204D87--color-dd-primary-500/--color-dd-primary-700#333333(control label) and the alpha-channelrgba()shadows are left as-issince they have no exact token equivalent.
Test results
Ran the new UI locally (docker dev stack) and loaded
/login. Verified thepage renders identically and that each token resolves to the exact RGB of the
hex it replaced (e.g. Login button computes
rgb(23,121,197)=#1779C5,title
rgb(25,25,25)=#191919, input borderrgb(220,220,220)=#DCDCDC).No functional/Python changes, so no unit tests added.
Documentation
N/A — no behavior or documented feature changes.
Checklist
dev(this is a change, not a bugfix).