From d3c247ed21cc9d73e0ae23a9e4b823229cbd6d2b Mon Sep 17 00:00:00 2001 From: Lapo Calamandrei Date: Wed, 17 Feb 2016 15:18:59 +0100 Subject: [PATCH] Adwaita: added a new mixin for check/radio/sliders some clean up in the process. The gradient still need some love. --- gtk/theme/Adwaita/_colors.scss | 3 +- gtk/theme/Adwaita/_common.scss | 54 +++----- gtk/theme/Adwaita/_drawing.scss | 41 +++++++ gtk/theme/Adwaita/gtk-contained-dark.css | 150 ++++++++++------------- gtk/theme/Adwaita/gtk-contained.css | 150 ++++++++++------------- 5 files changed, 194 insertions(+), 204 deletions(-) diff --git a/gtk/theme/Adwaita/_colors.scss b/gtk/theme/Adwaita/_colors.scss index fb8367d1d5..75caa4aac9 100644 --- a/gtk/theme/Adwaita/_colors.scss +++ b/gtk/theme/Adwaita/_colors.scss @@ -1,4 +1,4 @@ -// When color definition differs for dark and light variant, +// When color definition differs for dark and light variant // it gets @if ed depending on $variant @@ -39,6 +39,7 @@ $sidebar_bg_color: mix($bg_color, $base_color, 50%); $base_hover_color: transparentize($fg_color, 0.95); $tooltip_borders_color: transparentize(white, 0.9); +$shadow_color: transparentize(black, 0.9); //insensitive state derived colors $insensitive_fg_color: mix($fg_color, $bg_color, 50%); diff --git a/gtk/theme/Adwaita/_common.scss b/gtk/theme/Adwaita/_common.scss index d6a46c9a5c..ded37e3520 100644 --- a/gtk/theme/Adwaita/_common.scss +++ b/gtk/theme/Adwaita/_common.scss @@ -2176,7 +2176,7 @@ switch { font-size: smaller; outline-offset: -4px; box-shadow: inset 0 1px transparentize(black, 0.9), // needs to be set here - _widget_edge(); // otherwise it gets + _widget_edge(transparent); // otherwise it gets // clipped // similar to the .scale border: 1px solid $borders_color; @@ -2190,7 +2190,7 @@ switch { border-color: $selected_borders_color; background-color: $selected_bg_color; background-image: none; - box-shadow: _widget_edge(); + box-shadow: _widget_edge(transparent); text-shadow: 0 1px transparentize($selected_borders_color, 0.5), 0 0 2px transparentize(white, 0.4); } @@ -2200,7 +2200,7 @@ switch { border-color: $borders_color; background-image: none; background-color: $insensitive_bg_color; - box-shadow: _widget_edge(); + box-shadow: _widget_edge(transparent); text-shadow: none; } @@ -2233,37 +2233,21 @@ switch { min-height: 27px; border: 1px solid; border-radius: 3px; - @include button(normal); - box-shadow: inset 0 1px if($variant=='light', white, - transparentize(white, 0.85)), - inset 0 -2px transparentize($bg_color, 0.4), - inset 0 -1px mix($bg_color, $borders_color, 50%); + @include button(normal-alt, $edge: $shadow_color); } - &:hover slider { - @include button(hover); - box-shadow: inset 0 1px if($variant=='light', white, - transparentize(white, 0.85)), - inset 0 -2px transparentize($bg_color, 0.4), - inset 0 -1px mix($bg_color, $borders_color, 50%); - } + &:hover slider { @include button(hover-alt, $edge: $shadow_color); } &:active slider { border: 1px solid $selected_borders_color; } - &:disabled slider { @include button(insensitive, $edge:none); } + &:disabled slider { @include button(insensitive, $edge: none); } &:backdrop { - slider { - @include button(backdrop); - box-shadow: none; - } + slider { @include button(backdrop); } &:active slider { border-color: if($variant == 'light', $selected_bg_color, $selected_borders_color); } - &:disabled slider { - @include button(backdrop-insensitive); - box-shadow: none; - } + &:disabled slider { @include button(backdrop-insensitive); } } row:selected & { @@ -2331,9 +2315,9 @@ radio { min-width: 14px; border: 1px solid; -gtk-icon-source: none; - @include button(normal); + @include button(normal-alt, $edge: $shadow_color); - &:hover { @include button(hover); } + &:hover { @include button(hover-alt, $edge: $shadow_color); } &:active { @include button(active); } &:disabled { @include button(insensitive); } &:backdrop { @@ -2351,7 +2335,7 @@ radio { menu menuitem & { margin: 0; // this is a workaround for a menu check/radio size allocation issue - &, &:hover, &:disabled { + &, &:hover, &:disabled { //FIXME use button reset mixin min-height: 14px; min-width: 14px; background-image: none; @@ -2458,13 +2442,9 @@ treeview.view radio { border: 1px solid $borders_color; border-radius: 3px; background-color: $dark_fill; - box-shadow: inset 1px 1px transparentize(black, 0.9), - _widget_edge(); + box-shadow: inset 1px 1px transparentize(black, 0.9); - &:disabled { - background-color: $insensitive_bg_color; - box-shadow: _widget_edge(); - } + &:disabled { background-color: $insensitive_bg_color; } &:backdrop { background-color: $backdrop_dark_fill; @@ -2580,13 +2560,11 @@ scale { } slider { - // FIXME: scale-has-marks-* missing - $_slider_edge_color: transparentize(black, 0.9); - @include button(normal, $edge: $_slider_edge_color); + @include button(normal-alt, $edge: $shadow_color); border: 1px solid darken($borders_color, 3%); border-radius: 100%; - &:hover { @include button(hover, $edge: $_slider_edge_color); } + &:hover { @include button(hover-alt, $edge: $shadow_color); } &:active { border-color: $selected_borders_color; } @@ -2696,7 +2674,6 @@ progressbar { font-size: smaller; color: transparentize($fg_color, 0.6); - box-shadow: _widget_edge(); // needs to be set here; &:backdrop { box-shadow: none; } trough { @extend %scale_trough; } @@ -2754,7 +2731,6 @@ progressbar { * Level Bar * *************/ levelbar { - box-shadow: _widget_edge(); // needs to be set here to avoid clipping block { min-width: 32px; min-height: 1px; diff --git a/gtk/theme/Adwaita/_drawing.scss b/gtk/theme/Adwaita/_drawing.scss index aa7994a1d2..264c306dbf 100644 --- a/gtk/theme/Adwaita/_drawing.scss +++ b/gtk/theme/Adwaita/_drawing.scss @@ -228,6 +228,47 @@ } } + @if $t==normal-alt { + // + // normal button alternative look + // + color: $tc; + outline-color: transparentize($tc, 0.7); + border-color: if($c!=$bg_color, _border_color($c), $borders_color); + @if $variant == 'light' { background-image: linear-gradient(to bottom, $c, darken($c, 4%) 60%, darken($c, 10%)); } + @else { background-image: linear-gradient(to bottom, darken($c, 2%), darken($c, 4%) 60%, darken($c, 6%)); } + @include _shadows(inset 0 1px _button_hilight_color(lighten($c, 6%)), + inset 0 -2px $c, + inset 0 -1px darken($c, 10%), + $_button_edge); + } + + @else if $t==hover-alt { + // + // hovered button alternative look + // + color: $tc; + outline-color: transparentize($tc, 0.7); + border-color: if($c!=$bg_color, _border_color($c), $borders_color); + @if $variant == 'light' { + background-image: linear-gradient(to bottom, lighten($c, 6%), $c 60%, darken($c, 4%)); + @include _button_text_shadow($tc,lighten($c, 6%)); + @include _shadows(inset 0 1px _button_hilight_color(lighten($c, 6%)), + inset 0 -2px lighten($c, 6%), + inset 0 -1px darken($c, 6%), + $_button_edge); + } + @else { + background-image: linear-gradient(to bottom, lighten($c, 1%), darken($c, 2%) 60%, darken($c, 4%)); + @include _button_text_shadow($tc,lighten($c, 6%)); + @include _shadows(inset 0 1px _button_hilight_color(lighten($c, 6%)), + inset 0 $c, + inset 0 -1px darken($c, 6%), + $_button_edge); + } + } + + @else if $t==active { // // pushed button diff --git a/gtk/theme/Adwaita/gtk-contained-dark.css b/gtk/theme/Adwaita/gtk-contained-dark.css index 48f347b70b..0f23bd22e3 100644 --- a/gtk/theme/Adwaita/gtk-contained-dark.css +++ b/gtk/theme/Adwaita/gtk-contained-dark.css @@ -2354,7 +2354,7 @@ switch { font-weight: bold; font-size: smaller; outline-offset: -4px; - box-shadow: inset 0 1px rgba(0, 0, 0, 0.1), 0 1px rgba(238, 238, 236, 0.07); + box-shadow: inset 0 1px rgba(0, 0, 0, 0.1), 0 1px transparent; border: 1px solid #1c1f1f; border-radius: 3px; color: #eeeeec; @@ -2365,14 +2365,14 @@ switch { border-color: #0f2b48; background-color: #215d9c; background-image: none; - box-shadow: 0 1px rgba(238, 238, 236, 0.07); + box-shadow: 0 1px transparent; text-shadow: 0 1px rgba(15, 43, 72, 0.5), 0 0 2px rgba(255, 255, 255, 0.6); } switch:disabled { color: #949796; border-color: #1c1f1f; background-image: none; background-color: #333636; - box-shadow: 0 1px rgba(238, 238, 236, 0.07); + box-shadow: 0 1px transparent; text-shadow: none; } switch:backdrop { color: #949796; @@ -2399,10 +2399,7 @@ switch { outline-color: rgba(238, 238, 236, 0.3); border-color: #1c1f1f; background-image: linear-gradient(to bottom, #343a3a, #2f3434 60%, #2a2f2f); - text-shadow: 0 -1px rgba(0, 0, 0, 0.81176); - -gtk-icon-shadow: 0 -1px rgba(0, 0, 0, 0.81176); - box-shadow: inset 0 1px rgba(255, 255, 255, 0.05); - box-shadow: inset 0 1px rgba(255, 255, 255, 0.15), inset 0 -2px rgba(57, 63, 63, 0.6), inset 0 -1px #2b2f2f; } + box-shadow: inset 0 1px rgba(255, 255, 255, 0.05), inset 0 -2px #393f3f, inset 0 -1px #212424, 0 1px rgba(0, 0, 0, 0.1); } switch:hover slider { color: #eeeeec; outline-color: rgba(238, 238, 236, 0.3); @@ -2410,8 +2407,7 @@ switch { background-image: linear-gradient(to bottom, #3b4242, #343a3a 60%, #2f3434); text-shadow: 0 -1px rgba(0, 0, 0, 0.76376); -gtk-icon-shadow: 0 -1px rgba(0, 0, 0, 0.76376); - box-shadow: inset 0 1px rgba(255, 255, 255, 0.05); - box-shadow: inset 0 1px rgba(255, 255, 255, 0.15), inset 0 -2px rgba(57, 63, 63, 0.6), inset 0 -1px #2b2f2f; } + box-shadow: inset 0 1px rgba(255, 255, 255, 0.05), inset 0 #393f3f, inset 0 -1px #2a2f2f, 0 1px rgba(0, 0, 0, 0.1); } switch:active slider { border: 1px solid #0f2b48; } switch:disabled slider { @@ -2427,8 +2423,7 @@ switch { background-image: linear-gradient(to bottom, #393f3f); text-shadow: none; -gtk-icon-shadow: none; - box-shadow: inset 0 1px rgba(255, 255, 255, 0); - box-shadow: none; } + box-shadow: inset 0 1px rgba(255, 255, 255, 0); } switch:backdrop:active slider { border-color: #0f2b48; } switch:backdrop:disabled slider { @@ -2437,8 +2432,7 @@ switch { background-image: linear-gradient(to bottom, #333636); text-shadow: none; -gtk-icon-shadow: none; - box-shadow: inset 0 1px rgba(255, 255, 255, 0); - box-shadow: none; } + box-shadow: inset 0 1px rgba(255, 255, 255, 0); } /************************* * Check and Radio items * @@ -2502,9 +2496,7 @@ radio { outline-color: rgba(238, 238, 236, 0.3); border-color: #1c1f1f; background-image: linear-gradient(to bottom, #343a3a, #2f3434 60%, #2a2f2f); - text-shadow: 0 -1px rgba(0, 0, 0, 0.81176); - -gtk-icon-shadow: 0 -1px rgba(0, 0, 0, 0.81176); - box-shadow: inset 0 1px rgba(255, 255, 255, 0.05); } + box-shadow: inset 0 1px rgba(255, 255, 255, 0.05), inset 0 -2px #393f3f, inset 0 -1px #212424, 0 1px rgba(0, 0, 0, 0.1); } check:only-child, radio:only-child { margin: 0; } @@ -2516,7 +2508,7 @@ radio { background-image: linear-gradient(to bottom, #3b4242, #343a3a 60%, #2f3434); text-shadow: 0 -1px rgba(0, 0, 0, 0.76376); -gtk-icon-shadow: 0 -1px rgba(0, 0, 0, 0.76376); - box-shadow: inset 0 1px rgba(255, 255, 255, 0.05); } + box-shadow: inset 0 1px rgba(255, 255, 255, 0.05), inset 0 #393f3f, inset 0 -1px #2a2f2f, 0 1px rgba(0, 0, 0, 0.1); } check:active, radio:active { color: #eeeeec; @@ -2661,10 +2653,9 @@ scale trough, scale fill, progressbar trough { border: 1px solid #1c1f1f; border-radius: 3px; background-color: #2f3434; - box-shadow: inset 1px 1px rgba(0, 0, 0, 0.1), 0 1px rgba(238, 238, 236, 0.07); } + box-shadow: inset 1px 1px rgba(0, 0, 0, 0.1); } scale trough:disabled, scale fill:disabled, progressbar trough:disabled { - background-color: #333636; - box-shadow: 0 1px rgba(238, 238, 236, 0.07); } + background-color: #333636; } scale trough:backdrop, scale fill:backdrop, progressbar trough:backdrop, progressbar:backdrop trough { background-color: #303535; border-color: #1f2222; @@ -2737,9 +2728,7 @@ scale { outline-color: rgba(238, 238, 236, 0.3); border-color: #1c1f1f; background-image: linear-gradient(to bottom, #343a3a, #2f3434 60%, #2a2f2f); - text-shadow: 0 -1px rgba(0, 0, 0, 0.81176); - -gtk-icon-shadow: 0 -1px rgba(0, 0, 0, 0.81176); - box-shadow: inset 0 1px rgba(255, 255, 255, 0.05), 0 1px rgba(0, 0, 0, 0.1); + box-shadow: inset 0 1px rgba(255, 255, 255, 0.05), inset 0 -2px #393f3f, inset 0 -1px #212424, 0 1px rgba(0, 0, 0, 0.1); border: 1px solid #151717; border-radius: 100%; } scale slider:hover { @@ -2749,7 +2738,7 @@ scale { background-image: linear-gradient(to bottom, #3b4242, #343a3a 60%, #2f3434); text-shadow: 0 -1px rgba(0, 0, 0, 0.76376); -gtk-icon-shadow: 0 -1px rgba(0, 0, 0, 0.76376); - box-shadow: inset 0 1px rgba(255, 255, 255, 0.05), 0 1px rgba(0, 0, 0, 0.1); } + box-shadow: inset 0 1px rgba(255, 255, 255, 0.05), inset 0 #393f3f, inset 0 -1px #2a2f2f, 0 1px rgba(0, 0, 0, 0.1); } scale slider:active { border-color: #0f2b48; } scale slider:disabled { @@ -3044,8 +3033,7 @@ scale { *****************/ progressbar { font-size: smaller; - color: rgba(238, 238, 236, 0.4); - box-shadow: 0 1px rgba(238, 238, 236, 0.07); } + color: rgba(238, 238, 236, 0.4); } progressbar.horizontal trough, progressbar.horizontal progress { min-height: 2px; } @@ -3088,65 +3076,63 @@ progressbar { /************* * Level Bar * *************/ -levelbar { - box-shadow: 0 1px rgba(238, 238, 236, 0.07); } - levelbar block { - min-width: 32px; - min-height: 1px; } - levelbar.vertical block { - min-width: 1px; - min-height: 32px; } - levelbar trough { - border: 1px solid; - padding: 2px; - border-radius: 3px; +levelbar block { + min-width: 32px; + min-height: 1px; } +levelbar.vertical block { + min-width: 1px; + min-height: 32px; } +levelbar trough { + border: 1px solid; + padding: 2px; + border-radius: 3px; + background-color: #292929; + background-image: linear-gradient(to bottom, #1d2020, #242525 3px, #292929 90%); + color: white; + border-color: #1c1f1f; + box-shadow: inset 0 0 0 1px rgba(33, 93, 156, 0); } + levelbar trough:backdrop { background-color: #292929; background-image: linear-gradient(to bottom, #1d2020, #242525 3px, #292929 90%); - color: white; - border-color: #1c1f1f; - box-shadow: inset 0 0 0 1px rgba(33, 93, 156, 0); } - levelbar trough:backdrop { - background-color: #292929; - background-image: linear-gradient(to bottom, #1d2020, #242525 3px, #292929 90%); - color: #d5d5d5; - border-color: #1f2222; - background-image: linear-gradient(to bottom, #2c2c2c); - box-shadow: none; } - levelbar.horizontal.discrete block { - margin: 0 1px; } - levelbar.vertical.discrete block { - margin: 1px 0; } - levelbar block:not(.empty) { - border: 1px solid #1c5187; - background-color: #215d9c; - box-shadow: 0 1px rgba(0, 0, 0, 0.1); - border-radius: 1px; } - levelbar block:not(.empty):backdrop { - border-color: #215d9c; - box-shadow: none; } - levelbar block.low { - border-color: #c26000; - background-color: #f57900; } - levelbar block.low:backdrop { - border-color: #f57900; } - levelbar block.high { - border-color: #184472; - background-color: #215d9c; } - levelbar block.high:backdrop { - border-color: #215d9c; } - levelbar block.full { - border-color: #40760c; - background-color: #5aa411; } - levelbar block.full:backdrop { - border-color: #5aa411; } - levelbar block.empty { - border: 1px solid #1c5187; - border-radius: 1px; - background-color: transparent; - border-color: rgba(238, 238, 236, 0.1); + color: #d5d5d5; + border-color: #1f2222; + background-image: linear-gradient(to bottom, #2c2c2c); box-shadow: none; } - levelbar block.empty:backdrop { - border-color: rgba(148, 151, 150, 0.15); } +levelbar.horizontal.discrete block { + margin: 0 1px; } +levelbar.vertical.discrete block { + margin: 1px 0; } +levelbar block:not(.empty) { + border: 1px solid #1c5187; + background-color: #215d9c; + box-shadow: 0 1px rgba(0, 0, 0, 0.1); + border-radius: 1px; } + levelbar block:not(.empty):backdrop { + border-color: #215d9c; + box-shadow: none; } +levelbar block.low { + border-color: #c26000; + background-color: #f57900; } + levelbar block.low:backdrop { + border-color: #f57900; } +levelbar block.high { + border-color: #184472; + background-color: #215d9c; } + levelbar block.high:backdrop { + border-color: #215d9c; } +levelbar block.full { + border-color: #40760c; + background-color: #5aa411; } + levelbar block.full:backdrop { + border-color: #5aa411; } +levelbar block.empty { + border: 1px solid #1c5187; + border-radius: 1px; + background-color: transparent; + border-color: rgba(238, 238, 236, 0.1); + box-shadow: none; } + levelbar block.empty:backdrop { + border-color: rgba(148, 151, 150, 0.15); } /**************** * Print dialog * diff --git a/gtk/theme/Adwaita/gtk-contained.css b/gtk/theme/Adwaita/gtk-contained.css index 7485fadbc3..fe2f0794ec 100644 --- a/gtk/theme/Adwaita/gtk-contained.css +++ b/gtk/theme/Adwaita/gtk-contained.css @@ -2364,7 +2364,7 @@ switch { font-weight: bold; font-size: smaller; outline-offset: -4px; - box-shadow: inset 0 1px rgba(0, 0, 0, 0.1), 0 1px rgba(255, 255, 255, 0.8); + box-shadow: inset 0 1px rgba(0, 0, 0, 0.1), 0 1px transparent; border: 1px solid #9d9d99; border-radius: 3px; color: #2e3436; @@ -2375,14 +2375,14 @@ switch { border-color: #184472; background-color: #4a90d9; background-image: none; - box-shadow: 0 1px rgba(255, 255, 255, 0.8); + box-shadow: 0 1px transparent; text-shadow: 0 1px rgba(24, 68, 114, 0.5), 0 0 2px rgba(255, 255, 255, 0.6); } switch:disabled { color: #8b8e8f; border-color: #9d9d99; background-image: none; background-color: #f1f1f1; - box-shadow: 0 1px rgba(255, 255, 255, 0.8); + box-shadow: 0 1px transparent; text-shadow: none; } switch:backdrop { color: #8b8e8f; @@ -2410,10 +2410,7 @@ switch { outline-color: rgba(46, 52, 54, 0.3); border-color: #9d9d99; background-image: linear-gradient(to bottom, #e8e8e7, #dededd 60%, #cfcfcd); - text-shadow: 0 1px rgba(255, 255, 255, 0.76923); - -gtk-icon-shadow: 0 1px rgba(255, 255, 255, 0.76923); - box-shadow: inset 0 1px rgba(255, 255, 255, 0.8); - box-shadow: inset 0 1px white, inset 0 -2px rgba(232, 232, 231, 0.6), inset 0 -1px #c3c3c0; } + box-shadow: inset 0 1px white, inset 0 -2px #e8e8e7, inset 0 -1px #cfcfcd, 0 1px rgba(0, 0, 0, 0.1); } switch:hover slider { color: #2e3436; outline-color: rgba(46, 52, 54, 0.3); @@ -2421,8 +2418,7 @@ switch { background-image: linear-gradient(to bottom, #f7f7f7, #e8e8e7 60%, #dededd); text-shadow: 0 1px rgba(255, 255, 255, 0.76923); -gtk-icon-shadow: 0 1px rgba(255, 255, 255, 0.76923); - box-shadow: inset 0 1px white; - box-shadow: inset 0 1px white, inset 0 -2px rgba(232, 232, 231, 0.6), inset 0 -1px #c3c3c0; } + box-shadow: inset 0 1px white, inset 0 -2px #f7f7f7, inset 0 -1px #d9d9d7, 0 1px rgba(0, 0, 0, 0.1); } switch:active slider { border: 1px solid #184472; } switch:disabled slider { @@ -2438,8 +2434,7 @@ switch { background-image: linear-gradient(to bottom, #e8e8e7); text-shadow: none; -gtk-icon-shadow: none; - box-shadow: inset 0 1px rgba(255, 255, 255, 0); - box-shadow: none; } + box-shadow: inset 0 1px rgba(255, 255, 255, 0); } switch:backdrop:active slider { border-color: #4a90d9; } switch:backdrop:disabled slider { @@ -2448,8 +2443,7 @@ switch { background-image: linear-gradient(to bottom, #f1f1f1); text-shadow: none; -gtk-icon-shadow: none; - box-shadow: inset 0 1px rgba(255, 255, 255, 0); - box-shadow: none; } + box-shadow: inset 0 1px rgba(255, 255, 255, 0); } row:selected switch { box-shadow: none; border-color: #184472; } @@ -2524,9 +2518,7 @@ radio { outline-color: rgba(46, 52, 54, 0.3); border-color: #9d9d99; background-image: linear-gradient(to bottom, #e8e8e7, #dededd 60%, #cfcfcd); - text-shadow: 0 1px rgba(255, 255, 255, 0.76923); - -gtk-icon-shadow: 0 1px rgba(255, 255, 255, 0.76923); - box-shadow: inset 0 1px rgba(255, 255, 255, 0.8); } + box-shadow: inset 0 1px white, inset 0 -2px #e8e8e7, inset 0 -1px #cfcfcd, 0 1px rgba(0, 0, 0, 0.1); } check:only-child, radio:only-child { margin: 0; } @@ -2538,7 +2530,7 @@ radio { background-image: linear-gradient(to bottom, #f7f7f7, #e8e8e7 60%, #dededd); text-shadow: 0 1px rgba(255, 255, 255, 0.76923); -gtk-icon-shadow: 0 1px rgba(255, 255, 255, 0.76923); - box-shadow: inset 0 1px white; } + box-shadow: inset 0 1px white, inset 0 -2px #f7f7f7, inset 0 -1px #d9d9d7, 0 1px rgba(0, 0, 0, 0.1); } check:active, radio:active { color: #2e3436; @@ -2692,10 +2684,9 @@ scale trough, scale fill, progressbar trough { border: 1px solid #9d9d99; border-radius: 3px; background-color: #cececc; - box-shadow: inset 1px 1px rgba(0, 0, 0, 0.1), 0 1px rgba(255, 255, 255, 0.8); } + box-shadow: inset 1px 1px rgba(0, 0, 0, 0.1); } scale trough:disabled, scale fill:disabled, progressbar trough:disabled { - background-color: #f1f1f1; - box-shadow: 0 1px rgba(255, 255, 255, 0.8); } + background-color: #f1f1f1; } scale trough:backdrop, scale fill:backdrop, progressbar trough:backdrop, progressbar:backdrop trough { background-color: #d1d1cf; border-color: #a5a5a1; @@ -2768,9 +2759,7 @@ scale { outline-color: rgba(46, 52, 54, 0.3); border-color: #9d9d99; background-image: linear-gradient(to bottom, #e8e8e7, #dededd 60%, #cfcfcd); - text-shadow: 0 1px rgba(255, 255, 255, 0.76923); - -gtk-icon-shadow: 0 1px rgba(255, 255, 255, 0.76923); - box-shadow: inset 0 1px rgba(255, 255, 255, 0.8), 0 1px rgba(0, 0, 0, 0.1); + box-shadow: inset 0 1px white, inset 0 -2px #e8e8e7, inset 0 -1px #cfcfcd, 0 1px rgba(0, 0, 0, 0.1); border: 1px solid #969691; border-radius: 100%; } scale slider:hover { @@ -2780,7 +2769,7 @@ scale { background-image: linear-gradient(to bottom, #f7f7f7, #e8e8e7 60%, #dededd); text-shadow: 0 1px rgba(255, 255, 255, 0.76923); -gtk-icon-shadow: 0 1px rgba(255, 255, 255, 0.76923); - box-shadow: inset 0 1px white, 0 1px rgba(0, 0, 0, 0.1); } + box-shadow: inset 0 1px white, inset 0 -2px #f7f7f7, inset 0 -1px #d9d9d7, 0 1px rgba(0, 0, 0, 0.1); } scale slider:active { border-color: #184472; } scale slider:disabled { @@ -3075,8 +3064,7 @@ scale { *****************/ progressbar { font-size: smaller; - color: rgba(46, 52, 54, 0.4); - box-shadow: 0 1px rgba(255, 255, 255, 0.8); } + color: rgba(46, 52, 54, 0.4); } progressbar.horizontal trough, progressbar.horizontal progress { min-height: 2px; } @@ -3119,65 +3107,63 @@ progressbar { /************* * Level Bar * *************/ -levelbar { - box-shadow: 0 1px rgba(255, 255, 255, 0.8); } - levelbar block { - min-width: 32px; - min-height: 1px; } - levelbar.vertical block { - min-width: 1px; - min-height: 32px; } - levelbar trough { - border: 1px solid; - padding: 2px; - border-radius: 3px; +levelbar block { + min-width: 32px; + min-height: 1px; } +levelbar.vertical block { + min-width: 1px; + min-height: 32px; } +levelbar trough { + border: 1px solid; + padding: 2px; + border-radius: 3px; + background-color: #ffffff; + background-image: linear-gradient(to bottom, #d3d3d1, #fcfcfc 2px, #ffffff 90%); + color: black; + border-color: #9d9d99; + box-shadow: inset 0 0 0 1px rgba(74, 144, 217, 0); } + levelbar trough:backdrop { background-color: #ffffff; background-image: linear-gradient(to bottom, #d3d3d1, #fcfcfc 2px, #ffffff 90%); - color: black; - border-color: #9d9d99; - box-shadow: inset 0 0 0 1px rgba(74, 144, 217, 0); } - levelbar trough:backdrop { - background-color: #ffffff; - background-image: linear-gradient(to bottom, #d3d3d1, #fcfcfc 2px, #ffffff 90%); - color: #333333; - border-color: #a5a5a1; - background-image: linear-gradient(to bottom, white); - box-shadow: none; } - levelbar.horizontal.discrete block { - margin: 0 1px; } - levelbar.vertical.discrete block { - margin: 1px 0; } - levelbar block:not(.empty) { - border: 1px solid #2a76c6; - background-color: #4a90d9; - box-shadow: 0 1px rgba(0, 0, 0, 0.1); - border-radius: 1px; } - levelbar block:not(.empty):backdrop { - border-color: #4a90d9; - box-shadow: none; } - levelbar block.low { - border-color: #c26000; - background-color: #f57900; } - levelbar block.low:backdrop { - border-color: #f57900; } - levelbar block.high { - border-color: #2a76c6; - background-color: #4a90d9; } - levelbar block.high:backdrop { - border-color: #4a90d9; } - levelbar block.full { - border-color: #5aa411; - background-color: #73d216; } - levelbar block.full:backdrop { - border-color: #73d216; } - levelbar block.empty { - border: 1px solid #2a76c6; - border-radius: 1px; - background-color: transparent; - border-color: rgba(46, 52, 54, 0.2); + color: #333333; + border-color: #a5a5a1; + background-image: linear-gradient(to bottom, white); box-shadow: none; } - levelbar block.empty:backdrop { - border-color: rgba(139, 142, 143, 0.15); } +levelbar.horizontal.discrete block { + margin: 0 1px; } +levelbar.vertical.discrete block { + margin: 1px 0; } +levelbar block:not(.empty) { + border: 1px solid #2a76c6; + background-color: #4a90d9; + box-shadow: 0 1px rgba(0, 0, 0, 0.1); + border-radius: 1px; } + levelbar block:not(.empty):backdrop { + border-color: #4a90d9; + box-shadow: none; } +levelbar block.low { + border-color: #c26000; + background-color: #f57900; } + levelbar block.low:backdrop { + border-color: #f57900; } +levelbar block.high { + border-color: #2a76c6; + background-color: #4a90d9; } + levelbar block.high:backdrop { + border-color: #4a90d9; } +levelbar block.full { + border-color: #5aa411; + background-color: #73d216; } + levelbar block.full:backdrop { + border-color: #73d216; } +levelbar block.empty { + border: 1px solid #2a76c6; + border-radius: 1px; + background-color: transparent; + border-color: rgba(46, 52, 54, 0.2); + box-shadow: none; } + levelbar block.empty:backdrop { + border-color: rgba(139, 142, 143, 0.15); } /**************** * Print dialog *