Gnome: Improve appearance of tooltips and app-notifications

This commit is contained in:
EliverLara
2020-06-24 13:43:16 -05:00
parent 9d45dcdf2c
commit edd4d967a0
5 changed files with 108 additions and 108 deletions

View File

@@ -57,7 +57,7 @@ $suggested_color: if($variant == 'light', $selected_bg_color, darken($selected_b
$osd_fg_color: #fefefe;
$osd_text_color: white;
$osd_bg_color: transparentize(#14171a, 0.2);
$osd_bg_color: transparentize(darken($_sidebar_color, 3%), 0.02);
$osd_insensitive_bg_color: transparentize(mix($osd_fg_color, opacify($osd_bg_color, 1), 10%), 0.5);
$osd_insensitive_fg_color: mix($osd_fg_color, opacify($osd_bg_color, 1), 50%);
$osd_borders_color: transparentize(black, 0.3);

View File

@@ -112,7 +112,7 @@ read if you used those and something break with a version upgrade you're on your
.app-notification.frame {
padding: 10px;
border-radius: 0 0 5px 5px;
background-color: rgba(20, 23, 26, 0.8);
background-color: rgba(16, 19, 27, 0.98);
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.2), transparent 2px);
background-clip: padding-box; }
.app-notification:backdrop,
@@ -238,8 +238,8 @@ assistant .sidebar label.highlight {
.app-notification,
.app-notification.frame, .osd .scale-popup, .csd popover.background.touch-selection, .csd popover.background.magnifier, popover.background.touch-selection, popover.background.magnifier, .csd popover.background.osd, popover.background.osd, .osd {
color: #fefefe;
border: none;
background-color: rgba(20, 23, 26, 0.8);
border: 1px solid #171e27;
background-color: rgba(16, 19, 27, 0.98);
background-clip: padding-box;
outline-color: rgba(254, 254, 254, 0.3);
text-shadow: 0 1px black;
@@ -429,7 +429,7 @@ button.osd {
outline-color: rgba(254, 254, 254, 0.3);
color: #fefefe;
border-color: rgba(0, 0, 0, 0.7);
background-color: rgba(20, 23, 26, 0.8);
background-color: rgba(16, 19, 27, 0.98);
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
@@ -444,7 +444,7 @@ button.osd {
button.osd:hover {
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(47, 54, 61, 0.8), rgba(47, 54, 61, 0.8));
background-image: linear-gradient(to bottom, rgba(39, 44, 66, 0.98), rgba(39, 44, 66, 0.98));
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
@@ -457,7 +457,7 @@ button.osd {
button.osd:checked {
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(33, 38, 43, 0.8), rgba(33, 38, 43, 0.8));
background-image: linear-gradient(to bottom, rgba(28, 31, 47, 0.98), rgba(28, 31, 47, 0.98));
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: none;
@@ -468,9 +468,9 @@ button.osd {
button.osd:disabled:backdrop,
button.osd:disabled {
color: #898b8c;
color: #87888d;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(43, 46, 49, 0.5), rgba(43, 46, 49, 0.5));
background-image: linear-gradient(to bottom, rgba(40, 42, 50, 0.5), rgba(40, 42, 50, 0.5));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
@@ -480,7 +480,7 @@ button.osd {
button.osd:backdrop {
color: #fefefe;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(20, 23, 26, 0.8), rgba(20, 23, 26, 0.8));
background-image: linear-gradient(to bottom, rgba(16, 19, 27, 0.98), rgba(16, 19, 27, 0.98));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
@@ -493,7 +493,7 @@ button.osd {
button {
color: #fefefe;
border-color: rgba(0, 0, 0, 0.7);
background-color: rgba(20, 23, 26, 0.8);
background-color: rgba(16, 19, 27, 0.98);
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
@@ -504,7 +504,7 @@ button {
button:hover {
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(47, 54, 61, 0.8), rgba(47, 54, 61, 0.8));
background-image: linear-gradient(to bottom, rgba(39, 44, 66, 0.98), rgba(39, 44, 66, 0.98));
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
@@ -521,7 +521,7 @@ button {
button:checked {
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(33, 38, 43, 0.8), rgba(33, 38, 43, 0.8));
background-image: linear-gradient(to bottom, rgba(28, 31, 47, 0.98), rgba(28, 31, 47, 0.98));
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: none;
@@ -532,9 +532,9 @@ button {
button:disabled:backdrop,
.osd
button:disabled {
color: #898b8c;
color: #87888d;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(43, 46, 49, 0.5), rgba(43, 46, 49, 0.5));
background-image: linear-gradient(to bottom, rgba(40, 42, 50, 0.5), rgba(40, 42, 50, 0.5));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
@@ -544,7 +544,7 @@ button {
button:backdrop {
color: #fefefe;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(20, 23, 26, 0.8), rgba(20, 23, 26, 0.8));
background-image: linear-gradient(to bottom, rgba(16, 19, 27, 0.98), rgba(16, 19, 27, 0.98));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
@@ -566,7 +566,7 @@ button {
button.flat:hover {
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(47, 54, 61, 0.8), rgba(47, 54, 61, 0.8));
background-image: linear-gradient(to bottom, rgba(39, 44, 66, 0.98), rgba(39, 44, 66, 0.98));
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
@@ -575,9 +575,9 @@ button {
.app-notification button.flat:disabled, popover.background.touch-selection button.flat:disabled, popover.background.magnifier button.flat:disabled,
.osd
button.flat:disabled {
color: #898b8c;
color: #87888d;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(43, 46, 49, 0.5), rgba(43, 46, 49, 0.5));
background-image: linear-gradient(to bottom, rgba(40, 42, 50, 0.5), rgba(40, 42, 50, 0.5));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
@@ -601,7 +601,7 @@ button {
button.flat:checked {
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(33, 38, 43, 0.8), rgba(33, 38, 43, 0.8));
background-image: linear-gradient(to bottom, rgba(28, 31, 47, 0.98), rgba(28, 31, 47, 0.98));
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: none;
@@ -744,9 +744,9 @@ button.suggested-action {
.osd
button.suggested-action:disabled:backdrop, .osd
button.suggested-action:disabled {
color: #898b8c;
color: #87888d;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(43, 46, 49, 0.5), rgba(43, 46, 49, 0.5));
background-image: linear-gradient(to bottom, rgba(40, 42, 50, 0.5), rgba(40, 42, 50, 0.5));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
@@ -897,9 +897,9 @@ button.destructive-action {
.osd
button.destructive-action:disabled:backdrop, .osd
button.destructive-action:disabled {
color: #898b8c;
color: #87888d;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(43, 46, 49, 0.5), rgba(43, 46, 49, 0.5));
background-image: linear-gradient(to bottom, rgba(40, 42, 50, 0.5), rgba(40, 42, 50, 0.5));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
@@ -1859,9 +1859,9 @@ entry {
-gtk-icon-shadow: none; }
.osd spinbutton:disabled:not(.vertical), .osd
entry:disabled {
color: #898b8c;
color: #87888d;
border-color: rgba(0, 0, 0, 0.7);
background-color: rgba(43, 46, 49, 0.5);
background-color: rgba(40, 42, 50, 0.5);
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
@@ -3446,54 +3446,54 @@ scale {
.osd scale slider {
color: #fefefe;
border-color: rgba(0, 0, 0, 0.7);
background-color: rgba(20, 23, 26, 0.8);
background-color: rgba(16, 19, 27, 0.98);
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
-gtk-icon-shadow: 0 1px black;
outline-color: rgba(254, 254, 254, 0.3);
border-color: rgba(0, 0, 0, 0.7);
background-color: #14171a; }
background-color: #10131b; }
.osd scale slider:hover {
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(47, 54, 61, 0.8), rgba(47, 54, 61, 0.8));
background-image: linear-gradient(to bottom, rgba(39, 44, 66, 0.98), rgba(39, 44, 66, 0.98));
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
-gtk-icon-shadow: 0 1px black;
outline-color: rgba(254, 254, 254, 0.3);
background-color: #14171a; }
background-color: #10131b; }
.osd scale slider:active {
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(33, 38, 43, 0.8), rgba(33, 38, 43, 0.8));
background-image: linear-gradient(to bottom, rgba(28, 31, 47, 0.98), rgba(28, 31, 47, 0.98));
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: none;
-gtk-icon-shadow: none;
outline-color: rgba(254, 254, 254, 0.3);
background-color: #14171a; }
background-color: #10131b; }
.osd scale slider:disabled {
color: #898b8c;
color: #87888d;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(43, 46, 49, 0.5), rgba(43, 46, 49, 0.5));
background-image: linear-gradient(to bottom, rgba(40, 42, 50, 0.5), rgba(40, 42, 50, 0.5));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
-gtk-icon-shadow: none;
background-color: #14171a; }
background-color: #10131b; }
.osd scale slider:backdrop {
color: #fefefe;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(20, 23, 26, 0.8), rgba(20, 23, 26, 0.8));
background-image: linear-gradient(to bottom, rgba(16, 19, 27, 0.98), rgba(16, 19, 27, 0.98));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
-gtk-icon-shadow: none;
background-color: #14171a; }
background-color: #10131b; }
.osd scale slider:backdrop:disabled {
background-color: #14171a; }
background-color: #10131b; }
scale value {
color: alpha(currentColor,0.4); }
scale marks {
@@ -4192,7 +4192,7 @@ spinbutton:not(.vertical) {
box-shadow: inset 0 1px rgba(255, 255, 255, 0);
text-shadow: none;
-gtk-icon-shadow: none;
color: #898b8c;
color: #87888d;
border-color: rgba(0, 0, 0, 0.5);
-gtk-icon-shadow: none;
box-shadow: none; }
@@ -4236,7 +4236,7 @@ spinbutton.vertical button.down {
.osd spinbutton.vertical button:first-child {
color: #fefefe;
border-color: rgba(0, 0, 0, 0.7);
background-color: rgba(20, 23, 26, 0.8);
background-color: rgba(16, 19, 27, 0.98);
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
@@ -4245,7 +4245,7 @@ spinbutton.vertical button.down {
.osd spinbutton.vertical button:first-child:hover {
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(47, 54, 61, 0.8), rgba(47, 54, 61, 0.8));
background-image: linear-gradient(to bottom, rgba(39, 44, 66, 0.98), rgba(39, 44, 66, 0.98));
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
@@ -4254,16 +4254,16 @@ spinbutton.vertical button.down {
.osd spinbutton.vertical button:first-child:active {
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(33, 38, 43, 0.8), rgba(33, 38, 43, 0.8));
background-image: linear-gradient(to bottom, rgba(28, 31, 47, 0.98), rgba(28, 31, 47, 0.98));
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: none;
-gtk-icon-shadow: none;
outline-color: rgba(254, 254, 254, 0.3); }
.osd spinbutton.vertical button:first-child:disabled {
color: #898b8c;
color: #87888d;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(43, 46, 49, 0.5), rgba(43, 46, 49, 0.5));
background-image: linear-gradient(to bottom, rgba(40, 42, 50, 0.5), rgba(40, 42, 50, 0.5));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
@@ -4271,7 +4271,7 @@ spinbutton.vertical button.down {
.osd spinbutton.vertical button:first-child:backdrop {
color: #fefefe;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(20, 23, 26, 0.8), rgba(20, 23, 26, 0.8));
background-image: linear-gradient(to bottom, rgba(16, 19, 27, 0.98), rgba(16, 19, 27, 0.98));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
@@ -4372,7 +4372,7 @@ toolbar {
padding: 13px;
border: none;
border-radius: 5px;
background-color: rgba(20, 23, 26, 0.8); }
background-color: rgba(16, 19, 27, 0.98); }
toolbar.osd.left, toolbar.osd.right, toolbar.osd.top, toolbar.osd.bottom {
border-radius: 0; }
toolbar.horizontal separator {
@@ -4418,11 +4418,11 @@ searchbar {
tooltip {
padding: 4px;
/* not working */
border-radius: 5px;
border-radius: 4px;
box-shadow: none;
text-shadow: 0 1px black; }
tooltip.background {
background-color: rgba(0, 0, 0, 0.8);
background-color: #0c0e15;
background-clip: padding-box;
border: 1px solid rgba(255, 255, 255, 0.1); }
tooltip decoration {
@@ -6164,7 +6164,7 @@ ConversationListView {
#buttonbox_frame button {
color: #fefefe;
border-color: rgba(0, 0, 0, 0.7);
background-color: rgba(20, 23, 26, 0.8);
background-color: rgba(16, 19, 27, 0.98);
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
@@ -6173,7 +6173,7 @@ ConversationListView {
#buttonbox_frame button:hover {
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(47, 54, 61, 0.8), rgba(47, 54, 61, 0.8));
background-image: linear-gradient(to bottom, rgba(39, 44, 66, 0.98), rgba(39, 44, 66, 0.98));
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
@@ -6182,16 +6182,16 @@ ConversationListView {
#buttonbox_frame button:active, #buttonbox_frame button:checked {
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(33, 38, 43, 0.8), rgba(33, 38, 43, 0.8));
background-image: linear-gradient(to bottom, rgba(28, 31, 47, 0.98), rgba(28, 31, 47, 0.98));
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: none;
-gtk-icon-shadow: none;
outline-color: rgba(254, 254, 254, 0.3); }
#buttonbox_frame button:disabled {
color: #898b8c;
color: #87888d;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(43, 46, 49, 0.5), rgba(43, 46, 49, 0.5));
background-image: linear-gradient(to bottom, rgba(40, 42, 50, 0.5), rgba(40, 42, 50, 0.5));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;

View File

@@ -112,7 +112,7 @@ read if you used those and something break with a version upgrade you're on your
.app-notification.frame {
padding: 10px;
border-radius: 0 0 5px 5px;
background-color: rgba(20, 23, 26, 0.8);
background-color: rgba(16, 19, 27, 0.98);
background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.2), transparent 2px);
background-clip: padding-box; }
.app-notification:backdrop,
@@ -238,8 +238,8 @@ assistant .sidebar label.highlight {
.app-notification,
.app-notification.frame, .osd .scale-popup, .csd popover.background.touch-selection, .csd popover.background.magnifier, popover.background.touch-selection, popover.background.magnifier, .csd popover.background.osd, popover.background.osd, .osd {
color: #fefefe;
border: none;
background-color: rgba(20, 23, 26, 0.8);
border: 1px solid #171e27;
background-color: rgba(16, 19, 27, 0.98);
background-clip: padding-box;
outline-color: rgba(254, 254, 254, 0.3);
text-shadow: 0 1px black;
@@ -429,7 +429,7 @@ button.osd {
outline-color: rgba(254, 254, 254, 0.3);
color: #fefefe;
border-color: rgba(0, 0, 0, 0.7);
background-color: rgba(20, 23, 26, 0.8);
background-color: rgba(16, 19, 27, 0.98);
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
@@ -444,7 +444,7 @@ button.osd {
button.osd:hover {
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(47, 54, 61, 0.8), rgba(47, 54, 61, 0.8));
background-image: linear-gradient(to bottom, rgba(39, 44, 66, 0.98), rgba(39, 44, 66, 0.98));
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
@@ -457,7 +457,7 @@ button.osd {
button.osd:checked {
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(33, 38, 43, 0.8), rgba(33, 38, 43, 0.8));
background-image: linear-gradient(to bottom, rgba(28, 31, 47, 0.98), rgba(28, 31, 47, 0.98));
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: none;
@@ -468,9 +468,9 @@ button.osd {
button.osd:disabled:backdrop,
button.osd:disabled {
color: #898b8c;
color: #87888d;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(43, 46, 49, 0.5), rgba(43, 46, 49, 0.5));
background-image: linear-gradient(to bottom, rgba(40, 42, 50, 0.5), rgba(40, 42, 50, 0.5));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
@@ -480,7 +480,7 @@ button.osd {
button.osd:backdrop {
color: #fefefe;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(20, 23, 26, 0.8), rgba(20, 23, 26, 0.8));
background-image: linear-gradient(to bottom, rgba(16, 19, 27, 0.98), rgba(16, 19, 27, 0.98));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
@@ -493,7 +493,7 @@ button.osd {
button {
color: #fefefe;
border-color: rgba(0, 0, 0, 0.7);
background-color: rgba(20, 23, 26, 0.8);
background-color: rgba(16, 19, 27, 0.98);
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
@@ -504,7 +504,7 @@ button {
button:hover {
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(47, 54, 61, 0.8), rgba(47, 54, 61, 0.8));
background-image: linear-gradient(to bottom, rgba(39, 44, 66, 0.98), rgba(39, 44, 66, 0.98));
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
@@ -521,7 +521,7 @@ button {
button:checked {
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(33, 38, 43, 0.8), rgba(33, 38, 43, 0.8));
background-image: linear-gradient(to bottom, rgba(28, 31, 47, 0.98), rgba(28, 31, 47, 0.98));
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: none;
@@ -532,9 +532,9 @@ button {
button:disabled:backdrop,
.osd
button:disabled {
color: #898b8c;
color: #87888d;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(43, 46, 49, 0.5), rgba(43, 46, 49, 0.5));
background-image: linear-gradient(to bottom, rgba(40, 42, 50, 0.5), rgba(40, 42, 50, 0.5));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
@@ -544,7 +544,7 @@ button {
button:backdrop {
color: #fefefe;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(20, 23, 26, 0.8), rgba(20, 23, 26, 0.8));
background-image: linear-gradient(to bottom, rgba(16, 19, 27, 0.98), rgba(16, 19, 27, 0.98));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
@@ -566,7 +566,7 @@ button {
button.flat:hover {
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(47, 54, 61, 0.8), rgba(47, 54, 61, 0.8));
background-image: linear-gradient(to bottom, rgba(39, 44, 66, 0.98), rgba(39, 44, 66, 0.98));
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
@@ -575,9 +575,9 @@ button {
.app-notification button.flat:disabled, popover.background.touch-selection button.flat:disabled, popover.background.magnifier button.flat:disabled,
.osd
button.flat:disabled {
color: #898b8c;
color: #87888d;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(43, 46, 49, 0.5), rgba(43, 46, 49, 0.5));
background-image: linear-gradient(to bottom, rgba(40, 42, 50, 0.5), rgba(40, 42, 50, 0.5));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
@@ -601,7 +601,7 @@ button {
button.flat:checked {
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(33, 38, 43, 0.8), rgba(33, 38, 43, 0.8));
background-image: linear-gradient(to bottom, rgba(28, 31, 47, 0.98), rgba(28, 31, 47, 0.98));
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: none;
@@ -744,9 +744,9 @@ button.suggested-action {
.osd
button.suggested-action:disabled:backdrop, .osd
button.suggested-action:disabled {
color: #898b8c;
color: #87888d;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(43, 46, 49, 0.5), rgba(43, 46, 49, 0.5));
background-image: linear-gradient(to bottom, rgba(40, 42, 50, 0.5), rgba(40, 42, 50, 0.5));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
@@ -897,9 +897,9 @@ button.destructive-action {
.osd
button.destructive-action:disabled:backdrop, .osd
button.destructive-action:disabled {
color: #898b8c;
color: #87888d;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(43, 46, 49, 0.5), rgba(43, 46, 49, 0.5));
background-image: linear-gradient(to bottom, rgba(40, 42, 50, 0.5), rgba(40, 42, 50, 0.5));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
@@ -1859,9 +1859,9 @@ entry {
-gtk-icon-shadow: none; }
.osd spinbutton:disabled:not(.vertical), .osd
entry:disabled {
color: #898b8c;
color: #87888d;
border-color: rgba(0, 0, 0, 0.7);
background-color: rgba(43, 46, 49, 0.5);
background-color: rgba(40, 42, 50, 0.5);
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
@@ -3446,54 +3446,54 @@ scale {
.osd scale slider {
color: #fefefe;
border-color: rgba(0, 0, 0, 0.7);
background-color: rgba(20, 23, 26, 0.8);
background-color: rgba(16, 19, 27, 0.98);
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
-gtk-icon-shadow: 0 1px black;
outline-color: rgba(254, 254, 254, 0.3);
border-color: rgba(0, 0, 0, 0.7);
background-color: #14171a; }
background-color: #10131b; }
.osd scale slider:hover {
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(47, 54, 61, 0.8), rgba(47, 54, 61, 0.8));
background-image: linear-gradient(to bottom, rgba(39, 44, 66, 0.98), rgba(39, 44, 66, 0.98));
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
-gtk-icon-shadow: 0 1px black;
outline-color: rgba(254, 254, 254, 0.3);
background-color: #14171a; }
background-color: #10131b; }
.osd scale slider:active {
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(33, 38, 43, 0.8), rgba(33, 38, 43, 0.8));
background-image: linear-gradient(to bottom, rgba(28, 31, 47, 0.98), rgba(28, 31, 47, 0.98));
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: none;
-gtk-icon-shadow: none;
outline-color: rgba(254, 254, 254, 0.3);
background-color: #14171a; }
background-color: #10131b; }
.osd scale slider:disabled {
color: #898b8c;
color: #87888d;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(43, 46, 49, 0.5), rgba(43, 46, 49, 0.5));
background-image: linear-gradient(to bottom, rgba(40, 42, 50, 0.5), rgba(40, 42, 50, 0.5));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
-gtk-icon-shadow: none;
background-color: #14171a; }
background-color: #10131b; }
.osd scale slider:backdrop {
color: #fefefe;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(20, 23, 26, 0.8), rgba(20, 23, 26, 0.8));
background-image: linear-gradient(to bottom, rgba(16, 19, 27, 0.98), rgba(16, 19, 27, 0.98));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
-gtk-icon-shadow: none;
background-color: #14171a; }
background-color: #10131b; }
.osd scale slider:backdrop:disabled {
background-color: #14171a; }
background-color: #10131b; }
scale value {
color: alpha(currentColor,0.4); }
scale marks {
@@ -4192,7 +4192,7 @@ spinbutton:not(.vertical) {
box-shadow: inset 0 1px rgba(255, 255, 255, 0);
text-shadow: none;
-gtk-icon-shadow: none;
color: #898b8c;
color: #87888d;
border-color: rgba(0, 0, 0, 0.5);
-gtk-icon-shadow: none;
box-shadow: none; }
@@ -4236,7 +4236,7 @@ spinbutton.vertical button.down {
.osd spinbutton.vertical button:first-child {
color: #fefefe;
border-color: rgba(0, 0, 0, 0.7);
background-color: rgba(20, 23, 26, 0.8);
background-color: rgba(16, 19, 27, 0.98);
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
@@ -4245,7 +4245,7 @@ spinbutton.vertical button.down {
.osd spinbutton.vertical button:first-child:hover {
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(47, 54, 61, 0.8), rgba(47, 54, 61, 0.8));
background-image: linear-gradient(to bottom, rgba(39, 44, 66, 0.98), rgba(39, 44, 66, 0.98));
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
@@ -4254,16 +4254,16 @@ spinbutton.vertical button.down {
.osd spinbutton.vertical button:first-child:active {
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(33, 38, 43, 0.8), rgba(33, 38, 43, 0.8));
background-image: linear-gradient(to bottom, rgba(28, 31, 47, 0.98), rgba(28, 31, 47, 0.98));
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: none;
-gtk-icon-shadow: none;
outline-color: rgba(254, 254, 254, 0.3); }
.osd spinbutton.vertical button:first-child:disabled {
color: #898b8c;
color: #87888d;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(43, 46, 49, 0.5), rgba(43, 46, 49, 0.5));
background-image: linear-gradient(to bottom, rgba(40, 42, 50, 0.5), rgba(40, 42, 50, 0.5));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
@@ -4271,7 +4271,7 @@ spinbutton.vertical button.down {
.osd spinbutton.vertical button:first-child:backdrop {
color: #fefefe;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(20, 23, 26, 0.8), rgba(20, 23, 26, 0.8));
background-image: linear-gradient(to bottom, rgba(16, 19, 27, 0.98), rgba(16, 19, 27, 0.98));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;
@@ -4372,7 +4372,7 @@ toolbar {
padding: 13px;
border: none;
border-radius: 5px;
background-color: rgba(20, 23, 26, 0.8); }
background-color: rgba(16, 19, 27, 0.98); }
toolbar.osd.left, toolbar.osd.right, toolbar.osd.top, toolbar.osd.bottom {
border-radius: 0; }
toolbar.horizontal separator {
@@ -4418,11 +4418,11 @@ searchbar {
tooltip {
padding: 4px;
/* not working */
border-radius: 5px;
border-radius: 4px;
box-shadow: none;
text-shadow: 0 1px black; }
tooltip.background {
background-color: rgba(0, 0, 0, 0.8);
background-color: #0c0e15;
background-clip: padding-box;
border: 1px solid rgba(255, 255, 255, 0.1); }
tooltip decoration {
@@ -6164,7 +6164,7 @@ ConversationListView {
#buttonbox_frame button {
color: #fefefe;
border-color: rgba(0, 0, 0, 0.7);
background-color: rgba(20, 23, 26, 0.8);
background-color: rgba(16, 19, 27, 0.98);
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
@@ -6173,7 +6173,7 @@ ConversationListView {
#buttonbox_frame button:hover {
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(47, 54, 61, 0.8), rgba(47, 54, 61, 0.8));
background-image: linear-gradient(to bottom, rgba(39, 44, 66, 0.98), rgba(39, 44, 66, 0.98));
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: 0 1px black;
@@ -6182,16 +6182,16 @@ ConversationListView {
#buttonbox_frame button:active, #buttonbox_frame button:checked {
color: white;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(33, 38, 43, 0.8), rgba(33, 38, 43, 0.8));
background-image: linear-gradient(to bottom, rgba(28, 31, 47, 0.98), rgba(28, 31, 47, 0.98));
background-clip: padding-box;
box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
text-shadow: none;
-gtk-icon-shadow: none;
outline-color: rgba(254, 254, 254, 0.3); }
#buttonbox_frame button:disabled {
color: #898b8c;
color: #87888d;
border-color: rgba(0, 0, 0, 0.7);
background-image: linear-gradient(to bottom, rgba(43, 46, 49, 0.5), rgba(43, 46, 49, 0.5));
background-image: linear-gradient(to bottom, rgba(40, 42, 50, 0.5), rgba(40, 42, 50, 0.5));
background-clip: padding-box;
box-shadow: none;
text-shadow: none;

View File

@@ -159,7 +159,7 @@ assistant {
%osd, .osd {
color: $osd_fg_color;
border: none;
border: 1px solid #171e27;
background-color: $osd_bg_color;
background-clip: padding-box;
outline-color: transparentize($osd_fg_color, 0.7);

View File

@@ -5,7 +5,7 @@ tooltip {
&.background {
// background-color needs to be set this way otherwise it gets drawn twice
// see https://bugzilla.gnome.org/show_bug.cgi?id=736155 for details.
background-color: transparentize(black, 0.2);
background-color: darken($_sidebar_color, 5%);
background-clip: padding-box;
border: 1px solid $tooltip_borders_color; // this suble border is meant to
// not make the tooltip melt with
@@ -13,7 +13,7 @@ tooltip {
}
padding: 4px; /* not working */
border-radius: 5px;
border-radius: 4px;
box-shadow: none; // otherwise it gets inherited by windowframe.csd
text-shadow: 0 1px black;