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

Adwaita: Use transparent black for window border in dark too

Browse Source 
Avoid smear when the background behind the window is dark. Adjust opacity
to make it appear roughly the same as before on white background.
This commit is contained in:
Alexander Mikhaylenko 2021-03-05 22:42:52 +05:00
parent 782bbca52c
commit d70fa89bdf
3 changed files with 21 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -2324,7 +2324,7 @@ popover.background {
}
.csd & {
$_popover_border: if($variant=='light', transparentize(black, 0.77), transparentize($borders_color, 0.1));
$_popover_border: if($variant=='light', transparentize(black, 0.77), transparentize(black, 0.25));
background-clip: padding-box;
border-color: $_popover_border;
@ -4556,8 +4556,8 @@ decoration {
// this needs to be transparent
// see bug #722563
$_wm_border: if($variant=='light', transparentize(black, 0.77), transparentize($borders_color, 0.1));
$_wm_border_backdrop: if($variant=='light', transparentize(black, 0.82), transparentize($borders_color, 0.1));
$_wm_border: if($variant=='light', transparentize(black, 0.77), transparentize(black, 0.25));
$_wm_border_backdrop: if($variant=='light', transparentize(black, 0.82), transparentize(black, 0.25));
box-shadow: 0 3px 9px 1px transparentize(black, 0.5),
0 0 0 1px $_wm_border; //doing borders with box-shadow

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

@ -822,7 +822,7 @@ popover.background { padding: 2px; background-color: #353535; box-shadow: 0 1px
.csd popover.background, popover.background { border: 1px solid #1b1b1b; border-radius: 9px; }
.csd popover.background { background-clip: padding-box; border-color: rgba(27, 27, 27, 0.9); }
.csd popover.background { background-clip: padding-box; border-color: rgba(0, 0, 0, 0.75); }
popover.background:backdrop { background-color: #353535; box-shadow: none; }
@ -1834,27 +1834,27 @@ colorchooser .popover.osd { border-radius: 5px; }
.scale-popup button:hover { background-color: rgba(238, 238, 236, 0.1); border-radius: 5px; }
/********************** Window Decorations * */
decoration { border-radius: 8px 8px 0 0; border-width: 0px; box-shadow: 0 3px 9px 1px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(27, 27, 27, 0.9); margin: 10px; }
decoration { border-radius: 8px 8px 0 0; border-width: 0px; box-shadow: 0 3px 9px 1px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(0, 0, 0, 0.75); margin: 10px; }
decoration:backdrop { box-shadow: 0 3px 9px 1px transparent, 0 2px 6px 2px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(27, 27, 27, 0.9); transition: 200ms ease-out; }
decoration:backdrop { box-shadow: 0 3px 9px 1px transparent, 0 2px 6px 2px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(0, 0, 0, 0.75); transition: 200ms ease-out; }
.maximized decoration, .fullscreen decoration { border-radius: 0; box-shadow: none; }
.tiled decoration, .tiled-top decoration, .tiled-right decoration, .tiled-bottom decoration, .tiled-left decoration { border-radius: 0; box-shadow: 0 0 0 1px rgba(27, 27, 27, 0.9), 0 0 0 20px transparent; }
.tiled decoration, .tiled-top decoration, .tiled-right decoration, .tiled-bottom decoration, .tiled-left decoration { border-radius: 0; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.75), 0 0 0 20px transparent; }
.tiled decoration:backdrop, .tiled-top decoration:backdrop, .tiled-right decoration:backdrop, .tiled-bottom decoration:backdrop, .tiled-left decoration:backdrop { box-shadow: 0 0 0 1px rgba(27, 27, 27, 0.9), 0 0 0 20px transparent; }
.tiled decoration:backdrop, .tiled-top decoration:backdrop, .tiled-right decoration:backdrop, .tiled-bottom decoration:backdrop, .tiled-left decoration:backdrop { box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.75), 0 0 0 20px transparent; }
.popup decoration { box-shadow: none; }
.ssd decoration { box-shadow: 0 0 0 1px rgba(27, 27, 27, 0.9); }
.ssd decoration { box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.75); }
.ssd decoration:backdrop { box-shadow: 0 0 0 1px rgba(27, 27, 27, 0.9); }
.ssd decoration:backdrop { box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.75); }
.csd.popup decoration { border-radius: 5px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(27, 27, 27, 0.8); }
.csd.popup decoration { border-radius: 5px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(0, 0, 0, 0.65); }
tooltip.csd decoration { border-radius: 5px; box-shadow: none; }
messagedialog.csd decoration { border-radius: 8px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(27, 27, 27, 0.8); }
messagedialog.csd decoration { border-radius: 8px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(0, 0, 0, 0.65); }
.solid-csd decoration { margin: 0; padding: 4px; background-color: #1b1b1b; border: solid 1px #1b1b1b; border-radius: 0; box-shadow: inset 0 0 0 3px #2d2d2d, inset 0 1px rgba(238, 238, 236, 0.07); }

18
gtk/theme/HighContrast/gtk-contained-inverse.css
View File

@ -902,7 +902,7 @@ popover.background { padding: 2px; background-color: #353535; box-shadow: 0 1px
.csd popover.background, popover.background { border: 1px solid #686868; border-radius: 9px; }
.csd popover.background { background-clip: padding-box; border-color: rgba(104, 104, 104, 0.9); }
.csd popover.background { background-clip: padding-box; border-color: rgba(0, 0, 0, 0.75); }
popover.background:backdrop { background-color: #353535; box-shadow: none; }
@ -1914,27 +1914,27 @@ colorchooser .popover.osd { border-radius: 5px; }
.scale-popup button:hover { background-color: rgba(243, 243, 241, 0.1); border-radius: 5px; }
/********************** Window Decorations * */
decoration { border-radius: 8px 8px 0 0; border-width: 0px; box-shadow: 0 3px 9px 1px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(104, 104, 104, 0.9); margin: 10px; }
decoration { border-radius: 8px 8px 0 0; border-width: 0px; box-shadow: 0 3px 9px 1px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(0, 0, 0, 0.75); margin: 10px; }
decoration:backdrop { box-shadow: 0 3px 9px 1px transparent, 0 2px 6px 2px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(104, 104, 104, 0.9); transition: 200ms ease-out; }
decoration:backdrop { box-shadow: 0 3px 9px 1px transparent, 0 2px 6px 2px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(0, 0, 0, 0.75); transition: 200ms ease-out; }
.maximized decoration, .fullscreen decoration { border-radius: 0; box-shadow: none; }
.tiled decoration, .tiled-top decoration, .tiled-right decoration, .tiled-bottom decoration, .tiled-left decoration { border-radius: 0; box-shadow: 0 0 0 1px rgba(104, 104, 104, 0.9), 0 0 0 20px transparent; }
.tiled decoration, .tiled-top decoration, .tiled-right decoration, .tiled-bottom decoration, .tiled-left decoration { border-radius: 0; box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.75), 0 0 0 20px transparent; }
.tiled decoration:backdrop, .tiled-top decoration:backdrop, .tiled-right decoration:backdrop, .tiled-bottom decoration:backdrop, .tiled-left decoration:backdrop { box-shadow: 0 0 0 1px rgba(104, 104, 104, 0.9), 0 0 0 20px transparent; }
.tiled decoration:backdrop, .tiled-top decoration:backdrop, .tiled-right decoration:backdrop, .tiled-bottom decoration:backdrop, .tiled-left decoration:backdrop { box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.75), 0 0 0 20px transparent; }
.popup decoration { box-shadow: none; }
.ssd decoration { box-shadow: 0 0 0 1px rgba(104, 104, 104, 0.9); }
.ssd decoration { box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.75); }
.ssd decoration:backdrop { box-shadow: 0 0 0 1px rgba(104, 104, 104, 0.9); }
.ssd decoration:backdrop { box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.75); }
.csd.popup decoration { border-radius: 5px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(104, 104, 104, 0.8); }
.csd.popup decoration { border-radius: 5px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(0, 0, 0, 0.65); }
tooltip.csd decoration { border-radius: 5px; box-shadow: none; }
messagedialog.csd decoration { border-radius: 8px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(104, 104, 104, 0.8); }
messagedialog.csd decoration { border-radius: 8px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2), 0 0 0 1px rgba(0, 0, 0, 0.65); }
.solid-csd decoration { margin: 0; padding: 4px; background-color: #686868; border: solid 1px #686868; border-radius: 0; box-shadow: inset 0 0 0 3px #2d2d2d, inset 0 1px rgba(238, 238, 236, 0.07); }