Popover's arrow padding-box support
Steps to reproduce
- Create Gtk.Popover
- Give it a background color that's different than the background on which it's shown
- Use
background-clip: padding-box
; - Give it a transparent border
I've made a simple example: https://github.com/peteruithoven/popover-arrow-border-transparency
You can also use GtkInspector to apply the following CSS to the gtk3-widget-factory
:
popover,
popover.osd,
.popover,
.popover.osd {
background-clip: padding-box;
border-radius: 4px;
border: 2px solid alpha (#f00, 0.5);
background-color: #fff; /* gives inconsistent border */
/* background-color: transparent; */ /* gives consistent border */
box-shadow: none;
margin: 10px 6px;
text-shadow: none;
}
text {
background-color: #000;
}
Current behaviour
You'll notice that the border around the arrow part of the Popover will have a different appearance. Screenshot from my example:
I first noticed this in elementary OS's Applications menu:
Expected outcome
The border appearance should be consistent.
Version information
GTK: libgtk-3-0/bionic,now 3.22.30-1ubuntu1
OS: elementary OS 5.0 Juno (Built on Ubuntu 18.04 LTS)
Additional information
It looks like the background-clip: padding-box;
isn't affecting the arrow. It's background is still overlapping the border. The border appearance is consistent when using a transparent background:
Please let me know if I can provide additional information.