[gtk+] Adwaita: first stab at GtkScale and GtkProgressBar rewrite
- From: Lapo Calamandrei <lapo src gnome org>
- To: commits-list gnome org
- Cc:
- Subject: [gtk+] Adwaita: first stab at GtkScale and GtkProgressBar rewrite
- Date: Thu, 3 Dec 2015 09:54:40 +0000 (UTC)
commit a291003ad4aeb92e475bbc1a52e259ca3c6b3c0d
Author: Lapo Calamandrei <calamandrei gmail com>
Date: Wed Dec 2 21:03:03 2015 +0100
Adwaita: first stab at GtkScale and GtkProgressBar rewrite
...scale has marks stuff missing, coming soon.
gtk/theme/Adwaita/_colors.scss | 1 +
gtk/theme/Adwaita/_common.scss | 384 +++++++--------------
gtk/theme/Adwaita/gtk-contained-dark.css | 556 ++++++++----------------------
gtk/theme/Adwaita/gtk-contained.css | 552 ++++++++----------------------
4 files changed, 401 insertions(+), 1092 deletions(-)
---
diff --git a/gtk/theme/Adwaita/_colors.scss b/gtk/theme/Adwaita/_colors.scss
index 52ca0a9..6e6039e 100644
--- a/gtk/theme/Adwaita/_colors.scss
+++ b/gtk/theme/Adwaita/_colors.scss
@@ -15,6 +15,7 @@ $borders_edge: if($variant == 'light', white, transparentize($fg_color, 0.9));
$link_color: if($variant == 'light', darken($selected_bg_color,10%), lighten($selected_bg_color,20%));
$link_visited_color: if($variant == 'light', darken($selected_bg_color,20%),
lighten($selected_bg_color,10%));
$top_hilight: $borders_edge;
+$dark_fill: mix($borders_color, $bg_color, 35%);
$scrollbar_bg_color: darken($bg_color, 7%);
diff --git a/gtk/theme/Adwaita/_common.scss b/gtk/theme/Adwaita/_common.scss
index 0049141..4cfc918 100644
--- a/gtk/theme/Adwaita/_common.scss
+++ b/gtk/theme/Adwaita/_common.scss
@@ -2123,305 +2123,177 @@ checkbutton.text-button, radiobutton.text-button {
/************
* GtkScale *
************/
+
scale {
// FIXME: rationalize
-GtkScale-slider-length: 20;
-GtkRange-slider-width: 24;
-GtkRange-trough-border: 2;
+
outline-offset: -9px;
- outline-radius: 4px;
+ outline-radius: 6px;
&.fine-tune {
outline-offset: -7px;
- outline-radius: 6px;
- & highlight,
- & fill,
- & trough {
+ outline-radius: 8px;
+
+ trough,
+ fill,
+ highlight {
+ margin: 10px;
border-radius: 4px;
- &:not(:first-child):not(:last-child),
- &:only-child {
- margin: 10px;
- }
}
}
- & trough,
- & fill,
- & highlight {
- &:not(:first-child):not(:last-child),
- &:only-child {
- margin: 12px;
- }
- }
+ trough,
+ fill,
+ highlight { margin: 12px; }
- & trough:not(:first-child):not(:last-child),
- & trough:only-child {
- & slider { margin: 2px 0; }
- }
- &.vertical trough:not(:first-child):not(:last-child),
- &.vertical trough:only-child {
- & slider { margin: 0 2px; }
- }
+ &:not(.vertical) slider { margin: 2px 0; }
+
+ &.vertical slider { margin: 0 2px; }
+
+ trough { @extend %trough; }
+
+ highlight { @extend %highlight; }
+
+ slider {
+ // FIXME: scale-has-marks-* missing
+ $_slider_edge_color: transparentize(black, 0.9);
+ @include button(normal, $edge: $_slider_edge_color);
+ border: 1px solid darken($borders_color, 3%);
+ border-radius: 100%;
+
+ &:hover { @include button(hover, $edge: $_slider_edge_color); }
+
+ &:active { border-color: $selected_borders_color; }
+
+ &:insensitive { @include button (insensitive); }
- & trough {
- border: 1px solid $borders_color;
- border-radius: 3px;
- background-color: mix($bg_color, $borders_color, 60%);
- box-shadow: inset 1px 1px transparentize(black, 0.9),
- _widget_edge();
- & slider {
- //FIXME: better gradient on the slider and hover state
- @include button(normal);
- border: 1px solid;
- border-radius: 50%;
- border-color: darken($borders_color,3%);
- box-shadow: inset 0 1px if($variant=='light', white,
- transparentize(white,0.85)),
- inset 0 #{-2px} $bg_color,
- inset 0 #{-1px} mix($bg_color, $borders_color, 50%);
- &:hover {
- @include button(hover);
- border-color: darken($borders_color,3%);
- border-radius: 50%; // needed for double marks scales
- box-shadow: inset 0 1px if($variant=='light', white,
- transparentize(white, 0.85)),
- inset 0 #{-2px} if($variant=='light', white,
- transparentize(white, 0.86)),
- inset 0 #{-1px} mix($bg_color, $borders_color, 70%);
- }
- &:insensitive {
- border-style: solid; // needed for double marks scales or they'll get
- border-radius: 50%; // overridden
- background-image: linear-gradient(to bottom, $insensitive_bg_color);
- box-shadow: none;
- }
- &:backdrop {
- border-style: solid; // needed for double marks scales or they'll get
- border-radius: 50%; // overridden
- border-color: darken($backdrop_borders_color,3%);
- background-image: linear-gradient(to bottom, $backdrop_bg_color);
- box-shadow: none;
- }
- &:backdrop:insensitive {
- @include button(backdrop-insensitive);
- }
- &:active {
- @include button(active);
- border: 1px solid if($variant=='light',darken($selected_borders_color,3%),
- darken($selected_bg_color,15%));
- }
- //OSD sliders
- .osd & {
- @include button(osd);
- background-color: opacify($osd_bg_color, 1);
- &:hover { @include button(osd-hover); }
- &:active { @include button(osd-active); }
- &:backdrop { @include button(osd-backdrop); }
- }
- }
- & highlight {
- @include progressbar_fill;
- border: 1px solid $borders_color;
- border-radius: 3px;
- box-shadow: _widget_edge();
- &.vertical { @include progressbar_fill(vertical); }
- &:backdrop {
- border-color: if($variant=='light', $selected_bg_color,
- $selected_borders_color);
- background-color: $selected_bg_color;
- box-shadow: none;
- }
- }
- & fill {
- background: none;
- background-color: red;
- border: 1px solid $borders_color;
- border-radius: 3px;
- box-shadow: _widget_edge();
- }
- &:insensitive, &.vertical:insensitive {
- border-color: $insensitive_borders_color;
- background-image: none;
- background-color: $insensitive_bg_color;
- box-shadow: _widget_edge();
- }
&:backdrop {
- border-color: $backdrop_borders_color;
- background-color: mix($backdrop_bg_color, $borders_color, 50%);
- box-shadow: none;
- }
- &:backdrop:insensitive, .highlight:backdrop:insensitive {
- border-color: $backdrop_borders_color;
- background-color: $insensitive_bg_color;
+ @include button(backdrop);
+ &:insensitive { @include button(backdrop-insensitive); }
}
- //OSD troughs
+ // OSD
.osd & {
- border-color: $osd_borders_color;
- box-shadow: none;
- margin: 9px;
- &.fine-tune { margin: 7px; }
- background-color: transparentize($osd_borders_color, 0.2);
- outline-color: transparentize($osd_fg_color, 0.8);
- outline-offset: -8px;
- &.highlight {
- background-image: none;
- background-color: $selected_bg_color;
- }
- &:insensitive, &:backdrop:insensitive {
- border-color: transparent;
- background-color: transparent;
- }
+ @include button(osd);
+ border-color: darken($osd_borders_color, 3%);
+ background-color: opacify($osd_bg_color, 1); // solid background needed here
+
+ &:hover { @include button(osd-hover); }
+
+ &:active { @include button(osd-active); }
+
+ &:insensitive { @include button(osd-insensitive); }
+
&:backdrop {
- border-color: $osd_borders_color;
- background-image: none;
- }
- }
- }
- // scales on selected list rows
- row:selected & {
- border-color: $selected_borders_color;
- box-shadow: inset 1px 1px transparentize(black, 0.9);
- &:backdrop { box-shadow: none; }
- &.highlight:backdrop { border-color: $selected_borders_color; }
- &:insensitive,
- &.highlight:insensitive {
- border-color: $selected_bg_color;
- box-shadow: none;
- background-color: mix($selected_fg_color, $selected_bg_color, 50%);
- background-image: none;
- &:backdrop { background-color: mix($backdrop_selected_fg_color, $selected_bg_color, 50%); }
- }
- }
-}
-
-scale marks {
- color: gtkalpha(currentColor, 0.5); // marks color
-}
-
- each $d,$dn in ('', 'horz'),
- ('.vertical', 'vert') {
- @each $ws,$w,$we in (':first-child:not(:last-child)','scale-has-marks-below','scale_marks_below'),
- (':not(:first-child):last-child','scale-has-marks-above','scale_marks_above') {
- scale#{$d} {
- &.fine-tune trough#{$ws} { @extend %#{$we}_#{$dn}_ft; }
- & trough#{$ws} {
- @extend %#{$we}_#{$dn};
-
- @each $s,$as in ('',''),
- (':hover','-hover'),
- (':active','-active'),
- (':insensitive','-insensitive'),
- (':backdrop','-backdrop'),
- (':backdrop:insensitive','-backdrop-insensitive') {
- & slider#{$s} {
- $_url: 'assets/slider-#{$dn}-#{$w}#{$as}#{$asset_suffix}';
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url('#{$_url}.png'),
- url('#{$_url} 2 png'));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none;
- }
- }
+ @include button(osd-backdrop);
+
+ &:insensitive { @include button(osd-backdrop-insensitive); }
}
}
}
}
-%scale_marks_above_horz { margin: 14px 10px 10px 10px; }
-%scale_marks_below_horz { margin: 10px 10px 14px 10px; }
-%scale_marks_above_vert { margin: 10px 10px 10px 14px; }
-%scale_marks_below_vert { margin: 10px 14px 10px 10px; }
-%scale_marks_above_horz_ft { margin: 12px 8px 8px 8px; }
-%scale_marks_below_horz_ft { margin: 8px 8px 12px 8px; }
-%scale_marks_above_vert_ft { margin: 8px 8px 8px 12px; }
-%scale_marks_below_vert_ft { margin: 8px 12px 8px 8px; }
-
-/*****************
- * Progress bars *
- *****************/
+%trough {
+ border: 1px solid $borders_color;
+ border-radius: 3px;
+ background-color: $dark_fill;
+ box-shadow: inset 1px 1px transparentize(black, 0.9),
+ _widget_edge();
-progressbar {
- padding: 0;
- font-size: smaller;
- color: transparentize($fg_color, 0.6);
- box-shadow: inset 1px 1px transparentize(black, 0.9), // needs to be set
- _widget_edge(); // here ot it gets
- // clipped
+ &:insensitive {
+ background-color: $insensitive_bg_color;
+ box-shadow: _widget_edge();
+ }
&:backdrop {
- color: $backdrop_insensitive_color;
- }
- &.osd {
- -GtkProgressBar-min-horizontal-bar-height: 3;
- trough {
- border-style: none;
- background-color: transparent;
- box-shadow: none;
- }
- }
- trough {
- border: 1px solid $borders_color;
- border-radius: 3px;
- background-color: mix($borders_color, $bg_color, 35%);
- &:backdrop {
- border-color: $backdrop_borders_color;
- background-color: $backdrop_dark_fill;
- box-shadow: 0 1px transparentize(white,1);
- }
+ background-color: $backdrop_dark_fill;
+ border-color: $backdrop_borders_color;
+ box-shadow: none;
+ &:insensitive { background-color: $insensitive_bg_color; }
}
-}
-progressbar.horizontal progress {
- @include progressbar_fill;
- border: 1px solid $selected_borders_color;
- border-radius: 1.5px;
- box-shadow: none; //needed for clipping
- &.left {
- border-top-left-radius: 3px;
- border-bottom-left-radius: 3px;
- }
- &.right {
- border-top-right-radius: 3px;
- border-bottom-right-radius: 3px;
- }
- &.left.right {
+ // OSD
+ .osd & {
+ border-color: $osd_borders_color;
+ background-color: transparentize($osd_borders_color, 0.2);
box-shadow: none;
+ outline-color: transparentize($osd_fg_color, 0.8);
+
+ &:insensitive { background-color: $osd_insensitive_bg_color; }
}
}
-progressbar.vertical progress {
- @include progressbar_fill(vertical);
+%highlight {
border: 1px solid $selected_borders_color;
- border-radius: 1.5px;
- box-shadow: none; //needed for clipping
- &.bottom {
- border-bottom-left-radius: 3px;
- border-bottom-right-radius: 3px;
- box-shadow: none;
- }
- &.top {
- border-top-left-radius: 3px;
- border-top-right-radius: 3px;
+ border-radius: 3px;
+ background-color: $selected_bg_color;
+
+ &:insensitive {
+ background-color: transparent;
+ border-color: transparent;
}
+
&:backdrop {
border-color: if($variant=='light', $selected_bg_color,
$selected_borders_color);
- background-image: none;
- background-color: $selected_bg_color;
- box-shadow: none;
+ &:insensitive {
+ background-color: transparent;
+ border-color: transparent;
+ }
}
- &.osd {
- background-image: none;
- background-color: $selected_bg_color;
- border-style: none;
- border-radius: 0;
+
+ // OSD
+ .osd & {
+ border-color: $osd_borders_color;
+ &:insensitive { border-color: transparent; }
}
}
+/*****************
+ * Progress bars *
+ *****************/
+
+progressbar {
+ // FIXME: insensitive state missing
+ padding: 0;
+ font-size: smaller;
+ color: transparentize($fg_color, 0.6);
+
+ box-shadow: _widget_edge(); // needs to be set here;
+ &:backdrop { box-shadow: none; }
+
+ trough {
+ @extend %trough;
+ }
+
+ &:backdrop trough { @extend %trough:backdrop; } // looks like states are not passed to the trough
component here
+
+ progress {
+ @extend %highlight;
+ border-radius: 1.5px;
+ &.left {
+ border-top-left-radius: 3px;
+ border-bottom-left-radius: 3px;
+ }
+ &.right {
+ border-top-right-radius: 3px;
+ border-bottom-right-radius: 3px;
+ }
+ &.top {
+ border-top-right-radius: 3px;
+ border-top-left-radius: 3px;
+ }
+ &.bottom {
+ border-bottom-right-radius: 3px;
+ border-bottom-left-radius: 3px;
+ }
+ }
+
+ &:backdrop progress { @extend %highlight:backdrop; } // states not passed here as well
+}
/*************
* Level Bar *
diff --git a/gtk/theme/Adwaita/gtk-contained-dark.css b/gtk/theme/Adwaita/gtk-contained-dark.css
index a3b1cf4..a23179f 100644
--- a/gtk/theme/Adwaita/gtk-contained-dark.css
+++ b/gtk/theme/Adwaita/gtk-contained-dark.css
@@ -2913,397 +2913,152 @@ scale {
-GtkRange-slider-width: 24;
-GtkRange-trough-border: 2;
outline-offset: -9px;
- outline-radius: 4px; }
+ outline-radius: 6px; }
scale.fine-tune {
outline-offset: -7px;
- outline-radius: 6px; }
- scale.fine-tune highlight, scale.fine-tune fill, scale.fine-tune trough {
+ outline-radius: 8px; }
+ scale.fine-tune trough,
+ scale.fine-tune fill,
+ scale.fine-tune highlight {
+ margin: 10px;
border-radius: 4px; }
- scale.fine-tune highlight:not(:first-child):not(:last-child), scale.fine-tune highlight:only-child,
scale.fine-tune fill:not(:first-child):not(:last-child), scale.fine-tune fill:only-child, scale.fine-tune
trough:not(:first-child):not(:last-child), scale.fine-tune trough:only-child {
- margin: 10px; }
- scale trough:not(:first-child):not(:last-child), scale trough:only-child, scale
fill:not(:first-child):not(:last-child), scale fill:only-child, scale
highlight:not(:first-child):not(:last-child), scale highlight:only-child {
+ scale trough,
+ scale fill,
+ scale highlight {
margin: 12px; }
- scale trough:not(:first-child):not(:last-child) slider, scale trough:only-child slider {
+ scale:not(.vertical) slider {
margin: 2px 0; }
- scale.vertical trough:not(:first-child):not(:last-child) slider, scale.vertical trough:only-child slider {
+ scale.vertical slider {
margin: 0 2px; }
- scale trough {
- border: 1px solid #1c1f1f;
- border-radius: 3px;
- background-color: #2d3232;
- box-shadow: inset 1px 1px rgba(0, 0, 0, 0.1), 0 1px rgba(238, 238, 236, 0.1); }
- scale trough slider {
+ scale slider {
+ color: #eeeeec;
+ outline-color: rgba(238, 238, 236, 0.3);
+ border-color: #1c1f1f;
+ background-image: linear-gradient(to bottom, #454c4c, #393f3f 40%, #2d3232);
+ 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.1), 0 1px rgba(0, 0, 0, 0.1);
+ border: 1px solid #151717;
+ border-radius: 100%; }
+ scale slider:hover {
color: #eeeeec;
outline-color: rgba(238, 238, 236, 0.3);
border-color: #1c1f1f;
- background-image: linear-gradient(to bottom, #454c4c, #393f3f 40%, #2d3232);
- 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.1), 0 1px rgba(238, 238, 236, 0.1);
- border: 1px solid;
- border-radius: 50%;
- border-color: #151717;
- box-shadow: inset 0 1px rgba(255, 255, 255, 0.15), inset 0 -2px #393f3f, inset 0 -1px #2b2f2f; }
- scale trough slider:hover {
- color: #eeeeec;
- outline-color: rgba(238, 238, 236, 0.3);
- border-color: #1c1f1f;
- background-image: linear-gradient(to bottom, #5b6464, #434a4a 40%, #393f3f);
- text-shadow: 0 -1px rgba(0, 0, 0, 0.77976);
- -gtk-icon-shadow: 0 -1px rgba(0, 0, 0, 0.77976);
- box-shadow: inset 0 1px rgba(255, 255, 255, 0.1), 0 1px rgba(238, 238, 236, 0.1);
- border-color: #151717;
- border-radius: 50%;
- box-shadow: inset 0 1px rgba(255, 255, 255, 0.15), inset 0 -2px rgba(255, 255, 255, 0.14), inset 0
-1px #303535; }
- scale trough slider:insensitive {
- border-style: solid;
- border-radius: 50%;
- background-image: linear-gradient(to bottom, #333636);
- box-shadow: none; }
- scale trough slider:backdrop {
- border-style: solid;
- border-radius: 50%;
- border-color: #181a1a;
- background-image: linear-gradient(to bottom, #393f3f);
- box-shadow: none; }
- scale trough slider:backdrop:insensitive {
+ background-image: linear-gradient(to bottom, #5b6464, #434a4a 40%, #393f3f);
+ text-shadow: 0 -1px rgba(0, 0, 0, 0.77976);
+ -gtk-icon-shadow: 0 -1px rgba(0, 0, 0, 0.77976);
+ box-shadow: inset 0 1px rgba(255, 255, 255, 0.1), 0 1px rgba(0, 0, 0, 0.1); }
+ scale slider:active {
+ border-color: #0f2b48; }
+ scale slider:insensitive {
+ color: #949796;
+ border-color: #1c1f1f;
+ background-image: linear-gradient(to bottom, #333636);
+ text-shadow: none;
+ -gtk-icon-shadow: none;
+ box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(238, 238, 236, 0.1); }
+ scale slider:insensitive > .label {
+ color: inherit; }
+ scale slider:backdrop {
+ color: #949796;
+ border-color: #1f2222;
+ background-image: linear-gradient(to bottom, #393f3f);
+ text-shadow: none;
+ -gtk-icon-shadow: none;
+ box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(238, 238, 236, 0); }
+ scale slider:backdrop:insensitive {
color: #5d6767;
border-color: #1f2222;
background-image: linear-gradient(to bottom, #333636);
text-shadow: none;
-gtk-icon-shadow: none;
box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(238, 238, 236, 0); }
- scale trough slider:backdrop:insensitive > .label {
+ scale slider:backdrop:insensitive > .label {
color: inherit; }
- scale trough slider:active {
- color: #eeeeec;
- outline-color: rgba(238, 238, 236, 0.3);
- border-color: #1c1f1f;
- background-image: linear-gradient(to bottom, #232727, #292d2d 40%, #2d3232);
- text-shadow: 0 -1px rgba(0, 0, 0, 0.89176);
- -gtk-icon-shadow: 0 -1px rgba(0, 0, 0, 0.89176);
- box-shadow: inset 0 1px rgba(0, 0, 0, 0.07), inset 0 2px 1px -2px rgba(0, 0, 0, 0.6), 0 1px
rgba(238, 238, 236, 0.1);
- border: 1px solid #14375d; }
- .osd scale trough slider {
- color: #eeeeec;
+ .osd scale slider {
+ color: #eeeeec;
+ border-color: rgba(0, 0, 0, 0.7);
+ background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.7));
+ 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(238, 238, 236, 0.3);
+ border-color: rgba(0, 0, 0, 0.7);
+ background-color: #202526; }
+ .osd scale slider:hover {
+ color: white;
border-color: rgba(0, 0, 0, 0.7);
- background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.7));
+ background-image: linear-gradient(to bottom, rgba(60, 69, 71, 0.7));
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(238, 238, 236, 0.3);
- background-color: #202526; }
- .osd scale trough slider:hover {
- color: white;
- border-color: rgba(0, 0, 0, 0.7);
- background-image: linear-gradient(to bottom, rgba(60, 69, 71, 0.7));
- 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(238, 238, 236, 0.3); }
- .osd scale trough slider:active {
- color: white;
- border-color: rgba(0, 0, 0, 0.7);
- background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.7));
- background-clip: padding-box;
- box-shadow: none;
- text-shadow: none;
- -gtk-icon-shadow: none;
- outline-color: rgba(238, 238, 236, 0.3); }
- .osd scale trough slider:backdrop {
- color: #eeeeec;
- border-color: rgba(0, 0, 0, 0.7);
- background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.7));
- background-clip: padding-box;
- box-shadow: none;
- text-shadow: none;
- -gtk-icon-shadow: none; }
- scale trough highlight {
- background-image: linear-gradient(to bottom, #215d9c 2px, #266cb5);
- border: 1px solid #1c1f1f;
- border-radius: 3px;
- box-shadow: 0 1px rgba(238, 238, 236, 0.1); }
- scale trough highlight.vertical {
- background-image: linear-gradient(to right, #215d9c 2px, #266cb5); }
- scale trough highlight:backdrop {
- border-color: #0f2b48;
- background-color: #215d9c;
- box-shadow: none; }
- scale trough fill {
- background: none;
- background-color: red;
- border: 1px solid #1c1f1f;
- border-radius: 3px;
- box-shadow: 0 1px rgba(238, 238, 236, 0.1); }
- scale trough:insensitive, scale trough.vertical:insensitive {
- border-color: #1c1f1f;
- background-image: none;
- background-color: #333636;
- box-shadow: 0 1px rgba(238, 238, 236, 0.1); }
- scale trough:backdrop {
- border-color: #1f2222;
- background-color: #2b2f2f;
- box-shadow: none; }
- scale trough:backdrop:insensitive, scale trough .highlight:backdrop:insensitive {
- border-color: #1f2222;
- background-color: #333636; }
- .osd scale trough {
- border-color: rgba(0, 0, 0, 0.7);
- box-shadow: none;
- margin: 9px;
- background-color: rgba(0, 0, 0, 0.5);
- outline-color: rgba(238, 238, 236, 0.2);
- outline-offset: -8px; }
- .osd scale trough.fine-tune {
- margin: 7px; }
- .osd scale trough.highlight {
- background-image: none;
- background-color: #215d9c; }
- .osd scale trough:insensitive, .osd scale trough:backdrop:insensitive {
- border-color: transparent;
- background-color: transparent; }
- .osd scale trough:backdrop {
+ outline-color: rgba(238, 238, 236, 0.3); }
+ .osd scale slider:active {
+ color: white;
border-color: rgba(0, 0, 0, 0.7);
- background-image: none; }
- row:selected scale {
- border-color: #0f2b48;
- box-shadow: inset 1px 1px rgba(0, 0, 0, 0.1); }
- row:selected scale:backdrop {
- box-shadow: none; }
- row:selected scale.highlight:backdrop {
- border-color: #0f2b48; }
- row:selected scale:insensitive, row:selected scale.highlight:insensitive {
- border-color: #215d9c;
- box-shadow: none;
- background-color: #90aece;
- background-image: none; }
- row:selected scale:insensitive:backdrop, row:selected scale.highlight:insensitive:backdrop {
- background-color: #90aece; }
-
-scale marks {
- color: alpha(currentColor,0.5); }
-
-scale trough:first-child:not(:last-child) slider {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-below-dark.png"),
url("assets/slider-horz-scale-has-marks-below-dark 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale trough:first-child:not(:last-child) slider:hover {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-below-hover-dark.png"),
url("assets/slider-horz-scale-has-marks-below-hover-dark 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale trough:first-child:not(:last-child) slider:active {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-below-active-dark.png"),
url("assets/slider-horz-scale-has-marks-below-active-dark 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale trough:first-child:not(:last-child) slider:insensitive {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-below-insensitive-dark.png"),
url("assets/slider-horz-scale-has-marks-below-insensitive-dark 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale trough:first-child:not(:last-child) slider:backdrop {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-below-backdrop-dark.png"),
url("assets/slider-horz-scale-has-marks-below-backdrop-dark 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale trough:first-child:not(:last-child) slider:backdrop:insensitive {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image:
-gtk-scaled(url("assets/slider-horz-scale-has-marks-below-backdrop-insensitive-dark.png"),
url("assets/slider-horz-scale-has-marks-below-backdrop-insensitive-dark 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-
-scale trough:not(:first-child):last-child slider {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above-dark.png"),
url("assets/slider-horz-scale-has-marks-above-dark 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale trough:not(:first-child):last-child slider:hover {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above-hover-dark.png"),
url("assets/slider-horz-scale-has-marks-above-hover-dark 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale trough:not(:first-child):last-child slider:active {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above-active-dark.png"),
url("assets/slider-horz-scale-has-marks-above-active-dark 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale trough:not(:first-child):last-child slider:insensitive {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above-insensitive-dark.png"),
url("assets/slider-horz-scale-has-marks-above-insensitive-dark 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale trough:not(:first-child):last-child slider:backdrop {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above-backdrop-dark.png"),
url("assets/slider-horz-scale-has-marks-above-backdrop-dark 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale trough:not(:first-child):last-child slider:backdrop:insensitive {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image:
-gtk-scaled(url("assets/slider-horz-scale-has-marks-above-backdrop-insensitive-dark.png"),
url("assets/slider-horz-scale-has-marks-above-backdrop-insensitive-dark 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-
-scale.vertical trough:first-child:not(:last-child) slider {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-vert-scale-has-marks-below-dark.png"),
url("assets/slider-vert-scale-has-marks-below-dark 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale.vertical trough:first-child:not(:last-child) slider:hover {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-vert-scale-has-marks-below-hover-dark.png"),
url("assets/slider-vert-scale-has-marks-below-hover-dark 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale.vertical trough:first-child:not(:last-child) slider:active {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-vert-scale-has-marks-below-active-dark.png"),
url("assets/slider-vert-scale-has-marks-below-active-dark 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale.vertical trough:first-child:not(:last-child) slider:insensitive {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-vert-scale-has-marks-below-insensitive-dark.png"),
url("assets/slider-vert-scale-has-marks-below-insensitive-dark 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale.vertical trough:first-child:not(:last-child) slider:backdrop {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-vert-scale-has-marks-below-backdrop-dark.png"),
url("assets/slider-vert-scale-has-marks-below-backdrop-dark 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale.vertical trough:first-child:not(:last-child) slider:backdrop:insensitive {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image:
-gtk-scaled(url("assets/slider-vert-scale-has-marks-below-backdrop-insensitive-dark.png"),
url("assets/slider-vert-scale-has-marks-below-backdrop-insensitive-dark 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-
-scale.vertical trough:not(:first-child):last-child slider {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-vert-scale-has-marks-above-dark.png"),
url("assets/slider-vert-scale-has-marks-above-dark 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale.vertical trough:not(:first-child):last-child slider:hover {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-vert-scale-has-marks-above-hover-dark.png"),
url("assets/slider-vert-scale-has-marks-above-hover-dark 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale.vertical trough:not(:first-child):last-child slider:active {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-vert-scale-has-marks-above-active-dark.png"),
url("assets/slider-vert-scale-has-marks-above-active-dark 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale.vertical trough:not(:first-child):last-child slider:insensitive {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-vert-scale-has-marks-above-insensitive-dark.png"),
url("assets/slider-vert-scale-has-marks-above-insensitive-dark 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale.vertical trough:not(:first-child):last-child slider:backdrop {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-vert-scale-has-marks-above-backdrop-dark.png"),
url("assets/slider-vert-scale-has-marks-above-backdrop-dark 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale.vertical trough:not(:first-child):last-child slider:backdrop:insensitive {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image:
-gtk-scaled(url("assets/slider-vert-scale-has-marks-above-backdrop-insensitive-dark.png"),
url("assets/slider-vert-scale-has-marks-above-backdrop-insensitive-dark 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-
-scale trough:not(:first-child):last-child {
- margin: 14px 10px 10px 10px; }
-
-scale trough:first-child:not(:last-child) {
- margin: 10px 10px 14px 10px; }
-
-scale.vertical trough:not(:first-child):last-child {
- margin: 10px 10px 10px 14px; }
-
-scale.vertical trough:first-child:not(:last-child) {
- margin: 10px 14px 10px 10px; }
-
-scale.fine-tune trough:not(:first-child):last-child {
- margin: 12px 8px 8px 8px; }
-
-scale.fine-tune trough:first-child:not(:last-child) {
- margin: 8px 8px 12px 8px; }
+ background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.7));
+ background-clip: padding-box;
+ box-shadow: none;
+ text-shadow: none;
+ -gtk-icon-shadow: none;
+ outline-color: rgba(238, 238, 236, 0.3); }
+ .osd scale slider:insensitive {
+ color: #878a89;
+ border-color: rgba(0, 0, 0, 0.7);
+ background-image: linear-gradient(to bottom, rgba(53, 57, 58, 0.5));
+ background-clip: padding-box;
+ box-shadow: none;
+ text-shadow: none;
+ -gtk-icon-shadow: none; }
+ .osd scale slider:backdrop {
+ color: #eeeeec;
+ border-color: rgba(0, 0, 0, 0.7);
+ background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.7));
+ background-clip: padding-box;
+ box-shadow: none;
+ text-shadow: none;
+ -gtk-icon-shadow: none; }
-scale.vertical.fine-tune trough:not(:first-child):last-child {
- margin: 8px 8px 8px 12px; }
+scale trough, 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.1); }
+ scale trough:insensitive, progressbar trough:insensitive {
+ background-color: #333636;
+ box-shadow: 0 1px rgba(238, 238, 236, 0.1); }
+ scale trough:backdrop, progressbar trough:backdrop, progressbar:backdrop trough {
+ background-color: #303535;
+ border-color: #1f2222;
+ box-shadow: none; }
+ scale trough:backdrop:insensitive, progressbar trough:backdrop:insensitive, progressbar:backdrop
trough:insensitive {
+ background-color: #333636; }
+ .osd scale trough, scale .osd trough, .osd progressbar trough, progressbar .osd trough {
+ border-color: rgba(0, 0, 0, 0.7);
+ background-color: rgba(0, 0, 0, 0.5);
+ box-shadow: none;
+ outline-color: rgba(238, 238, 236, 0.2); }
+ .osd scale trough:insensitive, scale .osd trough:insensitive, .osd progressbar trough:insensitive,
progressbar .osd trough:insensitive {
+ background-color: rgba(53, 57, 58, 0.5); }
-scale.vertical.fine-tune trough:first-child:not(:last-child) {
- margin: 8px 12px 8px 8px; }
+scale highlight, progressbar progress {
+ border: 1px solid #0f2b48;
+ border-radius: 3px;
+ background-color: #215d9c; }
+ scale highlight:insensitive, progressbar progress:insensitive {
+ background-color: transparent;
+ border-color: transparent; }
+ scale highlight:backdrop, progressbar progress:backdrop, progressbar:backdrop progress {
+ border-color: #0f2b48; }
+ scale highlight:backdrop:insensitive, progressbar progress:backdrop:insensitive, progressbar:backdrop
progress:insensitive {
+ background-color: transparent;
+ border-color: transparent; }
+ .osd scale highlight, scale .osd highlight, .osd progressbar progress, progressbar .osd progress {
+ border-color: rgba(0, 0, 0, 0.7); }
+ .osd scale highlight:insensitive, scale .osd highlight:insensitive, .osd progressbar
progress:insensitive, progressbar .osd progress:insensitive {
+ border-color: transparent; }
/*****************
* Progress bars *
@@ -3312,60 +3067,23 @@ progressbar {
padding: 0;
font-size: smaller;
color: rgba(238, 238, 236, 0.4);
- box-shadow: inset 1px 1px rgba(0, 0, 0, 0.1), 0 1px rgba(238, 238, 236, 0.1); }
+ box-shadow: 0 1px rgba(238, 238, 236, 0.1); }
progressbar:backdrop {
- color: #5d6767; }
- progressbar.osd {
- -GtkProgressBar-min-horizontal-bar-height: 3; }
- progressbar.osd trough {
- border-style: none;
- background-color: transparent;
- box-shadow: none; }
- progressbar trough {
- border: 1px solid #1c1f1f;
- border-radius: 3px;
- background-color: #2f3434; }
- progressbar trough:backdrop {
- border-color: #1f2222;
- background-color: #303535;
- box-shadow: 0 1px rgba(255, 255, 255, 0); }
-
-progressbar.horizontal progress {
- background-image: linear-gradient(to bottom, #215d9c 2px, #266cb5);
- border: 1px solid #0f2b48;
- border-radius: 1.5px;
- box-shadow: none; }
- progressbar.horizontal progress.left {
- border-top-left-radius: 3px;
- border-bottom-left-radius: 3px; }
- progressbar.horizontal progress.right {
- border-top-right-radius: 3px;
- border-bottom-right-radius: 3px; }
- progressbar.horizontal progress.left.right {
- box-shadow: none; }
-
-progressbar.vertical progress {
- background-image: linear-gradient(to right, #215d9c 2px, #266cb5);
- border: 1px solid #0f2b48;
- border-radius: 1.5px;
- box-shadow: none; }
- progressbar.vertical progress.bottom {
- border-bottom-left-radius: 3px;
- border-bottom-right-radius: 3px;
box-shadow: none; }
- progressbar.vertical progress.top {
- border-top-left-radius: 3px;
- border-top-right-radius: 3px; }
- progressbar.vertical progress:backdrop {
- border-color: #0f2b48;
- background-image: none;
- background-color: #215d9c;
- box-shadow: none; }
- progressbar.vertical progress.osd {
- background-image: none;
- background-color: #215d9c;
- border-style: none;
- border-radius: 0; }
+ progressbar progress {
+ border-radius: 1.5px; }
+ progressbar progress.left {
+ border-top-left-radius: 3px;
+ border-bottom-left-radius: 3px; }
+ progressbar progress.right {
+ border-top-right-radius: 3px;
+ border-bottom-right-radius: 3px; }
+ progressbar progress.top {
+ border-top-right-radius: 3px;
+ border-top-left-radius: 3px; }
+ progressbar progress.bottom {
+ border-bottom-right-radius: 3px;
+ border-bottom-left-radius: 3px; }
/*************
* Level Bar *
diff --git a/gtk/theme/Adwaita/gtk-contained.css b/gtk/theme/Adwaita/gtk-contained.css
index cac2b0e..66f0d69 100644
--- a/gtk/theme/Adwaita/gtk-contained.css
+++ b/gtk/theme/Adwaita/gtk-contained.css
@@ -3075,397 +3075,152 @@ scale {
-GtkRange-slider-width: 24;
-GtkRange-trough-border: 2;
outline-offset: -9px;
- outline-radius: 4px; }
+ outline-radius: 6px; }
scale.fine-tune {
outline-offset: -7px;
- outline-radius: 6px; }
- scale.fine-tune highlight, scale.fine-tune fill, scale.fine-tune trough {
+ outline-radius: 8px; }
+ scale.fine-tune trough,
+ scale.fine-tune fill,
+ scale.fine-tune highlight {
+ margin: 10px;
border-radius: 4px; }
- scale.fine-tune highlight:not(:first-child):not(:last-child), scale.fine-tune highlight:only-child,
scale.fine-tune fill:not(:first-child):not(:last-child), scale.fine-tune fill:only-child, scale.fine-tune
trough:not(:first-child):not(:last-child), scale.fine-tune trough:only-child {
- margin: 10px; }
- scale trough:not(:first-child):not(:last-child), scale trough:only-child, scale
fill:not(:first-child):not(:last-child), scale fill:only-child, scale
highlight:not(:first-child):not(:last-child), scale highlight:only-child {
+ scale trough,
+ scale fill,
+ scale highlight {
margin: 12px; }
- scale trough:not(:first-child):not(:last-child) slider, scale trough:only-child slider {
+ scale:not(.vertical) slider {
margin: 2px 0; }
- scale.vertical trough:not(:first-child):not(:last-child) slider, scale.vertical trough:only-child slider {
+ scale.vertical slider {
margin: 0 2px; }
- scale trough {
- border: 1px solid #a1a1a1;
- border-radius: 3px;
- background-color: #cfcfcf;
- box-shadow: inset 1px 1px rgba(0, 0, 0, 0.1), 0 1px white; }
- scale trough slider {
+ scale slider {
+ color: #2e3436;
+ outline-color: rgba(46, 52, 54, 0.3);
+ border-color: #a1a1a1;
+ background-image: linear-gradient(to bottom, #fafafa, #ededed 40%, #e0e0e0);
+ 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);
+ border: 1px solid #999999;
+ border-radius: 100%; }
+ scale slider:hover {
color: #2e3436;
outline-color: rgba(46, 52, 54, 0.3);
border-color: #a1a1a1;
- background-image: linear-gradient(to bottom, #fafafa, #ededed 40%, #e0e0e0);
+ background-image: linear-gradient(to bottom, white, #f7f7f7 40%, #ededed);
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 white;
- border: 1px solid;
- border-radius: 50%;
- border-color: #999999;
- box-shadow: inset 0 1px white, inset 0 -2px #ededed, inset 0 -1px #c7c7c7; }
- scale trough slider:hover {
- color: #2e3436;
- outline-color: rgba(46, 52, 54, 0.3);
- border-color: #a1a1a1;
- background-image: linear-gradient(to bottom, white, #f7f7f7 40%, #ededed);
- 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 white;
- border-color: #999999;
- border-radius: 50%;
- box-shadow: inset 0 1px white, inset 0 -2px white, inset 0 -1px #d6d6d6; }
- scale trough slider:insensitive {
- border-style: solid;
- border-radius: 50%;
- background-image: linear-gradient(to bottom, #f4f4f4);
- box-shadow: none; }
- scale trough slider:backdrop {
- border-style: solid;
- border-radius: 50%;
- border-color: #a1a1a1;
- background-image: linear-gradient(to bottom, #ededed);
- box-shadow: none; }
- scale trough slider:backdrop:insensitive {
+ box-shadow: inset 0 1px white, 0 1px rgba(0, 0, 0, 0.1); }
+ scale slider:active {
+ border-color: #184472; }
+ scale slider:insensitive {
+ color: #8e9192;
+ border-color: #a1a1a1;
+ background-image: linear-gradient(to bottom, #f4f4f4);
+ text-shadow: none;
+ -gtk-icon-shadow: none;
+ box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px white; }
+ scale slider:insensitive > .label {
+ color: inherit; }
+ scale slider:backdrop {
+ color: #8e9192;
+ border-color: darkgray;
+ background-image: linear-gradient(to bottom, #ededed);
+ text-shadow: none;
+ -gtk-icon-shadow: none;
+ box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(255, 255, 255, 0); }
+ scale slider:backdrop:insensitive {
color: #c7c7c7;
border-color: darkgray;
background-image: linear-gradient(to bottom, #f4f4f4);
text-shadow: none;
-gtk-icon-shadow: none;
box-shadow: inset 0 1px rgba(255, 255, 255, 0), 0 1px rgba(255, 255, 255, 0); }
- scale trough slider:backdrop:insensitive > .label {
+ scale slider:backdrop:insensitive > .label {
color: inherit; }
- scale trough slider:active {
- color: #2e3436;
- outline-color: rgba(46, 52, 54, 0.3);
- border-color: #a1a1a1;
- background-image: linear-gradient(to bottom, #d6d6d6, gainsboro 40%, #e0e0e0);
- 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(0, 0, 0, 0.07), inset 0 2px 1px -2px rgba(0, 0, 0, 0.6), 0 1px white;
- border: 1px solid #153d65; }
- .osd scale trough slider {
- color: #eeeeec;
+ .osd scale slider {
+ color: #eeeeec;
+ border-color: rgba(0, 0, 0, 0.7);
+ background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.7));
+ 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(238, 238, 236, 0.3);
+ border-color: rgba(0, 0, 0, 0.7);
+ background-color: #202526; }
+ .osd scale slider:hover {
+ color: white;
border-color: rgba(0, 0, 0, 0.7);
- background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.7));
+ background-image: linear-gradient(to bottom, rgba(60, 69, 71, 0.7));
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(238, 238, 236, 0.3);
- background-color: #202526; }
- .osd scale trough slider:hover {
- color: white;
- border-color: rgba(0, 0, 0, 0.7);
- background-image: linear-gradient(to bottom, rgba(60, 69, 71, 0.7));
- 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(238, 238, 236, 0.3); }
- .osd scale trough slider:active {
- color: white;
- border-color: rgba(0, 0, 0, 0.7);
- background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.7));
- background-clip: padding-box;
- box-shadow: none;
- text-shadow: none;
- -gtk-icon-shadow: none;
- outline-color: rgba(238, 238, 236, 0.3); }
- .osd scale trough slider:backdrop {
- color: #eeeeec;
- border-color: rgba(0, 0, 0, 0.7);
- background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.7));
- background-clip: padding-box;
- box-shadow: none;
- text-shadow: none;
- -gtk-icon-shadow: none; }
- scale trough highlight {
- background-image: linear-gradient(to bottom, #4a90d9 2px, #63a0de);
- border: 1px solid #a1a1a1;
- border-radius: 3px;
- box-shadow: 0 1px white; }
- scale trough highlight.vertical {
- background-image: linear-gradient(to right, #4a90d9 2px, #63a0de); }
- scale trough highlight:backdrop {
- border-color: #4a90d9;
- background-color: #4a90d9;
- box-shadow: none; }
- scale trough fill {
- background: none;
- background-color: red;
- border: 1px solid #a1a1a1;
- border-radius: 3px;
- box-shadow: 0 1px white; }
- scale trough:insensitive, scale trough.vertical:insensitive {
- border-color: #a1a1a1;
- background-image: none;
- background-color: #f4f4f4;
- box-shadow: 0 1px white; }
- scale trough:backdrop {
- border-color: darkgray;
- background-color: #c7c7c7;
- box-shadow: none; }
- scale trough:backdrop:insensitive, scale trough .highlight:backdrop:insensitive {
- border-color: darkgray;
- background-color: #f4f4f4; }
- .osd scale trough {
- border-color: rgba(0, 0, 0, 0.7);
- box-shadow: none;
- margin: 9px;
- background-color: rgba(0, 0, 0, 0.5);
- outline-color: rgba(238, 238, 236, 0.2);
- outline-offset: -8px; }
- .osd scale trough.fine-tune {
- margin: 7px; }
- .osd scale trough.highlight {
- background-image: none;
- background-color: #4a90d9; }
- .osd scale trough:insensitive, .osd scale trough:backdrop:insensitive {
- border-color: transparent;
- background-color: transparent; }
- .osd scale trough:backdrop {
+ outline-color: rgba(238, 238, 236, 0.3); }
+ .osd scale slider:active {
+ color: white;
border-color: rgba(0, 0, 0, 0.7);
- background-image: none; }
- row:selected scale {
- border-color: #184472;
- box-shadow: inset 1px 1px rgba(0, 0, 0, 0.1); }
- row:selected scale:backdrop {
- box-shadow: none; }
- row:selected scale.highlight:backdrop {
- border-color: #184472; }
- row:selected scale:insensitive, row:selected scale.highlight:insensitive {
- border-color: #4a90d9;
- box-shadow: none;
- background-color: #a5c8ec;
- background-image: none; }
- row:selected scale:insensitive:backdrop, row:selected scale.highlight:insensitive:backdrop {
- background-color: #a5c8ec; }
-
-scale marks {
- color: alpha(currentColor,0.5); }
-
-scale trough:first-child:not(:last-child) slider {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-below.png"),
url("assets/slider-horz-scale-has-marks-below 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale trough:first-child:not(:last-child) slider:hover {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-below-hover.png"),
url("assets/slider-horz-scale-has-marks-below-hover 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale trough:first-child:not(:last-child) slider:active {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-below-active.png"),
url("assets/slider-horz-scale-has-marks-below-active 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale trough:first-child:not(:last-child) slider:insensitive {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-below-insensitive.png"),
url("assets/slider-horz-scale-has-marks-below-insensitive 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale trough:first-child:not(:last-child) slider:backdrop {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-below-backdrop.png"),
url("assets/slider-horz-scale-has-marks-below-backdrop 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale trough:first-child:not(:last-child) slider:backdrop:insensitive {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-below-backdrop-insensitive.png"),
url("assets/slider-horz-scale-has-marks-below-backdrop-insensitive 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-
-scale trough:not(:first-child):last-child slider {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above.png"),
url("assets/slider-horz-scale-has-marks-above 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale trough:not(:first-child):last-child slider:hover {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above-hover.png"),
url("assets/slider-horz-scale-has-marks-above-hover 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale trough:not(:first-child):last-child slider:active {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above-active.png"),
url("assets/slider-horz-scale-has-marks-above-active 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale trough:not(:first-child):last-child slider:insensitive {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above-insensitive.png"),
url("assets/slider-horz-scale-has-marks-above-insensitive 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale trough:not(:first-child):last-child slider:backdrop {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above-backdrop.png"),
url("assets/slider-horz-scale-has-marks-above-backdrop 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale trough:not(:first-child):last-child slider:backdrop:insensitive {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-horz-scale-has-marks-above-backdrop-insensitive.png"),
url("assets/slider-horz-scale-has-marks-above-backdrop-insensitive 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-
-scale.vertical trough:first-child:not(:last-child) slider {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-vert-scale-has-marks-below.png"),
url("assets/slider-vert-scale-has-marks-below 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale.vertical trough:first-child:not(:last-child) slider:hover {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-vert-scale-has-marks-below-hover.png"),
url("assets/slider-vert-scale-has-marks-below-hover 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale.vertical trough:first-child:not(:last-child) slider:active {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-vert-scale-has-marks-below-active.png"),
url("assets/slider-vert-scale-has-marks-below-active 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale.vertical trough:first-child:not(:last-child) slider:insensitive {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-vert-scale-has-marks-below-insensitive.png"),
url("assets/slider-vert-scale-has-marks-below-insensitive 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale.vertical trough:first-child:not(:last-child) slider:backdrop {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-vert-scale-has-marks-below-backdrop.png"),
url("assets/slider-vert-scale-has-marks-below-backdrop 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale.vertical trough:first-child:not(:last-child) slider:backdrop:insensitive {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-vert-scale-has-marks-below-backdrop-insensitive.png"),
url("assets/slider-vert-scale-has-marks-below-backdrop-insensitive 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-
-scale.vertical trough:not(:first-child):last-child slider {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-vert-scale-has-marks-above.png"),
url("assets/slider-vert-scale-has-marks-above 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale.vertical trough:not(:first-child):last-child slider:hover {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-vert-scale-has-marks-above-hover.png"),
url("assets/slider-vert-scale-has-marks-above-hover 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale.vertical trough:not(:first-child):last-child slider:active {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-vert-scale-has-marks-above-active.png"),
url("assets/slider-vert-scale-has-marks-above-active 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale.vertical trough:not(:first-child):last-child slider:insensitive {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-vert-scale-has-marks-above-insensitive.png"),
url("assets/slider-vert-scale-has-marks-above-insensitive 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale.vertical trough:not(:first-child):last-child slider:backdrop {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-vert-scale-has-marks-above-backdrop.png"),
url("assets/slider-vert-scale-has-marks-above-backdrop 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-scale.vertical trough:not(:first-child):last-child slider:backdrop:insensitive {
- border-style: none;
- border-radius: 0;
- background-color: transparent;
- background-image: -gtk-scaled(url("assets/slider-vert-scale-has-marks-above-backdrop-insensitive.png"),
url("assets/slider-vert-scale-has-marks-above-backdrop-insensitive 2 png"));
- background-repeat: no-repeat;
- background-position: center;
- box-shadow: none; }
-
-scale trough:not(:first-child):last-child {
- margin: 14px 10px 10px 10px; }
-
-scale trough:first-child:not(:last-child) {
- margin: 10px 10px 14px 10px; }
-
-scale.vertical trough:not(:first-child):last-child {
- margin: 10px 10px 10px 14px; }
-
-scale.vertical trough:first-child:not(:last-child) {
- margin: 10px 14px 10px 10px; }
-
-scale.fine-tune trough:not(:first-child):last-child {
- margin: 12px 8px 8px 8px; }
-
-scale.fine-tune trough:first-child:not(:last-child) {
- margin: 8px 8px 12px 8px; }
+ background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.7));
+ background-clip: padding-box;
+ box-shadow: none;
+ text-shadow: none;
+ -gtk-icon-shadow: none;
+ outline-color: rgba(238, 238, 236, 0.3); }
+ .osd scale slider:insensitive {
+ color: #878a89;
+ border-color: rgba(0, 0, 0, 0.7);
+ background-image: linear-gradient(to bottom, rgba(53, 57, 58, 0.5));
+ background-clip: padding-box;
+ box-shadow: none;
+ text-shadow: none;
+ -gtk-icon-shadow: none; }
+ .osd scale slider:backdrop {
+ color: #eeeeec;
+ border-color: rgba(0, 0, 0, 0.7);
+ background-image: linear-gradient(to bottom, rgba(32, 37, 38, 0.7));
+ background-clip: padding-box;
+ box-shadow: none;
+ text-shadow: none;
+ -gtk-icon-shadow: none; }
-scale.vertical.fine-tune trough:not(:first-child):last-child {
- margin: 8px 8px 8px 12px; }
+scale trough, progressbar trough {
+ border: 1px solid #a1a1a1;
+ border-radius: 3px;
+ background-color: #d2d2d2;
+ box-shadow: inset 1px 1px rgba(0, 0, 0, 0.1), 0 1px white; }
+ scale trough:insensitive, progressbar trough:insensitive {
+ background-color: #f4f4f4;
+ box-shadow: 0 1px white; }
+ scale trough:backdrop, progressbar trough:backdrop, progressbar:backdrop trough {
+ background-color: #d5d5d5;
+ border-color: darkgray;
+ box-shadow: none; }
+ scale trough:backdrop:insensitive, progressbar trough:backdrop:insensitive, progressbar:backdrop
trough:insensitive {
+ background-color: #f4f4f4; }
+ .osd scale trough, scale .osd trough, .osd progressbar trough, progressbar .osd trough {
+ border-color: rgba(0, 0, 0, 0.7);
+ background-color: rgba(0, 0, 0, 0.5);
+ box-shadow: none;
+ outline-color: rgba(238, 238, 236, 0.2); }
+ .osd scale trough:insensitive, scale .osd trough:insensitive, .osd progressbar trough:insensitive,
progressbar .osd trough:insensitive {
+ background-color: rgba(53, 57, 58, 0.5); }
-scale.vertical.fine-tune trough:first-child:not(:last-child) {
- margin: 8px 12px 8px 8px; }
+scale highlight, progressbar progress {
+ border: 1px solid #184472;
+ border-radius: 3px;
+ background-color: #4a90d9; }
+ scale highlight:insensitive, progressbar progress:insensitive {
+ background-color: transparent;
+ border-color: transparent; }
+ scale highlight:backdrop, progressbar progress:backdrop, progressbar:backdrop progress {
+ border-color: #4a90d9; }
+ scale highlight:backdrop:insensitive, progressbar progress:backdrop:insensitive, progressbar:backdrop
progress:insensitive {
+ background-color: transparent;
+ border-color: transparent; }
+ .osd scale highlight, scale .osd highlight, .osd progressbar progress, progressbar .osd progress {
+ border-color: rgba(0, 0, 0, 0.7); }
+ .osd scale highlight:insensitive, scale .osd highlight:insensitive, .osd progressbar
progress:insensitive, progressbar .osd progress:insensitive {
+ border-color: transparent; }
/*****************
* Progress bars *
@@ -3474,60 +3229,23 @@ progressbar {
padding: 0;
font-size: smaller;
color: rgba(46, 52, 54, 0.4);
- box-shadow: inset 1px 1px rgba(0, 0, 0, 0.1), 0 1px white; }
+ box-shadow: 0 1px white; }
progressbar:backdrop {
- color: #c7c7c7; }
- progressbar.osd {
- -GtkProgressBar-min-horizontal-bar-height: 3; }
- progressbar.osd trough {
- border-style: none;
- background-color: transparent;
- box-shadow: none; }
- progressbar trough {
- border: 1px solid #a1a1a1;
- border-radius: 3px;
- background-color: #d2d2d2; }
- progressbar trough:backdrop {
- border-color: darkgray;
- background-color: #d5d5d5;
- box-shadow: 0 1px rgba(255, 255, 255, 0); }
-
-progressbar.horizontal progress {
- background-image: linear-gradient(to bottom, #4a90d9 2px, #63a0de);
- border: 1px solid #184472;
- border-radius: 1.5px;
- box-shadow: none; }
- progressbar.horizontal progress.left {
- border-top-left-radius: 3px;
- border-bottom-left-radius: 3px; }
- progressbar.horizontal progress.right {
- border-top-right-radius: 3px;
- border-bottom-right-radius: 3px; }
- progressbar.horizontal progress.left.right {
- box-shadow: none; }
-
-progressbar.vertical progress {
- background-image: linear-gradient(to right, #4a90d9 2px, #63a0de);
- border: 1px solid #184472;
- border-radius: 1.5px;
- box-shadow: none; }
- progressbar.vertical progress.bottom {
- border-bottom-left-radius: 3px;
- border-bottom-right-radius: 3px;
box-shadow: none; }
- progressbar.vertical progress.top {
- border-top-left-radius: 3px;
- border-top-right-radius: 3px; }
- progressbar.vertical progress:backdrop {
- border-color: #4a90d9;
- background-image: none;
- background-color: #4a90d9;
- box-shadow: none; }
- progressbar.vertical progress.osd {
- background-image: none;
- background-color: #4a90d9;
- border-style: none;
- border-radius: 0; }
+ progressbar progress {
+ border-radius: 1.5px; }
+ progressbar progress.left {
+ border-top-left-radius: 3px;
+ border-bottom-left-radius: 3px; }
+ progressbar progress.right {
+ border-top-right-radius: 3px;
+ border-bottom-right-radius: 3px; }
+ progressbar progress.top {
+ border-top-right-radius: 3px;
+ border-top-left-radius: 3px; }
+ progressbar progress.bottom {
+ border-bottom-right-radius: 3px;
+ border-bottom-left-radius: 3px; }
/*************
* Level Bar *
[
Date Prev][
Date Next] [
Thread Prev][
Thread Next]
[
Thread Index]
[
Date Index]
[
Author Index]
