From fb5fe2eca48e7f37aa5951b42da48eceed3f786c Mon Sep 17 00:00:00 2001
From: Wolfgang Ulbrich <chat-to-me@raveit.de>
Date: Wed, 21 Oct 2015 23:29:53 +0200
Subject: Gtk+-3.18 submarine themes: adjust osd

---
 .../Blue-Submarine/gtk-3.0/gtk-widgets.css         | 188 +++++++++++++--------
 desktop-themes/Blue-Submarine/gtk-3.0/gtk.css      |   6 +-
 .../Green-Submarine/gtk-3.0/gtk-widgets.css        | 188 +++++++++++++--------
 desktop-themes/Green-Submarine/gtk-3.0/gtk.css     |   6 +-
 4 files changed, 242 insertions(+), 146 deletions(-)

diff --git a/desktop-themes/Blue-Submarine/gtk-3.0/gtk-widgets.css b/desktop-themes/Blue-Submarine/gtk-3.0/gtk-widgets.css
index 5ac88f74..6fa2c244 100644
--- a/desktop-themes/Blue-Submarine/gtk-3.0/gtk-widgets.css
+++ b/desktop-themes/Blue-Submarine/gtk-3.0/gtk-widgets.css
@@ -4588,8 +4588,15 @@ GtkDialog GtkScrolledWindow.frame GtkViewport .vertical GtkExpander .vertical {
 
 .background.osd {
     color: @osd_fg;
-    background-image: none;
-    background-color: @osd_bg;
+    text-shadow: 0 1px @osd_text_shadow;
+    border-style: solid;
+    border-width: 1px;
+    border-color: shade (@theme_selected_bg_color, 0.8);
+    border-radius: 0px;
+    background-image: linear-gradient(to left,
+                                      alpha(shade(@theme_selected_bg_color, 1.2), 0.7),
+                                      alpha(shade(@theme_selected_bg_color, 0.95), 0.7));
+    background-color: alpha(shade(@theme_selected_bg_color, 1.0), 0.4);
 }
 
 GtkOverlay.osd {
@@ -4601,125 +4608,163 @@ GtkOverlay.osd {
     background-origin: border-box;
 }
 
-.osd.button,
+.osd.button:focus,
 .osd.button:checked,
-.osd.button:active,
+.osd.button:hover:active,
+.osd.button:focus:hover:active,
 .osd .button,
+.osd .button:focus,
 .osd .button:checked,
-.osd .button:active {
+.osd .button:hover:active,
+.osd .button:focus:hover:active {
     border-width: 1px;
     border-style: solid;
     border-image: none;
     border-color: @osd_button_border;
     border-radius: 5px;
+    box-shadow: none;
 }
 
 .osd.button,
-.osd .button {
-    padding: 4px;
-    background-image: linear-gradient(to bottom,
-                                      @osd_button_bg_a,
-                                      @osd_button_bg_b 68%,
-                                      @osd_button_bg_c);
-    color: @osd_button_fg;
-    text-shadow: 0 -1px @osd_button_shadow;
-    icon-shadow: 0 -1px @osd_button_shadow;
-}
-
-.osd.button,
-.osd.button:prelight,
-.osd.button:active,
+.osd.button:hover,
 .osd.button:checked {
     background-color: shade(@osd_bg, 1.10);
+    border-radius: 5px;
+    border-color: @osd_button_border;
 }
 
 .osd .button,
-.osd .button:prelight,
-.osd .button:active,
+.osd .button:hover,
 .osd .button:checked {
     background-color: transparent;
+    box-shadow: none;
 }
 
 .osd.button:insensitive,
 .osd .button:insensitive {
     background-image: none;
-    background-color: @osd_button_bg_insensitive;
+    border-color: @osd_button_bg_insensitive;
+    background-color: transparent;
+    box-shadow: none;
+    color: @osd_button_fg_insensitive;
 }
 
 .osd.button:checked:insensitive,
-.osd .button:checked:insensitive,
-.osd.button:active:insensitive,
-.osd .button:active:insensitive {
+.osd .button:checked:insensitive {
     background-image: none;
     background-color: @osd_button_bg_insensitive_active;
+    color: @osd_button_fg_insensitive;
 }
 
-.osd.button:hover,
-.osd .button:hover {
-    color: @osd_button_fg_hover;
-}
-
-.osd .linked .button:hover:first-child,
-.osd .linked .button:hover:last-child,
-.osd .linked .button:hover:only-child {
-    background-image: none;
-    padding: 6px;
-}
-
-.osd.button:active,
-.osd.button:hover:active,
-.osd .button:active,
-.osd .button:hover:active,
-.osd.button:checked,
-.osd.button:hover:checked,
-.osd .button:checked,
-.osd .button:hover:checked {
-    color: @osd_button_fg_active;
-}
-
-.osd.button:insensitive,
-.osd.button:active *:insensitive,
-.osd.button:checked *:insensitive,
-.osd .button:insensitive,
-.osd .button:active *:insensitive,
-.osd .button:checked *:insensitive {
-    color: @osd_button_fg_insensitive;
+.osd.button,
+.osd.button:focus,
+.osd .button,
+.osd .button:focus {
+    padding: 4px;
+    background-image: linear-gradient(to bottom,
+                                      @osd_button_bg_a,
+                                      @osd_button_bg_b 68%,
+                                      @osd_button_bg_c);
+    color: @osd_button_fg;
+    text-shadow: 0 -1px @osd_button_shadow;
+    icon-shadow: 0 -1px @osd_button_shadow;
 }
 
 .osd.button:hover,
-.osd .button:hover {
+.osd .button:hover,
+.osd .linked .button:hover {
     background-image: linear-gradient(to bottom,
                                       @osd_button_bg_hover_a,
                                       @osd_button_bg_hover_b 68%,
                                       @osd_button_bg_hover_c);
+    color: @osd_button_fg_hover;
 }
 
 .osd.button:checked,
 .osd.button:checked:hover,
+.osd.button:checked:hover:active,
+.osd.button:hover:active,
+.osd.button:focus:hover:active,
 .osd .button:checked,
 .osd .button:checked:hover,
-.osd GtkMenuButton.button:checked,
-.osd.button:active,
-.osd.button:active:hover,
-.osd .button:active,
-.osd .button:active:hover,
-.osd GtkMenuButton.button:active {
+.osd .button:checked:hover:active,
+.osd .button:hover:active,
+.osd .button:focus:hover:active,
+.osd GtkMenuButton.button:checked {
     background-image: linear-gradient(to bottom,
                                       @osd_button_bg_active_a,
                                       @osd_button_bg_active_b 68%,
                                       @osd_button_bg_active_c);
+    color: @osd_button_fg_active;
+    text-shadow: 0 -1px @osd_button_shadow;
 }
 
-.osd GtkMenuButton.button:checked,
-.osd GtkMenuButton.button:active {
+.osd GtkMenuButton.button:checked {
     background-color: transparent;
     border-color: @osd_button_border;
 }
 
-.osd GtkMenuButton.button *:checked,
-.osd GtkMenuButton.button *:active {
-    color: @osd_button_fg_active;
-    text-shadow: 0 -1px @osd_button_shadow;
+/* gnome-weather */
+.linked.stack-switcher.osd .button {
+    background-image: linear-gradient(to bottom,
+                                      alpha(shade(@theme_selected_bg_color, 1.2), 0.1),
+                                      alpha(shade(@theme_selected_bg_color, 0.95), 0.1));
+    background-color: alpha(shade(@theme_selected_bg_color, 1.0), 0.4);
+    box-shadow: none;
+}
+
+.linked.stack-switcher.osd .button:hover {
+    background-image: linear-gradient(to bottom,
+                                      alpha(shade(@theme_selected_bg_color, 1.2), 0.4),
+                                      alpha(shade(@theme_selected_bg_color, 0.95), 0.4));
+    background-color: alpha(shade(@theme_selected_bg_color, 1.0), 0.4);
+
+}
+
+.linked.stack-switcher.osd .button {
+    border-width: 1px 0 1px 0px;
+    border-color: shade (@theme_selected_bg_color, 0.8);
+}
+
+.linked.stack-switcher.osd .button:first-child {
+    border-width: 1px 1px 1px 1px;
+}
+
+.linked.stack-switcher.osd .button:last-child {
+    border-width: 1px 1px 1px 0px;
+}
+
+.linked.stack-switcher.osd .button:only-child {
+    border-width: 1px;
+}
+
+
+/* ie. parole media-player */
+/* previous/play/next */
+.osd .horizontal .horizontal .button {
+    padding: 5px 8px;
+}
+
+.osd .horizontal .horizontal .button:insensitive {
+    border-color: @osd_button_bg_insensitive;
+}
+
+.osd .horizontal .horizontal .label {
+    padding: 5px 5px;
+    background-color: transparent;
+    background-image: linear-gradient(to bottom,
+                                      @osd_button_bg_a,
+                                      @osd_button_bg_b 68%,
+                                      @osd_button_bg_c);
+    border-color: @osd_button_bg_insensitive;
+    border-style: solid;
+    border-width: 1px;
+    border-radius: 5px;
+}
+
+/* ie. volume button */
+.osd .horizontal .button {
+    padding: 5px 8px;
 }
 
 .osd.toolbar {
@@ -4744,19 +4789,22 @@ GtkOverlay.osd {
     border-radius: 5px;
 }
 
-.osd.toolbar .button:first-child {
+.osd.toolbar .button:first-child,
+.osd.toolbar .linked .button:first-child {
     border-radius: 5px 0 0 5px;
     border-width: 1px 0 1px 1px;
     box-shadow: inset -1px 0 @osd_button_inset;
 }
 
-.osd.toolbar .button:last-child {
+.osd.toolbar .button:last-child,
+.osd.toolbar .linked .button:last-child {
     box-shadow: none;
     border-radius: 0 5px 5px 0;
     border-width: 1px 1px 1px 0;
 }
 
 .osd.toolbar .button:only-child,
+.osd.toolbar .linked .button:only-child,
 .osd.toolbar GtkToolButton .button,
 .osd.toolbar GtkToolButton:only-child .button,
 .osd.toolbar GtkToolButton:last-child .button,
diff --git a/desktop-themes/Blue-Submarine/gtk-3.0/gtk.css b/desktop-themes/Blue-Submarine/gtk-3.0/gtk.css
index 1bdc48d0..96610169 100644
--- a/desktop-themes/Blue-Submarine/gtk-3.0/gtk.css
+++ b/desktop-themes/Blue-Submarine/gtk-3.0/gtk.css
@@ -164,7 +164,7 @@
  *******/
 @define-color osd_highlight #ffffff;
 @define-color osd_lowlight #515152;
-@define-color osd_base #212526;
+@define-color osd_base @theme_selected_bg_color;
 
 @define-color osd_fg #ededed;
 @define-color osd_bg alpha(@osd_base, 0.80);
@@ -200,12 +200,12 @@
 @define-color osd_button_fg_backdrop shade(@osd_fg, 0.70);
 @define-color osd_button_fg_backdrop_active shade(@osd_fg, 0.95);
 
-@define-color osd_button_fg shade(@osd_fg, 0.80);
+@define-color osd_button_fg shade(@osd_fg, 0.85);
 @define-color osd_button_fg_hover shade(@osd_fg, 0.96);
 @define-color osd_button_fg_active shade(@osd_fg, 1.10);
 @define-color osd_button_fg_insensitive shade(@osd_fg, 0.70);
 
-@define-color osd_button_border alpha(@osd_highlight, 0.40);
+@define-color osd_button_border shade (@theme_selected_bg_color, 0.8);
 @define-color osd_button_inset shade(@osd_fg, 0.67);
 @define-color osd_button_shadow alpha(black, 0.35);
 
diff --git a/desktop-themes/Green-Submarine/gtk-3.0/gtk-widgets.css b/desktop-themes/Green-Submarine/gtk-3.0/gtk-widgets.css
index 9151162a..375b0fac 100644
--- a/desktop-themes/Green-Submarine/gtk-3.0/gtk-widgets.css
+++ b/desktop-themes/Green-Submarine/gtk-3.0/gtk-widgets.css
@@ -4592,8 +4592,15 @@ GtkDialog GtkScrolledWindow.frame GtkViewport .vertical GtkExpander .vertical {
 
 .background.osd {
     color: @osd_fg;
-    background-image: none;
-    background-color: @osd_bg;
+    text-shadow: 0 1px @osd_text_shadow;
+    border-style: solid;
+    border-width: 1px;
+    border-color: shade (@theme_selected_bg_color, 0.8);
+    border-radius: 0px;
+    background-image: linear-gradient(to left,
+                                      alpha(shade(@theme_selected_bg_color, 1.2), 0.7),
+                                      alpha(shade(@theme_selected_bg_color, 0.95), 0.7));
+    background-color: alpha(shade(@theme_selected_bg_color, 1.0), 0.4);
 }
 
 GtkOverlay.osd {
@@ -4605,125 +4612,163 @@ GtkOverlay.osd {
     background-origin: border-box;
 }
 
-.osd.button,
+.osd.button:focus,
 .osd.button:checked,
-.osd.button:active,
+.osd.button:hover:active,
+.osd.button:focus:hover:active,
 .osd .button,
+.osd .button:focus,
 .osd .button:checked,
-.osd .button:active {
+.osd .button:hover:active,
+.osd .button:focus:hover:active {
     border-width: 1px;
     border-style: solid;
     border-image: none;
     border-color: @osd_button_border;
     border-radius: 5px;
+    box-shadow: none;
 }
 
 .osd.button,
-.osd .button {
-    padding: 4px;
-    background-image: linear-gradient(to bottom,
-                                      @osd_button_bg_a,
-                                      @osd_button_bg_b 68%,
-                                      @osd_button_bg_c);
-    color: @osd_button_fg;
-    text-shadow: 0 -1px @osd_button_shadow;
-    icon-shadow: 0 -1px @osd_button_shadow;
-}
-
-.osd.button,
-.osd.button:prelight,
-.osd.button:active,
+.osd.button:hover,
 .osd.button:checked {
     background-color: shade(@osd_bg, 1.10);
+    border-radius: 5px;
+    border-color: @osd_button_border;
 }
 
 .osd .button,
-.osd .button:prelight,
-.osd .button:active,
+.osd .button:hover,
 .osd .button:checked {
     background-color: transparent;
+    box-shadow: none;
 }
 
 .osd.button:insensitive,
 .osd .button:insensitive {
     background-image: none;
-    background-color: @osd_button_bg_insensitive;
+    border-color: @osd_button_bg_insensitive;
+    background-color: transparent;
+    box-shadow: none;
+    color: @osd_button_fg_insensitive;
 }
 
 .osd.button:checked:insensitive,
-.osd .button:checked:insensitive,
-.osd.button:active:insensitive,
-.osd .button:active:insensitive {
+.osd .button:checked:insensitive {
     background-image: none;
     background-color: @osd_button_bg_insensitive_active;
+    color: @osd_button_fg_insensitive;
 }
 
-.osd.button:hover,
-.osd .button:hover {
-    color: @osd_button_fg_hover;
-}
-
-.osd .linked .button:hover:first-child,
-.osd .linked .button:hover:last-child,
-.osd .linked .button:hover:only-child {
-    background-image: none;
-    padding: 6px;
-}
-
-.osd.button:active,
-.osd.button:hover:active,
-.osd .button:active,
-.osd .button:hover:active,
-.osd.button:checked,
-.osd.button:hover:checked,
-.osd .button:checked,
-.osd .button:hover:checked {
-    color: @osd_button_fg_active;
-}
-
-.osd.button:insensitive,
-.osd.button:active *:insensitive,
-.osd.button:checked *:insensitive,
-.osd .button:insensitive,
-.osd .button:active *:insensitive,
-.osd .button:checked *:insensitive {
-    color: @osd_button_fg_insensitive;
+.osd.button,
+.osd.button:focus,
+.osd .button,
+.osd .button:focus {
+    padding: 4px;
+    background-image: linear-gradient(to bottom,
+                                      @osd_button_bg_a,
+                                      @osd_button_bg_b 68%,
+                                      @osd_button_bg_c);
+    color: @osd_button_fg;
+    text-shadow: 0 -1px @osd_button_shadow;
+    icon-shadow: 0 -1px @osd_button_shadow;
 }
 
 .osd.button:hover,
-.osd .button:hover {
+.osd .button:hover,
+.osd .linked .button:hover {
     background-image: linear-gradient(to bottom,
                                       @osd_button_bg_hover_a,
                                       @osd_button_bg_hover_b 68%,
                                       @osd_button_bg_hover_c);
+    color: @osd_button_fg_hover;
 }
 
 .osd.button:checked,
 .osd.button:checked:hover,
+.osd.button:checked:hover:active,
+.osd.button:hover:active,
+.osd.button:focus:hover:active,
 .osd .button:checked,
 .osd .button:checked:hover,
-.osd GtkMenuButton.button:checked,
-.osd.button:active,
-.osd.button:active:hover,
-.osd .button:active,
-.osd .button:active:hover,
-.osd GtkMenuButton.button:active {
+.osd .button:checked:hover:active,
+.osd .button:hover:active,
+.osd .button:focus:hover:active,
+.osd GtkMenuButton.button:checked {
     background-image: linear-gradient(to bottom,
                                       @osd_button_bg_active_a,
                                       @osd_button_bg_active_b 68%,
                                       @osd_button_bg_active_c);
+    color: @osd_button_fg_active;
+    text-shadow: 0 -1px @osd_button_shadow;
 }
 
-.osd GtkMenuButton.button:checked,
-.osd GtkMenuButton.button:active {
+.osd GtkMenuButton.button:checked {
     background-color: transparent;
     border-color: @osd_button_border;
 }
 
-.osd GtkMenuButton.button *:checked,
-.osd GtkMenuButton.button *:active {
-    color: @osd_button_fg_active;
-    text-shadow: 0 -1px @osd_button_shadow;
+/* gnome-weather */
+.linked.stack-switcher.osd .button {
+    background-image: linear-gradient(to bottom,
+                                      alpha(shade(@theme_selected_bg_color, 1.2), 0.1),
+                                      alpha(shade(@theme_selected_bg_color, 0.95), 0.1));
+    background-color: alpha(shade(@theme_selected_bg_color, 1.0), 0.4);
+    box-shadow: none;
+}
+
+.linked.stack-switcher.osd .button:hover {
+    background-image: linear-gradient(to bottom,
+                                      alpha(shade(@theme_selected_bg_color, 1.2), 0.4),
+                                      alpha(shade(@theme_selected_bg_color, 0.95), 0.4));
+    background-color: alpha(shade(@theme_selected_bg_color, 1.0), 0.4);
+
+}
+
+.linked.stack-switcher.osd .button {
+    border-width: 1px 0 1px 0px;
+    border-color: shade (@theme_selected_bg_color, 0.8);
+}
+
+.linked.stack-switcher.osd .button:first-child {
+    border-width: 1px 1px 1px 1px;
+}
+
+.linked.stack-switcher.osd .button:last-child {
+    border-width: 1px 1px 1px 0px;
+}
+
+.linked.stack-switcher.osd .button:only-child {
+    border-width: 1px;
+}
+
+
+/* ie. parole media-player */
+/* previous/play/next */
+.osd .horizontal .horizontal .button {
+    padding: 5px 8px;
+}
+
+.osd .horizontal .horizontal .button:insensitive {
+    border-color: @osd_button_bg_insensitive;
+}
+
+.osd .horizontal .horizontal .label {
+    padding: 5px 5px;
+    background-color: transparent;
+    background-image: linear-gradient(to bottom,
+                                      @osd_button_bg_a,
+                                      @osd_button_bg_b 68%,
+                                      @osd_button_bg_c);
+    border-color: @osd_button_bg_insensitive;
+    border-style: solid;
+    border-width: 1px;
+    border-radius: 5px;
+}
+
+/* ie. volume button */
+.osd .horizontal .button {
+    padding: 5px 8px;
 }
 
 .osd.toolbar {
@@ -4748,19 +4793,22 @@ GtkOverlay.osd {
     border-radius: 5px;
 }
 
-.osd.toolbar .button:first-child {
+.osd.toolbar .button:first-child,
+.osd.toolbar .linked .button:first-child {
     border-radius: 5px 0 0 5px;
     border-width: 1px 0 1px 1px;
     box-shadow: inset -1px 0 @osd_button_inset;
 }
 
-.osd.toolbar .button:last-child {
+.osd.toolbar .button:last-child,
+.osd.toolbar .linked .button:last-child {
     box-shadow: none;
     border-radius: 0 5px 5px 0;
     border-width: 1px 1px 1px 0;
 }
 
 .osd.toolbar .button:only-child,
+.osd.toolbar .linked .button:only-child,
 .osd.toolbar GtkToolButton .button,
 .osd.toolbar GtkToolButton:only-child .button,
 .osd.toolbar GtkToolButton:last-child .button,
diff --git a/desktop-themes/Green-Submarine/gtk-3.0/gtk.css b/desktop-themes/Green-Submarine/gtk-3.0/gtk.css
index 3fdc23b1..bb807913 100644
--- a/desktop-themes/Green-Submarine/gtk-3.0/gtk.css
+++ b/desktop-themes/Green-Submarine/gtk-3.0/gtk.css
@@ -164,7 +164,7 @@
  *******/
 @define-color osd_highlight #ffffff;
 @define-color osd_lowlight #515251;
-@define-color osd_base #252621;
+@define-color osd_base @theme_selected_bg_color;
 
 @define-color osd_fg #EBEDEB;
 @define-color osd_bg alpha(@osd_base, 0.80);
@@ -200,12 +200,12 @@
 @define-color osd_button_fg_backdrop shade(@osd_fg, 0.70);
 @define-color osd_button_fg_backdrop_active shade(@osd_fg, 0.95);
 
-@define-color osd_button_fg shade(@osd_fg, 0.80);
+@define-color osd_button_fg shade(@osd_fg, 0.85);
 @define-color osd_button_fg_hover shade(@osd_fg, 0.96);
 @define-color osd_button_fg_active shade(@osd_fg, 1.10);
 @define-color osd_button_fg_insensitive shade(@osd_fg, 0.70);
 
-@define-color osd_button_border alpha(@osd_highlight, 0.40);
+@define-color osd_button_border shade (@theme_selected_bg_color, 0.8);
 @define-color osd_button_inset shade(@osd_fg, 0.67);
 @define-color osd_button_shadow alpha(black, 0.35);
 
-- 
cgit v1.2.1