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
fix(Box): improve border CSS rendering #1334
base: main
Are you sure you want to change the base?
Conversation
|
The latest updates on your projects. Learn more about Vercel for Git ↗︎
|
4cc0801
to
0a9d006
Compare
Size Change: -235 B (0%) Total Size: 547 kB
ℹ️ View Unchanged
|
0a5baf7
to
0493d3d
Compare
background={background} | ||
borderColor="neutral200" |
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.
Every component that inherits from BaseButton
does set these properties explicitly.
0493d3d
to
6fc0156
Compare
6fc0156
to
aba5e84
Compare
What does it do?
Improves rendering of borders. The previous behavior seems very inconsistent to me and is hart to maintain, as several CSS properties interfere with each other.
This is more of a discussion starter, because I am not sure if we want to implement this in v1 since there is a chance this breaks a few components.
Why is it needed?
I think we can assume we can render a
1px solid
border, if:border-width
ANDborder-color
is set (border-style: solid)border-color
is set (border-width: 1px, border-style: solid)border-color
ANDborder-style
is set (border-width: 1px)Simplified: we can assume a border of
1px solid
as soon as at leastborder-color
is set.borderStyle
andborderWidth
would overwrite the style / width.