Unify styling of widget action icons #8064
Merged
Conversation
This file contains 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
linuspahl
commented
May 11, 2020
|
|
||
| IconButton.propTypes = { | ||
| title: PropTypes.string, | ||
| onClick: PropTypes.func, |
There was a problem hiding this comment.
I considered requiring the onClick prop, but e.g. in ReplaySearchButton we need to wrap the button with a link, because we can't open the page in another tab with history.push()
9 tasks
|
Looks a bit different then how you described it. I like it, let's discuss it.
|
|
@kmerz Looks like this is happening with Firefox, because of the user agent stylesheet. For now I removed the background color, but I am still open for a discussion. I prefer not displaying a background color, because currently the focus is on the widgets content when having a look at a widget grid. A background color would slightly attract this focus, in my opinion. |
* Unify styling by implementing IconButton component * Add titles * Refactor widget actions toolbar grid
… cycles in common components index file
… to avoid eslint-disable for dependency cycles
|
Fat border after clicking: |
kmerz
approved these changes
Jun 4, 2020
4 tasks
linuspahl
added a commit
that referenced
this pull request
Jun 11, 2020
* Unify widget action buttons styling * Unify styling by implementing IconButton component * Add titles * Refactor widget actions toolbar grid * Update snapshot * Remove not needed link role * Disable eslint warning for IconButton and PageErrorOverview dependecy cycles in common components index file * Import common components directly in PageErrorOverview and IconButton to avoid eslint-disable for dependency cycles * Remove background color of IconButtons for Firefox * Update snapshots * Add missing semicolon in Widget.jsx * Updating snapshots
4 tasks
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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.
This PR unifies the widget action icons styling by implementing an
IconButtoncomponent.This includes styling the hover / focus state, adding titles, and refactoring the widget actions bar grid.
Before:
After:
Types of changes
Checklist: