GTK3 ContrastHigh themes: adjust GtkScale and GtkProgressbar

author: raveit65 <[email protected]> 2015-09-17 21:00:42 +0200
committer: raveit65 <[email protected]> 2015-09-17 21:00:42 +0200
commit: a38e8c92e18fc661478f1ae46fc782d8a34b3d25 (patch)
tree: cede630028b232d8ec2a9c6a0a6c42175c4858d7 /desktop-themes/ContrastHigh
parent: 4ec7f4fbbd8d5f8ec0eb6d0456e063df2958eefe (diff)
download: mate-themes-a38e8c92e18fc661478f1ae46fc782d8a34b3d25.tar.bz2
mate-themes-a38e8c92e18fc661478f1ae46fc782d8a34b3d25.tar.xz
2 files changed, 125 insertions, 274 deletions
diff --git a/desktop-themes/ContrastHigh/gtk-3.0/gtk-widgets.css b/desktop-themes/ContrastHigh/gtk-3.0/gtk-widgets.css
index 1dd39088..1c8bc938 100644
--- a/desktop-themes/ContrastHigh/gtk-3.0/gtk-widgets.css
+++ b/desktop-themes/ContrastHigh/gtk-3.0/gtk-widgets.css
@@ -537,8 +537,8 @@ GtkComboBox .button {
 
 GtkProgressBar {
 /* FIXME - Not working 3.14 */
- -GtkProgressBar-min-horizontal-bar-height: 16;
- -GtkProgressBar-min-vertical-bar-width: 16;
+ -GtkProgressBar-min-horizontal-bar-height: 20;
+ -GtkProgressBar-min-vertical-bar-width: 20;
 border-radius: 6px;
 }
 
@@ -1149,89 +1149,142 @@ GtkMessageDialog {
 box-shadow: none;
 }
 
-/**********
- * Scales *
- **********/
-GtkScale.trough {
- background-image: linear-gradient(to bottom,
- transparent,
- transparent 14px,
- @theme_scale_trough_bg 14px,
- @theme_scale_trough_bg 16px,
- transparent 16px,
- transparent);
-
- background-color:transparent;
- border-style: none;
+/************
+ * GtkScale *
+ ************/
+
+.scale,
+.scale.scale-has-marks-above.scale-has-marks-below {
+ -GtkScale-slider-length: 28;
+ -GtkRange-slider-width: 28;
+ -GtkRange-trough-border: 2;
 }
 
-GtkScale.trough:insensitive {
- background-image: linear-gradient(to bottom,
- transparent,
- transparent 14px,
- @theme_scale_trough_insensitive_bg 14px,
- @theme_scale_trough_insensitive_bg 16px,
- transparent 16px,
- transparent);
- background-color: transparent;
+.scale.fine-tune.trough,
+.scale.scale-has-marks-above.scale-has-marks-below.fine-tune.trough {
+ border-radius: 4px;
 }
 
-GtkScale.trough.vertical {
- background-image: linear-gradient(to right,
- transparent,
- transparent 14px,
- @theme_scale_trough_bg 14px,
- @theme_scale_trough_bg 16px,
- transparent 16px,
- transparent);
- background-color:transparent;
- border-style: none;
+.scale.slider,
+.scale.scale-has-marks-above.scale-has-marks-below.slider {
+ border-width: 2px;
+ border-style: solid;
+ background-color: @theme_button_bg;
+ padding: 1px 4px;
+ color: @theme_button_fg;
+ border-radius: 50%;
+ border-color: darker(@theme_border_color);
+ box-shadow: inset 0 1px white,
+ inset 0 -2px @theme_bg_color,
+ inset 0 -1px mix(@theme_bg_color,@theme_border_color, 0.5);
 }
 
-GtkScale.trough.vertical:insensitive {
- background-image: linear-gradient(to right,
- transparent,
- transparent 14px,
- @theme_scale_trough_insensitive_bg 14px,
- @theme_scale_trough_insensitive_bg 16px,
- transparent 16px,
- transparent);
+.scale.slider:hover,
+.scale.scale-has-marks-above.scale-has-marks-below.slider:hover {
+ border-width: 2px;
+ border-style: solid;
+ background-color: @theme_selected_bg_color;
+ padding: 1px 4px;
+ color: @theme_button_fg;
+ border-color: darker(@theme_border_color);
+ border-radius: 50%;
+ box-shadow: inset 0 1px white,
+ inset 0 -2px white,
+ inset 0 -1px mix(@theme_bg_color,@theme_border_color, 0.5);
 }
 
-GtkScale.slider {
- background-clip: border-box;
- background-color: @theme_button_bg;
+.scale.slider:insensitive,
+.scale.scale-has-marks-above.scale-has-marks-below.slider:insensitive {
+ border-style: solid; /* needed for double marks scales or they'll get overridden */
+ border-color: @theme_button_insensitive_border;
+ border-radius: 50%;
+ background-image: linear-gradient(to bottom, @theme_insensitive_bg);
+ box-shadow: none;
+}
 
- border-radius: 15px;
- border-color: @theme_selected_bg_color;
+.scale.slider:active,
+.scale.scale-has-marks-above.scale-has-marks-below.slider:active {
+ border: 1px solid darker(@theme_selected_borders_color);
+}
+
+.scale.trough,
+.scale.scale-has-marks-above.scale-has-marks-below.trough.vertical {
+ border-width: 1px;
 border-style: solid;
+ border-radius: 3px;
+ border-color: @theme_border_color;
+ background-color: shade(@theme_button_bg, 0.8);
+ box-shadow: inset 1px 1px transparentize(black, 0.9);
+ margin: 12px 0px 12px 0px;
+}
+
+.scale.trough.vertical,
+.scale.scale-has-marks-above.scale-has-marks-below.trough.vertical {
 border-width: 1px;
+ border-style: solid;
+ border-radius: 3px;
+ border-color: @theme_border_color;
+ background-color: shade(@theme_button_bg, 0.8);
+ box-shadow: inset 1px 1px transparentize(black, 0.9);
+ margin: 0 12px 0 12px;
 }
 
-GtkScale.slider:hover {
- background-color: @theme_fg_color;
- border-color: @theme_fg_color;
+.scale.trough.highlight,
+.scale.scale-has-marks-above.scale-has-marks-below.trough.highlight,
+.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough.highlight {
+ border-color: @theme_selected_borders_color;
+ background-color: @theme_highlight_color;
 }
 
-GtkScale.slider:insensitive {
- background-color: @theme_button_insensitive_bg;
- border-color: @theme_button_insensitive_active_bg;
+.scale.trough.highlight.vertical,
+.scale.trough.vertical.highlight,
+.scale.scale-has-marks-above.scale-has-marks-below.trough.highlight.vertical,
+.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough.highlight.vertical,
+.scale.scale-has-marks-above.scale-has-marks-below.trough.vertical.highlight,
+.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough.vertical.highlight {
+ border-color: @theme_selected_borders_color;
+ background-color: @theme_highlight_color;
+}
+
+.scale.trough:insensitive,
+.scale.trough.vertical:insensitive,
+.scale.scale-has-marks-above.scale-has-marks-below.trough:insensitive,
+.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough:insensitive,
+.scale.trough .highlight:insensitive,
+.scale.trough.vertical .highlight:insensitive,
+.scale.scale-has-marks-above.scale-has-marks-below.trough .highlight:insensitive,
+.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough .highlight:insensitive {
+ border-color: @theme_insensitive_border;
+ background-color: @theme_insensitive_bg;
+ box-shadow: none;
+}
+
+.scale.trough:insensitive {
+ margin: 12px 2px 12px 2px;
+}
+
+.scale.trough.vertical:insensitive {
+ margin: 2px 12px 2px 12px ;
+}
+
+.scale.scale-has-marks-below.trough {
+ margin: 12px 1px 12px 1px;
+}
+
+.scale.slider ,
+.scale.vertical.slider,
+.scale.horizontal.slider,
+.scale.vertical.slider:insensitive,
+.scale.horizontal.slider:insensitive,
+.scale.scale-has-marks-below.slider,
+.scale.scale-has-marks-below.slider {
+ margin: 0px;
 }
 
-GtkScale.slider.fine-tune,
-GtkScale.slider.fine-tune:active,
-GtkScale.slider.fine-tune:active:hover,
-GtkScale.slider.fine-tune.horizontal:active,
-GtkScale.slider.fine-tune.horizontal:active:hover {
- background-color: transparent;
- background-image: -gtk-gradient(radial, 
- center center, 0, 
- center center, 1, 
- from(@theme_fg_color),
- color-stop(0.3, @theme_fg_color),
- color-stop(0.31, transparent),
- to(transparent));
- border-width: 0;
+.scale.fine-tune.slider ,
+.scale.fine-tune.vertical.slider,
+.scale.fine-tune.horizontal.slider {
+ margin: 4px;
 }
 
 /**********
@@ -1819,209 +1872,6 @@ GtkCheckButton.text-button, GtkRadioButton.text-button {
 outline-offset: 0;
 }
 
-/************
- * GtkScale *
- ************/
-.scale,
-.scale.scale-has-marks-above.scale-has-marks-below,
-.scale.vertical.scale-has-marks-above.scale-has-marks-below {
- -GtkScale-slider-length: 20;
- -GtkRange-slider-width: 20;
- -GtkRange-trough-border: 2;
- outline-offset: -9px;
- outline-radius: 4px;
- margin: 10px;
-}
-
-.scale.fine-tune,
-.scale.scale-has-marks-above.scale-has-marks-below.fine-tune,
-.scale.vertical.scale-has-marks-above.scale-has-marks-below.fine-tune {
- margin: 8px;
- outline-offset: -7px;
- outline-radius: 6px;
-}
-
-.scale.fine-tune.trough,
-.scale.scale-has-marks-above.scale-has-marks-below.fine-tune.trough,
-.scale.vertical.scale-has-marks-above.scale-has-marks-below.fine-tune.trough {
- border-radius: 4px;
-}
-
-.scale.slider,
-.scale.scale-has-marks-above.scale-has-marks-below.slider,
-.scale.vertical.scale-has-marks-above.scale-has-marks-below.slider {
- /* FIXME: better gradient on the slider and hover state */
- border-width: 2px;
- border-style: solid;
- background-color: @theme_button_bg;
- padding: 1px 4px;
- color: @theme_button_fg;
- border-radius: 50%;
- border-color: darker(@theme_border_color);
- box-shadow: inset 0 1px white,
- inset 0 -2px @bg_color,
- inset 0 -1px mix(@bg_color,@theme_border_color, 0.5);
-}
-
-.scale.slider:hover,
-.scale.scale-has-marks-above.scale-has-marks-below.slider:hover,
-.scale.vertical.scale-has-marks-above.scale-has-marks-below.slider:hover {
- border-width: 2px;
- border-style: solid;
- background-color: @theme_button_bg;
- padding: 1px 4px;
- color: @theme_button_fg;
- border-color: darker(@theme_border_color);
- border-radius: 50%; /* needed for double marks scales */
- box-shadow: inset 0 1px white,
- inset 0 -2px white,
- inset 0 -1px mix(@bg_color,@theme_border_color, 0.5);
-}
-
-.scale.slider:insensitive,
-.scale.scale-has-marks-above.scale-has-marks-below.slider:insensitive,
-.scale.vertical.scale-has-marks-above.scale-has-marks-below.slider:insensitive {
- border-style: solid; /* needed for double marks scales or they'll get overridden */
- border-radius: 50%;
- background-image: linear-gradient(to bottom, @theme_insensitive_bg);
- box-shadow: none;
-}
-
-.scale.slider:backdrop,
-.scale.scale-has-marks-above.scale-has-marks-below.slider:backdrop,
-.scale.vertical.scale-has-marks-above.scale-has-marks-below.slider:backdrop {
- border-style: solid; /* needed for double marks scales or they'll get overridden */
- border-radius: 50%;
- border-color: darker(@backdrop_borders_color);
- background-image: linear-gradient(to bottom, @backdrop_bg_color);
- box-shadow: none;
-}
-
-/* FIXME button backdrop-insensitive is missing
-.scale.slider:backdrop:insensitive,
-.scale.scale-has-marks-above.scale-has-marks-below.slider:backdrop:insensitive,
-.scale.vertical.scale-has-marks-above.scale-has-marks-below.slider:backdrop:insensitive {
- @include button(backdrop-insensitive);
-}
-*/
-
-.scale.slider:active,
-.scale.scale-has-marks-above.scale-has-marks-below.slider:active,
-.scale.vertical.scale-has-marks-above.scale-has-marks-below.slider:active {
- border: 1px solid darker(@selected_borders_color);
-}
-
-.scale.trough,
-.scale.scale-has-marks-above.scale-has-marks-below.trough,
-.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough {
- border-width: 1px;
- border-style: solid;
- border-radius: 3px;
- border-color: @theme_border_color;
- background-color: shade(@theme_button_bg, 0.8);
- box-shadow: inset 1px 1px transparentize(black, 0.9);
-}
-
-.scale.trough.vertical,
-.scale.scale-has-marks-above.scale-has-marks-below.trough.vertical,
-.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough.vertical {
- border-width: 1px;
- border-style: solid;
- border-radius: 3px;
- border-color: @theme_border_color;
- background-color: shade(@theme_button_bg, 0.8);
- box-shadow: inset 1px 1px transparentize(black, 0.9);
-}
-
-.scale.trough.highlight,
-.scale.scale-has-marks-above.scale-has-marks-below.trough.highlight,
-.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough.highlight {
- border-color: @selected_borders_color;
- background-color: @theme_highlight_color;
- box-shadow: none;
-}
-
-.scale.trough.highlight.vertical,
-.scale.trough.vertical.highlight,
-.scale.scale-has-marks-above.scale-has-marks-below.trough.highlight.vertical,
-.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough.highlight.vertical,
-.scale.scale-has-marks-above.scale-has-marks-below.trough.vertical.highlight,
-.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough.vertical.highlight {
- border-color: @selected_borders_color;
- background-color: @theme_highlight_color;
- box-shadow: none;
-}
-
-.scale.trough.highlight:backdrop,
-.scale.scale-has-marks-above.scale-has-marks-below.trough.highlight:backdrop,
-.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough.highlight:backdrop {
- border-color: @selected_bg_color;
- background-color: @selected_bg_color;
- box-shadow: none;
-}
-
-.scale.trough:insensitive,
-.scale.trough.vertical:insensitive,
-.scale.scale-has-marks-above.scale-has-marks-below.trough:insensitive,
-.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough:insensitive,
-.scale.trough .highlight:insensitive,
-.scale.trough.vertical .highlight:insensitive,
-.scale.scale-has-marks-above.scale-has-marks-below.trough .highlight:insensitive,
-.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough .highlight:insensitive {
- border-color: @theme_insensitive_border;
- background-color: @theme_insensitive_bg;
- box-shadow: none;
-}
-
-.scale.trough:backdrop,
-.scale.scale-has-marks-above.scale-has-marks-below.trough:backdrop,
-.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough:backdrop {
- border-color: @backdrop_borders_color;
- background-color: mix(@backdrop_bg_color,@borders_color, 1.0);
- box-shadow: none;
-}
-
-.scale.trough:backdrop:insensitive,
-.scale.trough .highlight:backdrop:insensitive,
-.scale.scale-has-marks-above.scale-has-marks-below.trough:backdrop:insensitive,
-.scale.scale-has-marks-above.scale-has-marks-below.trough .highlight:backdrop:insensitive,
-.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough:backdrop:insensitive,
-.scale.vertical.scale-has-marks-above.scale-has-marks-below.trough .highlight:backdrop:insensitive {
- border-color: @backdrop_insensitive_color;
- background-color: @backdrop_bg_color;
-}
-
-.scale.scale-has-marks-above {
- margin: 14px 10px 10px;
-}
-
-.scale.scale-has-marks-above.fine-tune {
- margin: 12px 8px 8px;
-}
-.scale.scale-has-marks-below {
- margin: 10px 10px 14px;
-}
-
-.scale.scale-has-marks-below.fine-tune {
- margin: 8px 8px 12px;
-}
-
-.scale.vertical.scale-has-marks-above {
- margin: 10px 10px 10px 14px;
-}
-
-.scale.vertical.scale-has-marks-above.fine-tune {
- margin: 8px 8px 8px 12px;
-}
-
-.scale.vertical.scale-has-marks-below {
- margin: 10px 14px 10px 10px;
-}
-
-.scale.vertical.scale-has-marks-below.fine-tune {
- margin: 8px 12px 8px 8px;
-}
-
 /*********
 * Views *
 *********/
diff --git a/desktop-themes/ContrastHigh/gtk-3.0/gtk.css b/desktop-themes/ContrastHigh/gtk-3.0/gtk.css
index 9fcdadb3..d227d1e7 100644
--- a/desktop-themes/ContrastHigh/gtk-3.0/gtk.css
+++ b/desktop-themes/ContrastHigh/gtk-3.0/gtk.css
@@ -5,6 +5,7 @@
 @define-color theme_selected_fg_color @theme_base_color;
 
 @define-color theme_border_color @theme_selected_bg_color;
+@define-color theme_selected_borders_color @theme_bg_color;
 @define-color borders_edge #fff;
 
 @define-color theme_highlight_color #3465a4;
@@ -70,10 +71,10 @@
 
 /*colors for the backdrop state, derived from the main colors. */
 @define-color backdrop_base_color @base_color;
-@define-color backdrop_bg_color @bg_color;
-@define-color backdrop_fg_color @fg_color;
+@define-color backdrop_bg_color @theme_bg_color;
+@define-color backdrop_fg_color @theme_fg_color;
 @define-color backdrop_insensitive_color @theme_insensitive_color;
-@define-color backdrop_borders_color mix(@theme_border_color, @bg_color, 0.9);
+@define-color backdrop_borders_color mix(@theme_border_color, @theme_bg_color, 0.9);
 
 /******
 * WM *
author	raveit65 <[email protected]>	2015-09-17 21:00:42 +0200
committer	raveit65 <[email protected]>	2015-09-17 21:00:42 +0200
commit	a38e8c92e18fc661478f1ae46fc782d8a34b3d25 (patch)
tree	cede630028b232d8ec2a9c6a0a6c42175c4858d7 /desktop-themes/ContrastHigh
parent	4ec7f4fbbd8d5f8ec0eb6d0456e063df2958eefe (diff)
download	mate-themes-a38e8c92e18fc661478f1ae46fc782d8a34b3d25.tar.bz2 mate-themes-a38e8c92e18fc661478f1ae46fc782d8a34b3d25.tar.xz