fix[button]: component audit
See original GitHub issuefix[button]: component audit
-
Buttons should use tokens for colors, not call out to
ibm-color
variables directly -
Ghost button needs to have 16 px in these areas as speced; remove the minimum width rule from only our ghost buttons to acheive this (See spec)
-
Remove dark boarder around secondary button on hover (there should be no visible boarder based on design spec)
-
Fix small secondary button hover state too, it has the same problem as the large one with the dark boarder on hover
Issue Analytics
- State:
- Created 5 years ago
- Comments:8 (7 by maintainers)
Top Results From Across the Web
WP components audit: Button Group & Toolbar #16514 - GitHub
Opportunities I came across while reviewing this component. Based on the name, I expected a simple group of buttons, each with its own...
Read more >audit the button-reset and button-link styles - WordPress Trac
Buttons styles: audit the button-reset and button-link styles ... Each component introduced its own class, so there's some duplication and potential ...
Read more >Design system audit
Design System audits can be a great way to display an interface as a system of components rather than a series of discrete...
Read more >What's a UI Design Audit and why you should do one - YouTube
So the clues in the name really, a UI audit is the process of looking at all your UI elements of your website....
Read more >UX Audits - Use Actionable Plans to Fix Bad UX - Headway.io
Create a clear actionable plan with our UX audit process, checklist, and report templates. Learn how to improve your product's user ...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
@emyarod Danger button tokens:
$text-04
(if there’s an icon, it would be $icon-03)
core background color: $support-01
hover color: $hover-danger
active state: $active-danger
Quick spec fix for ghost button – @laurenmrice has also updated it in the kit
there is 8px of space between the 16px icon and the type (not 4px)
remove extra right padding on ghost button hover… it only has 16px of padding after the icon