-
Notifications
You must be signed in to change notification settings - Fork 618
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
New Admin UI - Link Component #4440
Conversation
This one is ready for review. The only thing I need to adjust is the [3px] ring size. Don't have a token for this, gonna get it probably next week since Kreso is absent tomo. |
|
||
const linkVariants = cva("font-sans rounded-xs", { | ||
variants: { | ||
size: { |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I'm not sure we need a size
variant: the font size of a link should be inherited from its parent; otherwise, we would end up in this situation:
<Text size="lg">Lorem ipsum with <Link size="lg">link</Link> text.</Text>
declaring the size
prop twice.
Changes
This PR introduces the Link component.
Extra Changes
1. Default Text/Link Styles
I updated the
theme.scss
file and added default styles for all text and links that were not rendered via Text/Link components, respectively. I tested this manually then in Admin area.Previously, we had this:
2. Alert Links
Once I've added default styles for links, link in Alert boxes did not look as it's defined in Figma (links basically have the same styles as the text in the alert, except they're also bolded and underlined). So, I have to add a couple classes in there as well to preserve this.
3. Updated Tokens
I reimported tokens from Figma.
4. Colors With Alpha Were Still Imported
There were a couple color categories where ignoring colors with alpha/transparency was not added.
Those categories were:
fill
,ringColor
, andtextColor
.How Has This Been Tested?
Manually.
Documentation
Changelog.