Remove gnome shell border images (#240)

* Add color variables for border image drop shadow removal

* Remove border image drop shadow: modal dialog

* Remove border image drop shadow: panel button dropdown menu

* Remove border image drop shadow: OSD window

* Remove border image drop shadow: resize popup

* Remove border image drop shadow: window switcher

* Remove border image drop shadow: workspace switcher

* Remove border image drop shadow: notifications

* Remove border image drop shadow: looking glass

* Fix OSD/switcher/looking glass colors (always transparent, even on solid variants)

* Adjust notification margins

* Tweak switcher border color
master
drakkar1969 2019-05-13 10:15:39 +02:00 committed by David Mohammed
parent 484f24719c
commit bbbda50747
3 changed files with 152 additions and 42 deletions

View File

@ -0,0 +1,87 @@
<?xml version="1.0" encoding="UTF-8" standalone="no"?>
<!-- Created with Inkscape (http://www.inkscape.org/) -->
<svg
xmlns:osb="http://www.openswatchbook.org/uri/2009/osb"
xmlns:dc="http://purl.org/dc/elements/1.1/"
xmlns:cc="http://creativecommons.org/ns#"
xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
width="32"
height="32"
viewBox="0 0 32 32.000001"
id="svg6621"
version="1.1"
inkscape:version="0.92.4 5da689c313, 2019-01-14"
sodipodi:docname="message-icon.svg">
<defs
id="defs6623">
<linearGradient
id="selected_bg_color"
osb:paint="solid">
<stop
style="stop-color:#5294e2;stop-opacity:1;"
offset="0"
id="stop4138" />
</linearGradient>
<linearGradient
inkscape:collect="always"
xlink:href="#selected_bg_color"
id="linearGradient4140"
x1="2"
y1="1021.3622"
x2="2"
y2="1051.3622"
gradientUnits="userSpaceOnUse" />
</defs>
<sodipodi:namedview
id="base"
pagecolor="#ffffff"
bordercolor="#666666"
borderopacity="1.0"
inkscape:pageopacity="0.0"
inkscape:pageshadow="2"
inkscape:zoom="11.2"
inkscape:cx="-0.68428583"
inkscape:cy="17.181721"
inkscape:document-units="px"
inkscape:current-layer="layer1"
showgrid="true"
units="px"
inkscape:snap-bbox="true"
inkscape:bbox-paths="true"
inkscape:bbox-nodes="true"
inkscape:snap-bbox-edge-midpoints="true">
<inkscape:grid
type="xygrid"
id="grid7177" />
</sodipodi:namedview>
<metadata
id="metadata6626">
<rdf:RDF>
<cc:Work
rdf:about="">
<dc:format>image/svg+xml</dc:format>
<dc:type
rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
<dc:title />
</cc:Work>
</rdf:RDF>
</metadata>
<g
inkscape:label="Ebene 1"
inkscape:groupmode="layer"
id="layer1"
transform="translate(0,-1020.3622)">
<path
style="display:inline;opacity:1;fill:url(#linearGradient4140);fill-opacity:1;stroke:none;stroke-width:1.03279555;stroke-linecap:round;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:0.39215686"
d="M 1.5,1020.3622 H 2 v 32 H 1.5 c -0.831,0 -1.5,-0.7136 -1.5,-1.6 v -28.8 c 0,-0.8864 0.669,-1.6 1.5,-1.6 z"
id="rect4162"
inkscape:connector-curvature="0"
sodipodi:nodetypes="sccssss" />
</g>
</svg>

After

Width:  |  Height:  |  Size: 2.7 KiB

View File

@ -99,3 +99,19 @@ $wm_icon_bg: if($variant == 'light' and $darker == 'false', #90949E, #90939B);
$wm_icon_unfocused_bg: if($variant == 'light' and $darker == 'false', #B6B8C0, #666A74);
$wm_icon_hover_bg: if($variant == 'light' and $darker == 'false', #7A7F8B, #C4C7CC);
$wm_icon_active_bg: $selected_fg_color;
// Modal dialog colors
$modal_bg_color: if($variant =='light', #f5f6f7, #323644);
$modal_borders_color: $borders_color;
// Panel button dropdown menu colors
$panelmenu_bg_color: if($variant =='light', #ffffff, #383C4A);
$panelmenu_borders_color: $borders_color;
// OSD popup colors
$popup_bg_color: transparentize(#252A36, 0.05);
$popup_borders_color: transparentize(#0F1016, 0.3);
// Switcher colors
$switcher_bg_color: transparentize(#363945, 0.05);
$switcher_borders_color: transparentize(#161A26, 0.3);

View File

@ -215,11 +215,11 @@ StScrollBar {
.flashspot { background-color: white; }
.modal-dialog {
border-radius: 3px;
color: $fg_color;
background-color: transparentize($bg_color, 1);
border: none;
border-image: url("#{$asset_path}/misc/modal.svg") 9 9 9 67;
padding: 0 5px 6px 5px;
background-color: $modal_bg_color;
border: 1px solid $modal_borders_color;
box-shadow: 0 0 3px 1px rgba(0, 0, 0, 0.2);
.modal-dialog-content-box {
padding: 20px 10px 10px 10px;
@ -619,13 +619,13 @@ StScrollBar {
.popup-menu {
min-width: 15em;
color: $fg_color;
border-image: url("#{$asset_path}/menu/menu.svg") 9 9 9 9;
background-color: $panelmenu_bg_color;
.popup-menu-arrow { } //defined globally in the TOP BAR
.popup-sub-menu {
background: if($variant=='light', rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.15));
box-shadow: inset 0 -1px if($variant=='light', rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.15));
margin: 0 4px;
margin: 0;
.popup-menu-item.selected {
background-color: $selected_bg_color;
@ -638,20 +638,19 @@ StScrollBar {
.popup-menu-item {
spacing: 12px;
&:ltr { padding: .4em 3em .4em 0em; }
&:rtl { padding: .4em 0em .4em 3em; }
&:ltr { padding: .4em 2em .4em 0em; }
&:rtl { padding: .4em 0em .4em 2em; }
&:checked {
font-weight: normal;
background: none;
box-shadow: none;
border-image: url("#{$asset_path}/menu/submenu-open.svg") 9 9 9 9;
background: if($variant=='light', rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.15));
box-shadow: inset 0 1px if($variant=='light', rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.15));
}
&:active, &.selected {
color: $selected_fg_color;
background-color: transparent;
border-image: url("common-assets/menu/menu-hover.svg") 9 9 1 1;
background-color: $selected_bg_color;
box-shadow: none;
}
&:insensitive {
@ -667,7 +666,7 @@ StScrollBar {
}
//.popup-status-menu-item { font-weight: normal; color: pink; } //dunno what that is
&.panel-menu {
-boxpointer-gap: 0px;
-boxpointer-gap: 4px;
margin-bottom: 1.75em;
}
}
@ -679,12 +678,13 @@ StScrollBar {
}
.popup-menu-boxpointer {
-arrow-border-radius: 2px;
-arrow-background-color: rgba(0,0,0,0.0);
-arrow-border-radius: 3px;
-arrow-background-color: $panelmenu_bg_color;
-arrow-border-width: 1px;
-arrow-border-color: rgba(0,0,0,0.0);
-arrow-base: 0;
-arrow-border-color: $panelmenu_borders_color;
-arrow-base: 26px;
-arrow-rise: 0;
box-shadow: 0 0 3px 1px rgba(0, 0, 0, 0.2);
}
.candidate-popup-boxpointer {
@ -726,10 +726,10 @@ StScrollBar {
min-height: 64px;
color: $_shell_fg_color;
background: none;
border: none;
background: $popup_bg_color;
border: 1px solid $popup_borders_color;
border-radius: 5px;
border-image: url("common-assets/misc/osd.svg") 9 9 9 9;
box-shadow: 0 0 3px 1px rgba(0, 0, 0, 0.2);
.osd-monitor-label { @include fontsize($font-size * 3); }
@ -746,10 +746,10 @@ StScrollBar {
.resize-popup {
color: $osd_fg_color;
background: none;
border: none;
background: $popup_bg_color;
border: 1px solid $popup_borders_color;
border-radius: 5px;
border-image: url("common-assets/misc/osd.svg") 9 9 9 9;
box-shadow: 0 0 3px 1px rgba(0, 0, 0, 0.2);
padding: 12px;
}
@ -762,10 +762,10 @@ StScrollBar {
}
.switcher-list {
background: none;
border: none;
border-image: url("common-assets/misc/bg.svg") 9 9 9 9;
background: $switcher_bg_color;
border: 1px solid $switcher_borders_color;
border-radius: 3px;
box-shadow: 0 0 3px 1px rgba(0, 0, 0, 0.2);
padding: 20px;
&-item-container { spacing: 8px; }
@ -837,8 +837,10 @@ StScrollBar {
&-group { padding: 12px; }
&-container {
border-image: url("common-assets/misc/bg.svg") 9 9 9 9;
background-color: $switcher_bg_color;
border: 1px solid $switcher_borders_color;
border-radius: 3px;
box-shadow: 0 0 3px 1px rgba(0, 0, 0, 0.2);
padding: 20px;
padding-bottom: 24px;
}
@ -1337,24 +1339,28 @@ StScrollBar {
}
.message {
padding: 4px;
padding: 0;
color: $fg_color;
border-image: url("#{$asset_path}/misc/message.svg") 9 9 9 9;
background-color: if($variant=='light', rgba(0, 0, 0, 0.05), rgba(0, 0, 0, 0.15));
border: 1px solid if($variant=='light', rgba(0, 0, 0, 0.15), rgba(0, 0, 0, 0.30));
border-radius: 3px;
&:hover, &:focus {
color: $fg_color;
border-image: url("#{$asset_path}/misc/message-hover.svg") 9 9 9 9;
border-color: $selected_bg_color;
}
&:active {
color: $selected_fg_color;
border-image: url("#{$asset_path}/misc/message-active.svg") 9 9 9 9;
background-color: $selected_bg_color;
border-color: $selected_bg_color;
}
&-icon-bin {
padding: 8px 0px 8px 8px;
padding: 12px 0px 12px 12px;
border-image: url("common-assets/misc/message-icon.svg") 9 9 9 9;
&:rtl { padding: 8px 8px 8px 0px; }
&:rtl { padding: 12px 12px 12px 0px; }
> StIcon {
//icon-size: 32px;
@ -1959,12 +1965,12 @@ StScrollBar {
.notification-banner:focus {
@include fontsize($font-size);
width: 34em;
margin: 5px;
padding: 10px;
margin: 10px;
padding: 6px 4px;
color: $fg_color;
background-color: transparent;
border: 1px solid transparent;
border-image: url("#{$asset_path}/menu/menu.svg") 9 9 9 9;
background-color: $panelmenu_bg_color;
border: 1px solid $panelmenu_borders_color;
box-shadow: 0 0 3px 1px rgba(0, 0, 0, 0.2);
.notification-icon { padding: 5px; }
@ -2385,12 +2391,13 @@ $legacy_icon_size: 24px;
// Looking Glass
//
#LookingGlassDialog {
margin-top: 4px;
spacing: 4px;
padding: 8px 8px 10px 8px;
background-color: transparentize(black, 0.3);
border: 1px solid black;
border-image: url("common-assets/misc/bg.svg") 9 9 9 9;
background-color: $switcher_bg_color;
border: 1px solid $switcher_borders_color;
border-radius: 2px;
box-shadow: 0 0 3px 1px rgba(0, 0, 0, 0.2);
color: $osd_fg_color;
& > #Toolbar {