GTK+-3.20 Submarine themes: several adjustments

- simplify menu settings - fix firefox menus - some clean ups - increase progressbar trough height - reduce button size - remove text shadows - use cellview selector for combobox - adjust arrows - reduze height of treeview and treeview header button - adjust calendar border color - add GtkFlowbox support
author: raveit65 <[email protected]> 2016-04-25 21:49:23 +0200
committer: raveit65 <[email protected]> 2016-04-25 21:50:03 +0200
commit: 2161d20c9c8e7ace63352798c0750ffdb96088e9 (patch)
tree: b5a34127396725f33c68278db8e9d334974142ce /desktop-themes/Blue-Submarine
parent: f75d83e9616b99e6c9eda4640c7663809fe2c9ab (diff)
download: mate-themes-2161d20c9c8e7ace63352798c0750ffdb96088e9.tar.bz2
mate-themes-2161d20c9c8e7ace63352798c0750ffdb96088e9.tar.xz
3 files changed, 601 insertions, 551 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 7856ebc7..f91dff53 100644
--- a/desktop-themes/Blue-Submarine/gtk-3.0/gtk-widgets.css
+++ b/desktop-themes/Blue-Submarine/gtk-3.0/gtk-widgets.css
@@ -1,8 +1,8 @@
-/***************************************************************
- * Blue-Submarine                                              *
- * Part of https://github.com/NiceandGently/mate-themes-extras *
- * Author Wolfgang Ulbrich                                     *
- ***************************************************************/
+/*******************************************************
+ * Blue-Submarine                                      *
+ * Part of https://github.com/mate-desktop/mate-themes *
+ * Author Wolfgang Ulbrich                             *
+ *******************************************************/
  
 * {
     padding: 0;
@@ -54,7 +54,7 @@ window {
 }*/
 
 *:active {
-    background-color: alpha(shade(@theme_selected_bg_color, 1.90), 0.015);
+/*    background-color: alpha(shade(@theme_selected_bg_color, 1.90), 0.015);*/
 }
 
 *:hover:active:disabled {
@@ -64,7 +64,7 @@ window {
 }
 
 *:hover {
-     background-color: alpha(shade(@menu_bg_color, 1.05), 0.0);
+/*     background-color: alpha(shade(@menu_bg_color, 1.05), 0.0);*/
 }
 
 *:hover:disabled {
@@ -72,8 +72,8 @@ window {
 
 *:selected,
 *:selected:focus {
-    background-color: shade(@theme_selected_bg_color, 1.0);
-    color: @theme_selected_fg_color;
+/*    background-color: shade(@theme_selected_bg_color, 1.0);
+    color: @theme_selected_fg_color;*/
 }
 
 *:disabled {
@@ -341,22 +341,22 @@ progressbar {
 	font-size: smaller;
 }
 
-progressbar.horizontal {
-    min-height: 16px;
-}
-
-progressbar.vertical {
-    min-width: 16px;
+/* progress component */
+progressbar.horizontal trough {
+    min-height: 18px;
+    border-radius: 3px;
 }
 
-/* progress component */
-progressbar.horizontal trough,
 progressbar.horizontal progress {
     min-height: 16px;
     border-radius: 3px;
 }
 
-progressbar.vertical trough,
+progressbar.vertical trough {
+    min-width: 18px;
+    border-radius: 3px;
+}
+
 progressbar.vertical progress {
     min-width: 16px;
     border-radius: 3px;
@@ -825,13 +825,9 @@ scrolledwindow.frame {
  * Buttons *
  ***********/
 
-button menuitem menubar {
-    padding: 4px 8px;
-}
-
 button,
 button.raised {
-    padding: 6px;
+    padding: 5px;
     min-height: 20px;
     min-width: 20px;
 }
@@ -848,7 +844,6 @@ button label {
 
 button {
     transition: all 400ms ease-out;
-    -GtkArrow-arrow-scaling: 0.5;
     background-image: -gtk-gradient (linear,
                                      left top, left bottom,
                                      from (@button_gradient1),
@@ -870,7 +865,7 @@ button {
 /* box-shadow Syntax */
 /* box-shadow: [ inset ] horizontal_offset vertical_offset [ blur_radius ] [ spread ] color */
     color:             @theme_fg_color;
-    text-shadow: 0px 1px @theme_shadow_color;
+    text-shadow: none;
 }
 
 button.default {
@@ -894,7 +889,7 @@ button.flat {
 
 /* ie. caja location drop down button */
 button.flat.toggle {
-    padding: 6px;
+    padding: 5px;
 }
 
 /* ie. controls gnome-mplayer, virtual-manager */
@@ -902,7 +897,7 @@ button.flat.image-button,
 button.flat.image-button:focus,
 button.flat.image-button:hover,
 button.flat.scale {
-	padding: 4px;
+	padding: 5px;
 }
 
 button:hover {
@@ -949,7 +944,7 @@ button:hover:active,
 button:checked,
 button:checked:hover,
 button:checked:hover:active {
-    text-shadow: 1px 1px @theme_selected_shadow_color;
+    text-shadow: none;
 }
 
 button:disabled {
@@ -976,18 +971,15 @@ toolbar.vertical > button.image-button.flat {
 button.text-button,
 button.text-button:focus,
 button.text-button:hover,
-button.file {
-    padding: 6px;
-}
-
+button.file,
 combobox > button.combo,
 combobox > button.combo:hover {
-    padding: 4px;
+    padding: 5px;
 }
 
 button.font,
 button.color {
-    padding: 6px 4px;
+    padding: 5px 4px;
 }
 
 .path-bar > button,
@@ -997,7 +989,7 @@ button.color {
 .linked.path-bar > button:checked,
 .linked.path-bar > button:checked:hover,
 .linked.path-bar > button:checked:hover:active {
-    padding: 7px;
+    padding: 5px;
     border-color: transparent;
 }
 
@@ -1005,13 +997,13 @@ button.color {
 .linked.path-bar > button.slider-button:first-child {
     border-width: 1px 0px 1px 1px;
     border-radius: 4px 0px 0px 4px;
-    padding: 7px 1px;
+    padding: 5px 1px;
 }
 
 .linked.path-bar > button.slider-button:last-child {
     border-width: 1px 1px 1px 0px;
     border-radius: 0px 4px 4px 0px;
-    padding: 7px 1px;
+    padding: 5px 1px;
 }
 
 .titlebar .path-bar > button.slider-button:disabled {
@@ -1995,10 +1987,10 @@ combobox {
     padding: 0px;
 }
 
-combobox .cell {
+combobox cellview {
     /* color combobox read-only */
     color: @theme_fg_color;
-    text-shadow: 0 1px @theme_shadow_color;
+    text-shadow: none;
 }
 
 combobox separator {
@@ -2047,18 +2039,23 @@ combobox button.combo:hover {
     color: @theme_text_color;
 }
 
-toolbar combobox .cell {
+toolbar combobox cellview {
     /* color combobox read-only */
     color: shade(@toolbar_fg_color, 0.94);
-    text-shadow: 0 1px @toolbar_shadow_color;
+    text-shadow: none;
 }
 
-toolbar.primary-toolbar combobox .cell {
+toolbar.primary-toolbar combobox cellview {
     /* color combobox read-only */
     color: shade(@theme_fg_dark_color, 0.94);
-    text-shadow: 0 1px @theme_shadow_dark_color;
+    text-shadow: none;
+}
+
+toolbar.primary-toolbar combobox cellview:hover {
+    color: shade (@theme_selected_bg_color, 1.6);
 }
 
+
 toolbar combobox entry.combo,
 toolbar combobox entry.combo:focus {
     border-width: 1px 0px 1px 1px; /* remove rightr */
@@ -2373,12 +2370,16 @@ combobox button.combo:hover {
 
 toolbar combobox button.combo:checked,
 toolbar combobox button.combo:hover,
-toolbar.primary-toolbar combobox button.combo *:checked,
-toolbar.primary-toolbar combobox button.combo *:hover {
-    color: @theme_text_dark_color;
+toolbar.primary-toolbar combobox button.combo:checked,
+toolbar.primary-toolbar combobox button.combo:hover {
+    color: shade (@theme_selected_bg_color, 1.6);
+   -gtk-icon-shadow:  0px  1px shade (@menu_fg_dark_color, 1.0),
+                      1px  0px shade (@menu_fg_dark_color, 1.0),
+                     -1px  0px shade (@menu_fg_dark_color, 1.0),
+                      0px -1px shade (@menu_fg_dark_color, 1.0);
 }
 
-combobox arrow {
+combobox button.combo arrow {
     -gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
     color: @theme_fg_color;
     min-height: 16px;
@@ -2386,6 +2387,14 @@ combobox arrow {
     padding: 0px 2px;
 }
 
+toolbar combobox button.combo arrow {
+    color: @menu_fg_dark_color;
+}
+
+toolbar combobox button.combo:hover arrow {
+    color: shade (@theme_selected_bg_color, 1.6);
+}
+
 /************
  * Toolbars *
  ************/
@@ -2511,34 +2520,25 @@ toolbar.primary-toolbar button:focus {
 
 toolbar button {
     color: shade(@toolbar_fg_color, 1.00);
-    text-shadow: 0px 1px @toolbar_shadow_color;
+    text-shadow: none;
 }
 
-toolbar combobox button.combo {
-    /* color combobox read-only */
-    color: shade(@toolbar_fg_color, 1.00);
-    text-shadow: 0px 1px @toolbar_shadow_color;
-    background-image: -gtk-gradient (linear,
-                                     left top, left bottom,
-                                     from (alpha(#fff, 0.04)),
-                                     to   (alpha(#000, 0.06)));
-    border-top-color:    alpha (#000, 0.15);
-    border-left-color:   alpha (#000, 0.20);
-    border-right-color:  alpha (#000, 0.20);
-    border-bottom-color: alpha (#000, 0.25);
-    box-shadow: inset  0px  1px alpha(shade(@button_border, 1.00), 0.70),
-                inset  1px  0px alpha(shade(@button_border, 0.94), 0.80),
-                inset -1px  0px alpha(shade(@button_border, 0.94), 0.80),
-                inset  0px -1px alpha(shade(@button_border, 0.88), 0.90);
+toolbar.primary-toolbar > button.toggle #gtk-toolbar-arrow:disabled,
+toolbar.primary-toolbar > toolbutton button.toggle.popup > image:disabled {
+    color: mix (@menu_fg_dark_color, @menu_bg_dark_color, 0.4);
 }
 
-toolbar combobox button.combo:hover {
-    border-radius: 5px
+toolbar.primary-toolbar > button.toggle:hover #gtk-toolbar-arrow,
+toolbar.primary-toolbar > toolbutton  button.toggle.popup:hover > image {
+   -gtk-icon-shadow:  0px  1px shade (@menu_fg_dark_color, 1.0),
+                      1px  0px shade (@menu_fg_dark_color, 1.0),
+                     -1px  0px shade (@menu_fg_dark_color, 1.0),
+                      0px -1px shade (@menu_fg_dark_color, 1.0);
 }
 
 toolbar.primary-toolbar button {
     color: @theme_fg_dark_color;
-    text-shadow: 0px 1px @theme_shadow_dark_color;
+    text-shadow: none;
 }
 
 toolbar.primary-toolbar .linked button:focus {
@@ -2606,7 +2606,7 @@ toolbar button:checked,
 toolbar button:hover label,
 toolbar button:checked label {
     color: shade (@theme_selected_bg_color, 1.6);
-    text-shadow: 0px 1px @toolbar_shadow_color;
+    text-shadow: none;
     transition: all 400ms ease-out;
 }
 
@@ -2616,7 +2616,7 @@ toolbar.primary-toolbar button:hover:active,
 toolbar.primary-toolbar button:checked,
 toolbar.primary-toolbar button:checked:hover {
     color: shade (@theme_selected_bg_color, 1.6);
-    text-shadow: 0px 1px @theme_shadow_dark_color;
+    text-shadow: none;
 }
 
 toolbar button:checked:disabled,
@@ -2630,14 +2630,14 @@ toolbar.primary-toolbar button:checked:disabled {
 
 toolbar label {
     color: shade(@theme_fg_color, 1.10);
-    text-shadow: 0px 1px @theme_shadow_color;
+    text-shadow: none;
 }
 
 toolbar toolitem label,
 toolbar menubar label,
 toolbar.primary-toolbar label {
     color: @theme_fg_dark_color;
-    text-shadow: 0px 1px @theme_shadow_dark_color;
+    text-shadow: none;
 }
 
 toolbar toolitem separator,
@@ -2752,7 +2752,7 @@ toolbar button.raised:checked {
 toolbar .raised button label,
 toolbar button.raised label {
     color: @theme_fg_dark_color;
-    text-shadow: 0px 1px @theme_shadow_dark_color;
+    text-shadow: none;
 }
 
 toolbar .raised button,
@@ -2771,7 +2771,7 @@ toolbar button.raised:checked,
 toolbar .raised button:checked:hover,
 toolbar button.raised:checked:hover {
     color: @theme_text_dark_color;
-    text-shadow: 0px 1px @theme_shadow_dark_color;
+    text-shadow: none;
 }
 
 toolbar menubar button:disabled,
@@ -2913,7 +2913,7 @@ toolbar.inline-toolbar button {
     border-style: none;
     box-shadow:  none;
     color:       @theme_fg_color;
-    text-shadow: 0 1px @theme_shadow_color;
+    text-shadow: none;
     -gtk-icon-shadow: 1px 1px @theme_shadow_color;
 }
 
@@ -2960,13 +2960,13 @@ toolbar.inline-toolbar button:disabled {
 
 toolbar.inline-toolbar button:hover {
     color: @theme_text_color;
-    text-shadow: 0 1px @theme_shadow_color;
+    text-shadow: none;
     -gtk-icon-shadow: 1px 1px @theme_shadow_color;
 }
 
 toolbar.inline-toolbar button:checked {
     color: @theme_selected_fg_color;
-    text-shadow: 0 1px @theme_selected_shadow_color;
+    text-shadow: none;
     -gtk-icon-shadow: 1px 1px @theme_selected_shadow_color;
 }
 
@@ -3045,7 +3045,7 @@ actionbar revealer .horizontal.linked.stack-switcher button.image-button.radio:l
 }
 
 actionbar revealer .horizontal button.image-button.popup.toggle {
-    padding: 8px;
+    padding: 6px;
 }
 
 /*****************
@@ -3510,8 +3510,8 @@ notebook tab.reorderable-page:checked {
 
 /* close button styling */
 
-notebook button.flat,
-notebook button.flat.small-button {
+notebook > header button.flat,
+notebook > header button.flat.small-button {
     border-image: none;
     background-image: none;
     background-color: transparent;
@@ -3520,6 +3520,12 @@ notebook button.flat.small-button {
     border-color: transparent;
     border-width: 1px;
     -gtk-icon-shadow: none;
+    box-shadow: none;
+}
+
+notebook > header button.flat:hover,
+notebook > header button.flat.small-button:hover {
+    -gtk-icon-effect: highlight;
 }
 
 notebook tab.prelight-page button.flat.small-button,
@@ -3869,7 +3875,7 @@ switch:backdrop {
                 inset  1px  0px alpha(shade(@button_border, 0.94), 0.80),
                 inset -1px  0px alpha(shade(@button_border, 0.94), 0.80),
                 inset  0px -1px alpha(shade(@button_border, 0.88), 0.90);
-    text-shadow: 0 1px rgba(0, 0, 0, 0.1);
+    text-shadow: none;
 }
 
 switch:checked,
@@ -4032,8 +4038,7 @@ iconview.view.cell:selected:focus {
                 inset  1px  0px alpha(#fff, 0.07),
                 inset -1px  0px alpha(#fff, 0.07),
                 inset  0px -1px alpha(#fff, 0.06);
-/*    -GtkWidget-focus-line-width: 0; */
-    text-shadow: 0px 1px @theme_selected_shadow_color;
+    text-shadow: none;
 }
 
 iconview.view.cell:hover,
@@ -4051,7 +4056,7 @@ iconview text,
 textview text {
     background-color: @theme_base_color;
     color: @theme_fg_color;
-    text-shadow: 0px 1px @theme_shadow_color;
+    text-shadow: none;
 }
 
 view,
@@ -4069,7 +4074,6 @@ view text selection:focus,
                                      from (shade(@theme_selected_bg_color, 1.0)),
                                      to (shade(@theme_selected_bg_color, 1.1))); 
     color: @theme_selected_fg_color;
-    text-shadow: 0px 1px @theme_selected_shadow_color;
     text-shadow: none;
 }
 
@@ -4080,7 +4084,7 @@ view text selection:focus,
 
 .view text selection:focus,
 .view:selected:focus {
-    text-shadow: 0px 1px @theme_selected_shadow_color;
+    text-shadow: none;
 }
 
 /* for firefox and probably other apps */
@@ -4109,7 +4113,7 @@ label selection:backdrop:disabled {
 
 treeview,
 treeview.view {
-    padding: 4px
+    padding: 1px 4px;
 }
 
 treeview.dnd {
@@ -4119,11 +4123,8 @@ treeview.dnd {
     border-style: solid;
 }
 
-treeview:selected:hover,
-/*does not work in recent GTK versions
-treeview row:nth-child(odd):selected:hover,
-treeview row:nth-child(even):selected:hover,*/
-notebook container treeview:selected {
+treeview.view:selected:hover,
+notebook container treeview.view:selected {
     background-image: -gtk-gradient (linear,
                                      left top,
                                      left bottom,
@@ -4139,12 +4140,8 @@ treeview.view:focus {
     border-style: none;
 }
 
-.view row:hover,
-/*does not work in recent GTK versions
-treeview row:nth-child(odd):hover,
-treeview row:nth-child(even):hover,*/
-treeview:hover,
-notebook container treeview:hover {
+treeview.view:hover,
+notebook container treeview.view:hover {
     background-image: -gtk-gradient (linear,
                                      left top,
                                      left bottom,
@@ -4156,18 +4153,17 @@ notebook container treeview:hover {
 }
 
 /*Keep treeviews from jumping, separators drawn at 0 by default until hovered*/
-treeview.view.separator {
-    min-height: 2px; 
-}
-
-treeview header {
-    padding: 0px 2px;
+treeview.view.separator,
+treeview.view.separator:hover {
+    min-height: 2px;
+    color: shade(@theme_bg_color, 0.87);
+    background-color: shade(@theme_bg_color, 0.87);
 }
 
-treeview header button,
-treeview header button:focus {
-    padding: 0px 4px 1px;
-/*    -GtkWidget-focus-line-width: 0; */ 
+treeview.view > header > button,
+treeview.view > header > button:focus {
+    min-height: 18px;
+    padding: 0px 4px;
     background-image: -gtk-gradient (linear,
                                      left top, left bottom,
                                      from (shade(@button_base, 1.00)),
@@ -4188,7 +4184,7 @@ treeview header button:focus {
                 inset  0px -1px alpha(#fff, 0.05);
 }
 
-treeview header button:hover {
+treeview.view > header > button:hover {
     background-image: -gtk-gradient (linear,
                                      left top, left bottom,
                                      from (shade(@button_gradient1, 1.03)),
@@ -4208,7 +4204,7 @@ treeview header button:hover {
                 inset  0px -1px shade (@theme_selected_bg_color, 1.3);
 }
 
-treeview header button:focus:hover:active {
+treeview.view > header > button:focus:hover:active {
     background-image: -gtk-gradient (linear,
                                      left top, left bottom,
                                      from (shade (@theme_bg_color, 1.20)),
@@ -4219,7 +4215,7 @@ treeview header button:focus:hover:active {
     box-shadow: none;
 }
 
-treeview header button:disabled {
+treeview.view > header > button:disabled {
     background-image: none;
     background-color: @insensitive_bg_color;
     border-color: @insensitive_border_color;
@@ -4227,35 +4223,18 @@ treeview header button:disabled {
     box-shadow: none;
 }
 
-treeview header button arrow {
-    color: @internal_element_color;
-}
-
-treeview header:nth-child(last) button {
-    border-width: 0px 0px 1px 0px;
-}
-
-row {
-    min-height: 22px;
-}
-
-row:disabled {
-    border-width: 0px;
+treeview.view > header > button label,
+treeview.view > header > button label:focus,
+treeview.view > header > button label:backdrop {
+    padding: 0px;
 }
 
-row:selected,
-row:selected:focus {
-    border-width: 1px 0 1px 0;
-    border-style: solid;
-    box-shadow: none;
+treeview.view > header > button arrow {
+    color: @internal_element_color;
 }
 
-row:selected:backdrop,
-row:selected:focus:backdrop {
-    border-width: 1px 0 1px 0;
-    border-style: solid;
-    text-shadow: none;
-    box-shadow: none;
+treeview.view > header > button:nth-child(last) {
+    border-width: 0px 0px 1px 0px;
 }
 
 .cell {
@@ -4270,128 +4249,6 @@ row:selected:focus:backdrop {
     background-color: alpha(@theme_base_color, 0.0);
 }
 
-/*********************
- * App Notifications *
- *********************/
-
-.app-notification,
-.app-notification.frame {
-    color: @theme_dark_fg_color;
-    padding: 10px;
-    border: none;
-    border-radius: 0 0 4px 4px;
-    background-color: rgba(0, 0, 0, 0.7);
-    background-image: linear-gradient(to bottom,
-                                      rgba(0, 0, 0, 0.2),
-                                      transparent 2px);
-    background-clip: padding-box;
-}
-
-.app-notification:backdrop,
-.app-notification.frame:backdrop {
-    background-image: none;
-}
-
-.app-notification button,
-.app-notification headerbar button.titlebutton,
-headerbar .app-notification button.titlebutton,
-.app-notification .titlebar button.titlebutton,
-.titlebar .app-notification button.titlebutton,
-.app-notification calendar.header button.titlebutton,
-calendar.header .app-notification button.titlebutton,
-.app-notification.frame button {
-    color: @theme_dark_fg_color;
-    border-color: rgba(37, 88, 128, 0.7);
-    background-image: linear-gradient(to bottom,
-                                      rgba(0, 0, 0, 0.7));
-    background-clip: padding-box;
-    box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
-    text-shadow: none;
-    -gtk-icon-shadow: 0 1px black;
-    outline-color: rgba(238, 238, 236, 0.3);
-    border-radius: 3px;
-    padding: 0 0px 2px 0px;
-}
-
-.app-notification button.flat,
-.app-notification headerbar button.titlebutton,
-headerbar .app-notification button.titlebutton,
-.app-notification .titlebar button.titlebutton,
-.titlebar .app-notification button.titlebutton,
-.app-notification calendar.header button.titlebutton,
-calendar.header .app-notification button.titlebutton,
-.app-notification.frame button.flat,
-.app-notification.frame headerbar button.titlebutton,
-headerbar .app-notification.frame button.titlebutton,
-.app-notification.frame .titlebar button.titlebutton,
-.titlebar .app-notification.frame button.titlebutton,
-.app-notification.frame calendar.header button.titlebutton,
-calendar.header .app-notification.frame button.titlebutton {
-    -gtk-icon-shadow: 0 1px black;
-    text-shadow: 0 1px black;
-}
-
-.app-notification button:hover,
-.app-notification.frame button:hover {
-    color: black;
-    border-color: rgba(0, 0, 0, 0.7);
-    background-image: linear-gradient(to bottom,
-                                      rgba(203, 213, 217, 0.7));
-    background-clip: padding-box;
-    box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
-    text-shadow: none;
-    -gtk-icon-shadow: 0 1px black;
-    outline-color: rgba(238, 238, 236, 0.3);
-    border-radius: 3px;
-    padding: 0 0px 2px 0px;
-}
-
-.app-notification button:checked,
-.app-notification button:backdrop:checked,
-.app-notification.frame button:checked,
-.app-notification.frame button:backdrop:active {
-    color: white;
-    border-color: rgba(0, 0, 0, 0.7);
-    background-image: linear-gradient(to bottom,
-                                      rgba(37, 88, 128, 0.7));
-    background-clip: padding-box;
-    box-shadow: none;
-    text-shadow: none;
-    -gtk-icon-shadow: none;
-    outline-color: rgba(238, 238, 236, 0.3);
-    border-radius: 3px;
-}
-
-.app-notification button:disabled,
-.app-notification button:backdrop:disabled,
-.app-notification.frame button:disabled,
-.app-notification.frame button:backdrop:disabled {
-    color: #878989;
-    border-color: rgba(0, 0, 0, 0.7);
-    background-image: linear-gradient(to bottom,
-                                      rgba(52, 57, 57, 0.5));
-    background-clip: padding-box;
-    box-shadow: none;
-    text-shadow: none;
-    -gtk-icon-shadow: none;
-    border-radius: 3px;
-    padding: 0px;
-}
-
-.app-notification button:backdrop,
-.app-notification.frame button:backdrop {
-    color: #eeeeec;
-    border-color: rgba(0, 0, 0, 0.7);
-    background-image: linear-gradient(to bottom,
-                                      rgba(172, 205, 138, 0.7));
-    background-clip: padding-box;
-    box-shadow: none;
-    text-shadow: none;
-    -gtk-icon-shadow: none;
-    border-radius: 3px;
-    padding: 0px;
-}
-
 /*************
  * Expanders *
  *************/
@@ -4488,6 +4345,29 @@ list .separator.horizontal {
     border-width: 0px;
 }
 
+row {
+    min-height: 22px;
+}
+
+row:disabled {
+    border-width: 0px;
+}
+
+row:selected,
+row:selected:focus {
+    border-width: 1px 0 1px 0;
+    border-style: solid;
+    box-shadow: none;
+}
+
+row:selected:backdrop,
+row:selected:focus:backdrop {
+    border-width: 1px 0 1px 0;
+    border-style: solid;
+    text-shadow: none;
+    box-shadow: none;
+}
+
 list row,
 list row.activatable {
     padding: 2px;
@@ -4548,13 +4428,135 @@ list row.activatable:selected:backdrop:hover {
     box-shadow: none;
 }
 
+/*********************
+ * App Notifications *
+ *********************/
+
+.app-notification,
+.app-notification.frame {
+    color: @theme_dark_fg_color;
+    padding: 10px;
+    border: none;
+    border-radius: 0 0 4px 4px;
+    background-color: rgba(0, 0, 0, 0.7);
+    background-image: linear-gradient(to bottom,
+                                      rgba(0, 0, 0, 0.2),
+                                      transparent 2px);
+    background-clip: padding-box;
+}
+
+.app-notification:backdrop,
+.app-notification.frame:backdrop {
+    background-image: none;
+}
+
+.app-notification button,
+.app-notification headerbar button.titlebutton,
+headerbar .app-notification button.titlebutton,
+.app-notification .titlebar button.titlebutton,
+.titlebar .app-notification button.titlebutton,
+.app-notification calendar.header button.titlebutton,
+calendar.header .app-notification button.titlebutton,
+.app-notification.frame button {
+    color: @theme_dark_fg_color;
+    border-color: rgba(37, 88, 128, 0.7);
+    background-image: linear-gradient(to bottom,
+                                      rgba(0, 0, 0, 0.7));
+    background-clip: padding-box;
+    box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
+    text-shadow: none;
+    -gtk-icon-shadow: 0 1px black;
+    outline-color: rgba(238, 238, 236, 0.3);
+    border-radius: 3px;
+    padding: 0 0px 2px 0px;
+}
+
+.app-notification button.flat,
+.app-notification headerbar button.titlebutton,
+headerbar .app-notification button.titlebutton,
+.app-notification .titlebar button.titlebutton,
+.titlebar .app-notification button.titlebutton,
+.app-notification calendar.header button.titlebutton,
+calendar.header .app-notification button.titlebutton,
+.app-notification.frame button.flat,
+.app-notification.frame headerbar button.titlebutton,
+headerbar .app-notification.frame button.titlebutton,
+.app-notification.frame .titlebar button.titlebutton,
+.titlebar .app-notification.frame button.titlebutton,
+.app-notification.frame calendar.header button.titlebutton,
+calendar.header .app-notification.frame button.titlebutton {
+    -gtk-icon-shadow: 0 1px black;
+    text-shadow: none;
+}
+
+.app-notification button:hover,
+.app-notification.frame button:hover {
+    color: black;
+    border-color: rgba(0, 0, 0, 0.7);
+    background-image: linear-gradient(to bottom,
+                                      rgba(203, 213, 217, 0.7));
+    background-clip: padding-box;
+    box-shadow: inset 0 1px rgba(255, 255, 255, 0.1);
+    text-shadow: none;
+    -gtk-icon-shadow: 0 1px black;
+    outline-color: rgba(238, 238, 236, 0.3);
+    border-radius: 3px;
+    padding: 0 0px 2px 0px;
+}
+
+.app-notification button:checked,
+.app-notification button:backdrop:checked,
+.app-notification.frame button:checked,
+.app-notification.frame button:backdrop:active {
+    color: white;
+    border-color: rgba(0, 0, 0, 0.7);
+    background-image: linear-gradient(to bottom,
+                                      rgba(37, 88, 128, 0.7));
+    background-clip: padding-box;
+    box-shadow: none;
+    text-shadow: none;
+    -gtk-icon-shadow: none;
+    outline-color: rgba(238, 238, 236, 0.3);
+    border-radius: 3px;
+}
+
+.app-notification button:disabled,
+.app-notification button:backdrop:disabled,
+.app-notification.frame button:disabled,
+.app-notification.frame button:backdrop:disabled {
+    color: #878989;
+    border-color: rgba(0, 0, 0, 0.7);
+    background-image: linear-gradient(to bottom,
+                                      rgba(52, 57, 57, 0.5));
+    background-clip: padding-box;
+    box-shadow: none;
+    text-shadow: none;
+    -gtk-icon-shadow: none;
+    border-radius: 3px;
+    padding: 0px;
+}
+
+.app-notification button:backdrop,
+.app-notification.frame button:backdrop {
+    color: #eeeeec;
+    border-color: rgba(0, 0, 0, 0.7);
+    background-image: linear-gradient(to bottom,
+                                      rgba(172, 205, 138, 0.7));
+    background-clip: padding-box;
+    box-shadow: none;
+    text-shadow: none;
+    -gtk-icon-shadow: none;
+    border-radius: 3px;
+    padding: 0px;
+}
+
 /**************
  * Calendar   *
  **************/
 
 calendar {
     border-radius: 3px;
-    border-color: shade (@theme_fg_color, 0.8);
+    border-color: @notebook_border;
     padding: 1px 1px 3px 1px;
 }
 
@@ -4776,7 +4778,7 @@ dialog scrolledwindow.frame viewport .vertical expander .vertical {
 .dialog-action-area.linked > button.text-button:disabled {
     border-width: 1px 1px 1px 0px;
     border-radius: 0;
-    padding:  8px 6px;
+    padding:  6px 6px;
     margin: 0px 0px 0px -2px;
     min-height: 16px;
     min-width: 16px;
@@ -4909,7 +4911,7 @@ dialog scrolledwindow.frame viewport .vertical expander .vertical {
 
 .background.osd {
     color: @osd_fg;
-    text-shadow: 0 1px @osd_text_shadow;
+    text-shadow: none;
     border-style: solid;
     border-width: 1px;
     border-color: shade (@theme_selected_bg_color, 0.8);
@@ -4992,7 +4994,7 @@ button.osd:focus {
                                       @osd_button_bg_b 68%,
                                       @osd_button_bg_c);
     color: @osd_button_fg;
-    text-shadow: 0 -1px @osd_button_shadow;
+    text-shadow: none;
     -gtk-icon-shadow: 0 -1px @osd_button_shadow;
 }
 
@@ -5023,7 +5025,7 @@ button.osd.menu-button:checked {
                                       @osd_button_bg_active_b 68%,
                                       @osd_button_bg_active_c);
     color: @osd_button_fg_active;
-    text-shadow: 0 -1px @osd_button_shadow;
+    text-shadow: none;
 }
 
 .osd button.menu-button:checked {
@@ -5079,7 +5081,7 @@ button.osd.menu-button:checked {
 
 toolbar.osd {
     color: @osd_fg;
-    text-shadow: 0 1px @osd_text_shadow;
+    text-shadow: none;
     padding: 10px;
     border-style: solid;
     border-width: 1px;
@@ -5363,7 +5365,7 @@ popover.osd toolbar {
 }
 
 popover.osd button {
-    text-shadow: 0 -1px @osd_text_shadow;
+    text-shadow: none;
     -gtk-icon-shadow: 0 -1px @osd_text_shadow;
 }
 
@@ -5460,7 +5462,8 @@ popover button.image-button:disabled {
 
 modelbutton.flat,
 .linked button.image-button.model {
-  min-height: 24px;
+    min-height: 24px;
+    padding: 4px;
 }
 
 modelbutton.flat arrow.left {
@@ -6601,7 +6604,7 @@ colorchooser box.horizontal box.horizontal grid.horizontal{
     background-color: @theme_bg_color;
     border-color: shade(@theme_bg_color, 0.85);
     color: @theme_text_color;
-    text-shadow: 0 1px @theme_shadow_color;
+    text-shadow: none;
     border-radius: 3px;
     border-width: 1px;
     border-style: solid;
@@ -6641,3 +6644,39 @@ colorchooser box.horizontal box.horizontal grid.horizontal{
     box-shadow: inset -1px 1px alpha(#fff, 0.07);
 }
 
+/***********
+ * FlowBox *
+ ***********/
+
+flowbox {
+    background-color: shade (@theme_bg_color, 1.1);
+    -gtk-icon-style: regular;
+    border-style: solid;
+    border-color: alpha(@frame_color, 0.6);
+    border-width: 1px 1px 1px 1px;
+    border-radius: 3px;
+    padding: 8px;
+}
+
+flowbox > flowboxchild,
+flowbox > flowboxchild:focus,
+flowbox > flowboxchild:backdrop {
+    border-style: solid;
+    border-width: 2px;
+    border-radius: 3px;
+    border-color: transparent;
+    color: @theme_text_color;
+
+}
+
+flowbox > flowboxchild:selected,
+flowbox > flowboxchild:selected:focus,
+flowbox > flowboxchild:selected:hover,
+flowbox > flowboxchild:selected:focus:hover {
+    border-style: solid;
+    border-width: 2px;
+    border-radius: 3px;
+    border-color: alpha(@theme_selected_bg_color, 0.75);
+    color: @theme_text_color;
+}
+
diff --git a/desktop-themes/Blue-Submarine/gtk-3.0/mate-applications.css b/desktop-themes/Blue-Submarine/gtk-3.0/mate-applications.css
index a4d64c7c..83d2066b 100644
--- a/desktop-themes/Blue-Submarine/gtk-3.0/mate-applications.css
+++ b/desktop-themes/Blue-Submarine/gtk-3.0/mate-applications.css
@@ -292,10 +292,6 @@ paned.horizontal > box.vertical.caja-side-pane > notebook scrolledwindow.frame {
                                      to   (shade(@menu_bg_dark_color, 1.17)));
 }
 
-.caja-navigation-window toolbar.primary-toolbar combobox > .linked > button.combo arrow {
-    color: @theme_selected_fg_color
-}
-
 /* navigation buttons */
 .caja-navigation-window toolbar.primary-toolbar #Back button.image-button,
 .caja-navigation-window toolbar.primary-toolbar #Forward button.image-button {
@@ -432,11 +428,11 @@ PanelToplevel > widget > button:hover:active {
 
 PanelSeparator {
     border-width: 0;
-    background-image: -gtk-gradient (linear, left top, left bottom,
-                                     from (shade (@theme_bg_dark_color, 1.03)),
-                                     to (shade (@theme_bg_dark_color, 0.95)));
-    color: shade (@theme_fg_dark_color, 0.45);
-    text-shadow: none;
+    color: transparent;
+    background-image: -gtk-scaled(url("assets/panel-grid.svg"));
+    background-color: transparent;
+    background-repeat: no-repeat;
+    background-position: center;
 }
 
 /* the grid left from wnckpager and wncktasklist */
@@ -512,8 +508,9 @@ MatePanelAppletFrameDBus {
     padding: 4px 2px;
 }
 
+.mate-panel-menu-bar menu > menuitem,
 .mate-panel-menu-bar menubar > menuitem {
-    padding: 5px 5px;
+    padding: 5px;
 }
 
 #clock-applet-button.flat.toggle > box.horizontal > label {
@@ -568,6 +565,11 @@ na-tray-applet {
     -NaTrayApplet-icon-size: 16;
 }
 
+/* control icon size as previous setting don't work */
+na-tray-applet > widget > box {
+    margin: 4px -16px 4px 0px;
+}
+
 /* system-monitor-applet */
 #PanelApplet > box.horizontal > box.vertical > frame {
     box-shadow: inset  0px  1px shade (@menu_bg_dark_color, 1.5),
diff --git a/desktop-themes/Blue-Submarine/gtk-3.0/menu.css b/desktop-themes/Blue-Submarine/gtk-3.0/menu.css
index b1c31965..b0ac4c6e 100644
--- a/desktop-themes/Blue-Submarine/gtk-3.0/menu.css
+++ b/desktop-themes/Blue-Submarine/gtk-3.0/menu.css
@@ -1,11 +1,14 @@
-/*************************
- * menu  
- *
- *************************/
-
-toolbar .raised  menu,
-menu {
-    /* menu contextual */
+/*********
+ * Menus *
+ *********/
+
+.context-menu {
+	font: initial;
+	text-shadow: none;
+}
+
+menu,
+.menu {
     background-color: @menu_bg_dark_color;
     background-image: -gtk-gradient (linear,
                                      left top, left bottom,
@@ -18,25 +21,19 @@ menu {
     border-image:     none;
 }
 
-menu:selected {
-    background-color: @theme_selected_bg_color;
-}
-
-menuitem,
-menuitem:disabled {
-    background-color: @menu_bg_dark_color;
+menu button,
+.menu button {
+    padding: 0px;
+    background-image: none;
+    background-color: shade (@menu_bg_dark_color, 0.95);
+    color: mix (@menu_fg_dark_color, @menu_bg_dark_color, 0.3);
+    box-shadow: none;
+    border-image: none;
+    border-style: none;
 }
 
-menubar menu button:hover,
-menubar menu button:active,
-menubar menu button:active:disabled,
-menubar menu button:disabled,
-menubar menu button,
-toolbar.primary-toolbar menu button:hover,
-toolbar.primary-toolbar menu button:active,
-toolbar.primary-toolbar menu button:active:disabled,
-toolbar.primary-toolbar menu button:disabled,
-toolbar.primary-toolbar menu button {
+menu button:hover,
+.menu button:hover {
     background-color: shade (@menu_bg_dark_color, 1.07);
     background-image: -gtk-gradient (linear,
                                      left top, left bottom,
@@ -48,25 +45,18 @@ toolbar.primary-toolbar menu button {
     border-image: none;
 }
 
-menu button {
-    padding: 0px;
-    background-image: none;
-    background-color: shade (@menu_bg_dark_color, 0.95);
-    color: mix (@menu_fg_dark_color, @menu_bg_dark_color, 0.3);
-    box-shadow: none;
-    border-image: none;
-    border-style: none;
-}
-
-menu button arrow {
-    color: @menu_fg_dark_color;
+menu button:disabled,
+.menu button:disabled {
+	background-color: transparent;
+    color: mix (@menu_fg_dark_color, @menu_bg_dark_color, 0.6);
+	border-image: none;
+	border-style: none;
+	text-shadow: none;
 }
 
-
-/***********
- * menubar *
- ***********/
-menubar {
+/* this controls the general appearance of the menubar */
+menubar,
+.menubar {
     -GtkWidget-window-dragging: true;
     /* line 3D  (dark) */
     box-shadow: inset  0px -1px @menu_line_dark_color;
@@ -78,25 +68,24 @@ menubar {
     border-bottom-color:  shade(@theme_bg_dark_color, 1.60);
     background-color: shade (@theme_bg_dark_color, 1.00);
     color: @menu_fg_dark_color;
-    min-height: 20px;
+    min-height: 18px;
 }
 
-/***************
- * menubaritem *
- ***************/
-menubar > menuitem  {
+menubar > menuitem,
+.menubar > menuitem {
     padding: 5px 5px;
     transition: all 300ms ease-out;
     border-radius: 0px;
     border-width: 0px;
-    min-height: 16px;
+    min-height: 18px;
 }
 
-menubar > menuitem:hover {
+menubar > menuitem:hover,
+.menubar > menuitem:hover {
     background-color: shade (@theme_bg_dark_color, 1.2);
     border-radius: 6px;
     color: shade (@theme_selected_bg_color, 1.6);
-    text-shadow: 0px 1px @theme_selected_shadow_color;
+    text-shadow: none;
     background-image: -gtk-gradient (linear,
                                      left top, left bottom,
                                      from (shade(@menu_bg_dark_color, 2.03)),
@@ -107,105 +96,42 @@ menubar > menuitem:hover {
                 inset  0px -1px shade (@theme_selected_bg_color, 1.3);
 }
 
-/************
- * menuitem *
- ************/
-
-toolbar .raised button menuitem,
-toolbar menubar button menuitem,
-toolbar menuitem,
-toolbar.primary-toolbar menuitem,
-toolbar.primary-toolbar button menuitem,
-window.background.popup menu menuitem,
-window.background.popup menuitem {
-/* Fix height change in nautilus menu item view options */
-    padding: 0px;
-    border-width: 0px;
-}
-
-toolbar .raised button menuitem,
-toolbar menubar button menuitem,
-toolbar menubar .linked button menuitem,
-toolbar menuitem,
-toolbar.primary-toolbar menuitem,
-toolbar.primary-toolbar button menuitem,
-window.background.popup menu menuitem,
-window.background.popup menuitem {
-/*    transition: all 300ms ease-out; FIXME this caused items jumpings*/
-/*    -GtkMenuItem-arrow-scaling: 0.7; */
+menu > menuitem,
+.menu > menuitem {
+    background-color: @menu_bg_dark_color;
     transition: all 300ms ease-out;
     border-radius: 0px;
     color: @menu_fg_dark_color;
-    text-shadow: 1px 1px @menu_shadow_dark_color;
+    text-shadow: none;
     padding: 5px 5px;
-    min-height: 22px;
-}
-
-toolbar menuitem label,
-toolbar.primary-toolbar menuitem label,
-toolbar .raised button menuitem label,
-toolbar menubar button menuitem label,
-toolbar.primary-toolbar button menuitem label {
-    color: @menu_fg_dark_color;
-    text-shadow: 1px 1px @menu_shadow_dark_color;
-}
-
-treemenu menu {
-    background-color: @menu_bg_dark_color;
-}
-
-treemenu menuitem {
-    border-style: none;
-    border-width: 0px;
-}
-
-toolbar combobox menuitem,
-combobox menuitem {
-    transition: all 300ms ease-out;
-    color: @menu_fg_dark_color;
-    text-shadow: 0px 1px @menu_shadow_dark_color;
+    min-height: 18px;
 }
 
-/* needed for .menuitem with gtk+-3.20 !!! */
-combobox menuitem .cell {
+/* fixes for firefox menus */
+.menuitem {
+	transition: none;
     color: @menu_fg_dark_color;
-    text-shadow: 0px 1px @menu_shadow_dark_color;
-}
-
-/* needed for .menuitem with gtk+-3.18 */
-treemenu menu menuitem .cell {
-    background-image: none;
-    background-color: transparent;
-    color: @menu_fg_dark_color;
-    text-shadow: 0px 1px @menu_shadow_dark_color;
-}
-
-treemenu menu menuitem:hover,
-combobox menuitem:hover {
-    background-image: -gtk-gradient (linear,
-                                     left top, left bottom,
-                                     from (shade(@menu_bg_dark_color, 2.03)),
-                                     to   (shade(@menu_bg_dark_color, 1.17)));
-    color: shade (@theme_selected_bg_color, 1.6);
-    text-shadow: 0px 1px @theme_selected_shadow_color;
+	text-shadow: none;
 }
 
-treemenu menu menuitem:hover .cell,
-combobox menuitem:hover .cell {
+/* fixes for firefox menus */
+menuitem:hover,
+menuitem label:hover {
     color: shade (@theme_selected_bg_color, 1.6);
-    text-shadow: 0px 1px @theme_selected_shadow_color;
+    text-shadow: none;
 }
 
-window.background.popup menuitem:hover,
-window.background.popup menu menuitem:hover {
-    /* contextual menu item-selected */
+menu > menuitem:active,
+menu > menuitem:hover,
+.menu > menuitem:active,
+.menu > menuitem:hover {
     background-color: shade (@theme_bg_dark_color, 1.2);
     background-image: -gtk-gradient (linear,
                                      left top, left bottom,
                                      from (shade(@menu_bg_dark_color, 2.03)),
                                      to   (shade(@menu_bg_dark_color, 1.17)));
     color: shade (@theme_selected_bg_color, 1.6);
-    text-shadow: 0px 1px @theme_selected_shadow_color;
+    text-shadow: none;
     border-radius: 6px;
     border-width: 1px;
     border-image: none;
@@ -216,186 +142,188 @@ window.background.popup menu menuitem:hover {
                 inset  0px -1px shade (@theme_selected_bg_color, 1.3);
 }
 
-toolbar menuitem *:hover,
-toolbar.primary-toolbar button menuitem *:hover,
-toolbar .raised button menuitem *:hover, /* menuitem opciones visualizacion nautilus  */
-toolbar menubar button menuitem *:hover, 
-combobox menuitem *:hover, 
-treemenu menuitem *:active,
-treemenu menuitem *:hover,
-window.background.popup menuitem *:active,
-window.background.popup menuitem *:hover, 
-window.background.popup menuitem:hover,
-window.background.popup menu menuitem:hover {
-    color: shade (@theme_selected_bg_color, 1.6);
-    text-shadow: 0px 1px @theme_selected_shadow_color;
-}
-
-toolbar.primary-toolbar menuitem *:disabled,
-toolbar .raised button menuitem *:disabled,
-toolbar.menubar button menuitem *:disabled,
-toolbar.primary-toolbar button menuitem *:disabled,
-toolbar menuitem *:disabled,
-window.background.popup menuitem:disabled,
-window.background.popup menuitem *:disabled {
-    /* contextual menu disabled */
+menu > menuitem:disabled,
+.menu > menuitem:disabled {
+    background-color: @menu_bg_dark_color;
     color: mix (@menu_fg_dark_color, @menu_bg_dark_color, 0.4);
     text-shadow: none;
 }
 
-window.background.popup menuitem check,
-window.background.popup menuitem radio,
-window.background.popup menuitem check:hover,
-window.background.popup menuitem radio:hover,
-window.background.popup menuitem check:disabled,
-window.background.popup menuitem radio:disabled,
-window.background.popup menuitem check:active:disabled,
-window.background.popup menuitem radio:active:disabled,
-window.background.popup menuitem check:checked:disabled,
-window.background.popup menuitem radio:checked:disabled,
-window.background.popup menuitem check:indeterminate:disabled,
-window.background.popup menuitem radio:indeterminate:disabled {
-    border-width: 0px;
-    border-style: none;
-    background-image: none;
-	min-height: 12px;
-	min-width: 12px;
-	background-position: center center;
+menu > menuitem accelerator:disabled,
+.menu > menuitem accelerator:disabled {
+    color: alpha (mix (@menu_fg_dark_color, @menu_bg_dark_color, 0.4), 0.8);
+    text-shadow: none;
 }
 
-toolbar .raised button menuitem check:indeterminate,
-toolbar .raised button menuitem radio:indeterminate,
-window.background.popup menuitem check:indeterminate,
-window.background.popup menuitem radio:indeterminate,
-toolbar .raised button menuitem check:active,
-toolbar .raised button menuitem radio:active,
-window.background.popup menuitem check:active,
-window.background.popup menuitem radio:active,
-toolbar .raised button menuitem check:checked,
-toolbar .raised button menuitem radio:checked,
-window.background.popup menuitem check:checked,
-window.background.popup menuitem radio:checked {
-    border-width: 0px;
-    border-style: none;
-    background-image: none;
-    background-color: @menu_bg_dark_color;
-    /* contextual menu check */
+/* combobox menus */
+combobox #gtk-combobox-popup-menu menuitem cellview {
+    text-shadow: none;
     color: @menu_fg_dark_color;
 }
 
-toolbar .raised button menuitem check:indeterminate:hover,
-toolbar .raised button menuitem radio:indeterminate:hover,
-window.background.popup menuitem check:indeterminate:hover,
-window.background.popup menuitem radio:indeterminate:hover,
-toolbar .raised button menuitem check:active:hover,
-toolbar .raised button menuitem radio:active:hover,
-window.background.popup menuitem check:active:hover,
-window.background.popup menuitem radio:active:hover,
-toolbar .raised button menuitem check:checked:hover,
-toolbar .raised button menuitem radio:checked:hover,
-window.background.popup menuitem check:checked:hover,
-window.background.popup menuitem radio:checked:hover {
-    border-color: @theme_selected_fg_color;
-    color: @theme_selected_fg_color;
+combobox #gtk-combobox-popup-menu menuitem:hover cellview {
+    text-shadow: none;
+    color: shade (@theme_selected_bg_color, 1.6);
+}
+
+menuitem accelerator {
+    color: alpha (@menu_fg_dark_color, 0.8);
 }
 
-window.background.popup menuitem arrow {
+menuitem accelerator:hover,
+menuitem accelerator:active {
+    color: alpha (@theme_selected_fg_color, 0.8);
+}
+
+menuitem > arrow {
     min-height: 16px;
     min-width: 16px;
     margin-left: 10px;
     color: @menu_fg_color;
 }
 
-window.background.popup menu menuitem arrow:dir(ltr) {
+menu > menuitem > arrow:dir(ltr),
+.menu > menuitem > arrow:dir(ltr) {
 	-gtk-icon-source: -gtk-icontheme("pan-end-symbolic");
 }
 
-window.background.popup menu menuitem arrow:dir(rtl) {
+menu > menuitem > arrow:dir(rtl),
+.menu > menuitem > arrow:dir(rtl) {
         -gtk-icon-source: -gtk-icontheme("pan-end-symbolic-rtl");
 }
 
-window.background.popup menu arrow.top {
+menu > arrow.top,
+.menu > arrow.top {
       -gtk-icon-source: -gtk-icontheme("pan-up-symbolic");
 }
 
-window.background.popup menu arrow.bottom {
+menu > arrow.bottom,
+.menu > arrow.bottom {
       -gtk-icon-source: -gtk-icontheme("pan-down-symbolic");
 }
 
-window.background.popup menu arrow:hover {
-    border-color: @theme_selected_fg_color;
-    color: shade (@theme_selected_bg_color, 1.6);
-}
-
-window.background.popup menuitem check:disabled,
-window.background.popup menuitem radio:disabled,
-window.background.popup menuitem check:active:disabled,
-window.background.popup menuitem radio:active:disabled,
-window.background.popup menuitem check:checked:disabled,
-window.background.popup menuitem radio:checked:disabled,
-window.background.popup menuitem check:indeterminate:disabled,
-window.background.popup menuitem radio:indeterminate:disabled {
-    color: mix (@menu_fg_dark_color, @menu_bg_dark_color, 0.6);
-    text-shadow: none;
+/* settings for 4 menu level, this is needed to override the menuitem:hover
+   state from previous menu level, as GtkArrow itself don't support states very well.
+   thanks gtk+ devs for this madness */
+menu > menuitem > arrow.right,
+menu > menuitem:hover menu > menuitem > arrow.right,
+menu > menuitem:hover menu > menuitem:hover menu > menuitem > arrow.right,
+menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem > arrow.right,
+menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem > arrow.right,
+menu > menuitem > arrow.left,
+menu > menuitem:hover menu > menuitem > arrow.left,
+menu > menuitem:hover menu > menuitem:hover menu > menuitem > arrow.left,
+menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem > arrow.left,
+menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem > arrow.left,
+.menu > menuitem > arrow.right,
+.menu > menuitem:hover .menu > menuitem > arrow.right,
+.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem > arrow.right,
+.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem > arrow.right,
+.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem > arrow.right,
+.menu > menuitem > arrow.left,
+.menu > menuitem:hover .menu > menuitem > arrow.left,
+.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem > arrow.left,
+.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem > arrow.left,
+.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem > arrow.left  {
+    color: @menu_fg_dark_color;
 }
 
-menubar menuitem calendar,
-menubar menuitem calendar.button,
-menubar menuitem calendar.header,
-menubar menuitem calendar.view,
-toolbar.primary-toolbar menuitem calendar,
-toolbar.primary-toolbar menuitem calendar.button,
-toolbar.primary-toolbar menuitem calendar.header,
-toolbar.primary-toolbar menuitem calendar.view {
+menu > menuitem:hover > arrow.right,
+menu > menuitem:hover menu > menuitem:hover arrow.right,
+menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover arrow.right,
+menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover arrow.right,
+menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover arrow.right,
+menu > menuitem:hover > arrow.left,
+menu > menuitem:hover menu > menuitem:hover arrow.left,
+menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover arrow.left,
+menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover arrow.left,
+menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover menu > menuitem:hover arrow.left,
+.menu > menuitem:hover > arrow.right,
+.menu > menuitem:hover .menu > menuitem:hover arrow.right,
+.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover arrow.right,
+.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover arrow.right,
+.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover arrow.right,
+.menu > menuitem:hover > arrow.left,
+.menu > menuitem:hover .menu > menuitem:hover arrow.left,
+.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover arrow.left,
+.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover arrow.left,
+.menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover .menu > menuitem:hover arrow.left {
+    color: shade (@theme_selected_bg_color, 1.2);
+   -gtk-icon-shadow:  0px  1px shade (@menu_fg_dark_color, 1.0),
+                      1px  0px shade (@menu_fg_dark_color, 1.0),
+                     -1px  0px shade (@menu_fg_dark_color, 1.0),
+                      0px -1px shade (@menu_fg_dark_color, 1.0);
+}
+
+menu > menuitem:disabled > arrow,
+.menu > menuitem:disabled > arrow {
     background-color: @menu_bg_dark_color;
-    background-image: none;
-    border-radius: 0;
-    border-style: solid;
-    border-width: 0;
-    padding: 0;
-    color: @menu_fg_dark_color;
+    color: mix (@menu_fg_dark_color, @menu_bg_dark_color, 0.4);
+   -gtk-icon-shadow: none;
 }
 
-menubar menuitem calendar,
-toolbar.primary-toolbar menuitem calendar {
-    background-color: shade (@menu_bg_dark_color, 1.3);
+/* scroll arrows */
+menu > arrow,
+.menu > arrow {
+    border-color: transparent;
+    background-color: transparent;
     background-image: none;
+    min-height: 16px;
+    min-width: 16px;
+    padding: 4px;
+    color: @menu_fg_dark_color;
 }
 
-menubar menuitem scale trough {
-    background-image: -gtk-gradient (linear,
-                                     left top,
-                                     left bottom,
-                                     from (shade(@menu_bg_dark_color, 0.80)),
-                                     color-stop (0.20, shade(@menu_bg_dark_color, 0.85)),
-                                     to   (shade(@menu_bg_dark_color, 0.96)));
-    border-style: none;
-    border-width: 0px;
-    border-radius: 8px;
-    box-shadow: inset  1px  1px alpha(#000, 0.08),
-                inset -1px -1px alpha(#000, 0.08);
+menu > arrow.top,
+.menu > arrow.top {
+    margin-top: -2px;
+    margin-left: -1px;
+    margin-right: -1px;
 }
 
-menubar menuitem accelerator,
-toolbar.primary-toolbar menuitem accelerator {
-    color: alpha (@menu_fg_dark_color, 0.8);
+menu > arrow.bottom,
+.menu > arrow.bottom {
+    margin-bottom: -2px;
+    margin-left: -1px;
+    margin-right: -1px;
 }
 
-menubar menuitem accelerator:hover,
-toolbar.primary-toolbar menuitem accelerator:hover {
-    color: alpha (@theme_selected_fg_color, 0.8);
+menu > arrow:hover,
+.menu > arrow:hover {
+    color: shade (@theme_selected_bg_color, 1.2);
+   -gtk-icon-shadow:  0px  1px shade (@menu_fg_dark_color, 1.0),
+                      1px  0px shade (@menu_fg_dark_color, 1.0),
+                     -1px  0px shade (@menu_fg_dark_color, 1.0),
+                      0px -1px shade (@menu_fg_dark_color, 1.0);
+    background-color: shade (@theme_bg_dark_color, 1.2);
+    background-image: -gtk-gradient (linear,
+                                     left top, left bottom,
+                                     from (shade(@menu_bg_dark_color, 2.03)),
+                                     to   (shade(@menu_bg_dark_color, 1.17)));
+    text-shadow: none;
+    border-radius: 0px;
+    border-width: 1px;
+    border-image: none;
+    padding: 5px 5px;
+    box-shadow: inset  0px  1px shade (@theme_selected_bg_color, 1.3),
+                inset  1px  0px shade (@theme_selected_bg_color, 1.3),
+                inset -1px  0px shade (@theme_selected_bg_color, 1.3),
+                inset  0px -1px shade (@theme_selected_bg_color, 1.3);
 }
 
-menubar menuitem accelerator:disabled,
-toolbar.primary-toolbar menuitem accelerator:disabled {
-    color: alpha (mix (@menu_fg_dark_color, @menu_bg_dark_color, 0.4), 0.8);
-    text-shadow: none;
+menu > arrow:disabled,
+.menu > arrow:disabled {
+    color: mix (@menu_fg_color, @menu_bg_color, 0.6);
+   -gtk-icon-shadow: none;
+    background-color: transparent;
+    border-color: transparent;
 }
 
-window.background.popup menu separator {
-/*	-GtkMenuItem-horizontal-padding: 0; deprecated */
-/*    -GtkWidget-separator-height: 1; */
+menu separator,
+.menu separator,
+menuitem separator {
     min-height: 1px;
+    background-color: shade(@menu_fg_dark_color, 0.3);
     border-image: -gtk-gradient (linear,
                                  left top, right top,
                                  from (alpha (#000, 0.00)),
@@ -404,18 +332,99 @@ window.background.popup menu separator {
                                  to (alpha (#000, 0.00))) 1;
 }
 
+/* fix for broken firefox */
+menu separator {
+    color: shade(@menu_fg_dark_color, 0.3);
+}
+
+menuitem check,
+menuitem radio,
+menuitem check:hover,
+menuitem radio:hover,
+menuitem check:checked,
+menuitem radio:checked,
+menuitem check:disabled,
+menuitem radio:disabled,
+menuitem check:active:disabled,
+menuitem radio:active:disabled,
+menuitem check:checked:disabled,
+menuitem radio:checked:disabled,
+menuitem check:indeterminate:disabled,
+menuitem radio:indeterminate:disabled {
+    border-width: 0px;
+    border-style: none;
+    background-image: none;
+    background-color: transparent;
+	min-height: 12px;
+	min-width: 12px;
+	background-position: center center;
+    color: @menu_fg_dark_color;
+}
+
+menuitem check:disabled,
+menuitem radio:disabled,
+menuitem check:active:disabled,
+menuitem radio:active:disabled,
+menuitem check:checked:disabled,
+menuitem radio:checked:disabled,
+menuitem check:indeterminate:disabled,
+menuitem radio:indeterminate:disabled {
+    color: mix (@menu_fg_dark_color, @menu_bg_dark_color, 0.6);
+    text-shadow: none;
+}
+
 /***************
  * Menu Button *
  ***************/
 
-button menuitem menubar:active,
-button menuitem menubar *:active {
-    color: @menu_fg_dark_color;
-    background-image: none;
-    background-color: @menu_bg_dark_color;
-    border-radius: 5px 5px 0px 0px;
-    border-image: none;
-    border-width: 1px 1px 0px 1px;
-    border-color: shade(@button_border, 1.30);
-    border-style: solid;
+toolbar button.popup:selected,
+toolbar .raised button.popup:selected,
+button.popup:selected,
+.linked button.popup:selected,
+toolbar .linked.raised button.popup:selected {
+/*	background-image: none;
+	background-color: @menu_bg_color;
+	border-image: none;
+	border-color: @menu_bg_color;
+	border-radius: 4px 4px 0 0;
+	color: @theme_text_color;*/
+}
+
+button.popup:selected,
+.linked button.popup:selected,
+toolbar .linked.raised button.popup:selected {
+	text-shadow: none;
+	-gtk-icon-shadow: none;
+	box-shadow: none;
+}
+
+.linked button.popup:selected:last-child,
+toolbar .linked.raised button.popup:selected:last-child {
+	border-top-left-radius: 0;
+}
+
+.linked button.popup:selected:first-child,
+toolbar .linked.raised button.popup:selected:first-child {
+	border-top-right-radius: 0;
+}
+
+menubar button.popup:selected {
+	background-image: none;
+	background-color: @menu_bg_color;
+	border-radius: 4px 4px 0 0;
+	border-image: none;
+	border-width: 1px 1px 0 1px;
+	border-color: @menu_bg_color;
+	border-style: solid;
 }
+
+menubar button.popup:selected,
+button.popup:selected,
+toolbar button.popup:selected {
+	color: @theme_text_color;
+}
+
+menu button.popup {
+	text-shadow: none;
+}
+
author	raveit65 <[email protected]>	2016-04-25 21:49:23 +0200
committer	raveit65 <[email protected]>	2016-04-25 21:50:03 +0200
commit	2161d20c9c8e7ace63352798c0750ffdb96088e9 (patch)
tree	b5a34127396725f33c68278db8e9d334974142ce /desktop-themes/Blue-Submarine
parent	f75d83e9616b99e6c9eda4640c7663809fe2c9ab (diff)
download	mate-themes-2161d20c9c8e7ace63352798c0750ffdb96088e9.tar.bz2 mate-themes-2161d20c9c8e7ace63352798c0750ffdb96088e9.tar.xz