Update UI to better indicate that a block is reusable #5720
Conversation
noisysocks
added
[Type] Enhancement
noisysocks
added
[Feature] Synced Patterns
There was a problem hiding this comment.
Visually this seems a little unbalanced with a caption. I think though it's ok to have as not all pictures will have one. I think a solid default over having it work specifically for captions is probably best. Let's get it in and iterate if it continues to feel weird.
components/dashicon/index.js
Outdated
| @@ -892,7 +892,9 @@ export default class Dashicon extends wp.element.Component { | |||
| height={ size } | |||
| viewBox="0 0 20 20" | |||
| > | |||
| <path d={ path } /> | |||
| <path d={ path }> | |||
| { title && <title>{ title }</title> } | |||
There was a problem hiding this comment.
Hmm, I don't know enough about whether this is something we actually want. Can you explain context for adding this title?
cc @afercia
There was a problem hiding this comment.
I added it so that curious users can hover their cursor over the icon and get a little explanatory tooltip:
There was a problem hiding this comment.
Should we use the <Tooltip /> component instead for consistency?
Make it more obvious that a block is reusable by: - Making reusable blocks *always* have a dashed outline - Badging the block with an icon in the bottom right corner
noisysocks
force-pushed
the
update/add-reusable-block-indicator
branch
from
6de68cc to
7164afb
Compare
|
I'm noticing that this effect is also incorrectly shown in the inserter menu:
|
|
Good catch. #5810 hides the indicator in the preview component. |
Fixes #5225.
Makes it more obvious that a block is reusable by: