AuroraMiddleware/gtk2
1
0
Fork 0
forked from AuroraMiddleware/gtk
Code Issues Pull Requests Projects Releases Wiki Activity

Adwaita: Fix color of focus outline on colorswatch

Browse Source 
The focus outline disappeared as the colour of the swatch got close to
the normal focus outline colour, which is alpha(currentColor, 0.3).

Fix by making the outline an alpha’d version of the tick colour, but
more opaque than normal outlines. 0.6 seems good enough; feel free to
improve it, but at least this ensures the outline can’t vanish anymore.

HighContrast achieves this already because it applies the color property
to the main node, not the overlay. Doing that means the outline is fully
opaque, which is fine for HC obviously but was excessive for Adwaita.

https://bugzilla.gnome.org/show_bug.cgi?id=787757
This commit is contained in:
Daniel Boles 2017-09-16 17:02:24 +01:00
parent 7c809cfb73
commit f714500b8d
3 changed files with 24 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
gtk/theme/Adwaita/_common.scss
View File

@ -4079,21 +4079,29 @@ colorswatch {
}
}
&.dark overlay {
&.dark {
outline-color: transparentize(white, 0.4);
overlay {
color: white;
&:hover { border-color: if($variant == 'light', transparentize(black, 0.2), $borders_color); }
&:backdrop { color: transparentize(white, 0.5); }
}
}
&.light overlay {
&.light {
outline-color: transparentize(black, 0.4);
overlay {
color: black;
&:hover { border-color: if($variant == 'light', transparentize(black, 0.5), $borders_color); }
&:backdrop { color: transparentize(black, 0.5); }
}
}
&:drop(active) {
box-shadow: none;

4
gtk/theme/Adwaita/gtk-contained-dark.css
View File

@ -1760,12 +1760,16 @@ colorswatch.right, colorswatch:last-child:not(.bottom) { border-top-right-radius
colorswatch.right overlay, colorswatch:last-child:not(.bottom) overlay { border-top-right-radius: 5px; border-bottom-right-radius: 5px; }
colorswatch.dark { outline-color: rgba(255, 255, 255, 0.6); }
colorswatch.dark overlay { color: white; }
colorswatch.dark overlay:hover { border-color: #1b1f20; }
colorswatch.dark overlay:backdrop { color: rgba(255, 255, 255, 0.5); }
colorswatch.light { outline-color: rgba(0, 0, 0, 0.6); }
colorswatch.light overlay { color: black; }
colorswatch.light overlay:hover { border-color: #1b1f20; }

4
gtk/theme/Adwaita/gtk-contained.css
View File

@ -1780,12 +1780,16 @@ colorswatch.right, colorswatch:last-child:not(.bottom) { border-top-right-radius
colorswatch.right overlay, colorswatch:last-child:not(.bottom) overlay { border-top-right-radius: 5px; border-bottom-right-radius: 5px; }
colorswatch.dark { outline-color: rgba(255, 255, 255, 0.6); }
colorswatch.dark overlay { color: white; }
colorswatch.dark overlay:hover { border-color: rgba(0, 0, 0, 0.8); }
colorswatch.dark overlay:backdrop { color: rgba(255, 255, 255, 0.5); }
colorswatch.light { outline-color: rgba(0, 0, 0, 0.6); }
colorswatch.light overlay { color: black; }
colorswatch.light overlay:hover { border-color: rgba(0, 0, 0, 0.5); }