experiment: add popover base styles and visual tests #9638
Conversation
|
Focusing the popover with keyboard shows an outline that seems a bit broken and not aligned with the focus ring in the base theme. I checked in Lumo, and there's no focus ring when the popover is focused by keyboard. Should we remove the outline, change it, or keep it this way?
|
web-padawan
force-pushed
the
experiment/base-popover
branch
from
799daf9 to
fe0e654
Compare
|
@DiegoCardoso Thanks, added missing styles and updated arrow to adapt to the outline. Also added visual tests. |
|
I have some improvements in the works, I'll continue with them on Monday. |
|
|
I ended up partially refactoring how the arrow is rendered. It’s now clipped to not overlap the content, so we don't need positioning and z-index. Here’s an illustration of how the clip-path works, to make it easier to grok the code: The shadow ends up getting rotated as well, so it’s not going to be 100% accurate. But it’s mostly to cover the case when the overlay part's border is implemented with a semi-transparent 1px outer box-shadow. We’d need direction-specific box-shadows to make it perfect, but that’s up to theme implementations to consider if it’s worth it. |
|
This ticket/PR has been released with Vaadin 25.0.0-alpha3. |
Description
Depends on #9631
Type of change