Gtk3 BlackMate: re-work panel settings to support full transparency

1 files changed, 130 insertions, 58 deletions

diff --git a/desktop-themes/BlackMATE/gtk-3.0/mate-applications.css b/desktop-themes/BlackMATE/gtk-3.0/mate-applications.css
index bb6c124f..592d81d7 100644
--- a/desktop-themes/BlackMATE/gtk-3.0/mate-applications.css
+++ b/desktop-themes/BlackMATE/gtk-3.0/mate-applications.css
@@ -291,32 +291,89 @@ CajaQueryEditor .toolbar .entry:focus {
  ****************/
 
 /* the panel bar itself */
-.mate-panel-menu-bar,
-MatePanelApplet > GtkMenuBar.menubar,
-PanelToplevel,
-PanelWidget,
-PanelFrame,
-PanelAppletFrame,
-MatePanelAppletFrameDBus,
-MatePanelAppletContainer,
-MatePanelApplet {
-	background-image: none;
+.mate-panel-menu-bar {
 	background-color: @theme_bg_color;
-	padding: 0;
+    background-image: none;
+    /* normal panel */
 	color: @theme_fg_color;
-	text-shadow: none;
+    /* transparent panel light desktop background*/
+/*    color: @theme_selected_fg_color; */
+    text-shadow: none;
 }
 
-/* needed for a working top panel with 24px (default) */
-PanelMenuBar.menubar * {
-	background-image: none;
-	background-color: transparent;
-	border-width: 0px;
-	border-style: none;
-	padding: 0px;
+/* first make all transparent */
+WnckSelector.menubar,
+PanelMenuBar.menubar,
+WnckSelector GtkMenuItem,
+PanelMenuBar GtkMenuItem,
+MatePanelApplet GtkToggleButton.button {
+    border-image: none;
+    border-color: transparent;
+    background-image: none;
+    background-color: transparent;
+    box-shadow: none;
+}
+
+MatePanelApplet {
+    border-width: 0;
+}
+
+/* panel grip */
+PanelToplevel.background.mate-custom-panel-background {
+    background-color: transparent;
+    border-radius: 3px;
+/* enable for making borders visible */
+/*    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); */
+}
+
+/* hide buttons */
+PanelToplevel.background.mate-custom-panel-background .button {
+    background: transparent;
+    border-radius: 3px;
+    padding: 0px;
+    box-shadow: none;
+}
+
+PanelToplevel.background.mate-custom-panel-background .button:hover {
+    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);
+}
+
+MatePanelAppletFrameDBus PanelSeparator,
+PanelSeparator {
+	border-width: 0;
+	background-image: -gtk-gradient (linear, left top, left bottom,
+		from (shade (@theme_bg_color, 0.96)),
+		to (shade (@theme_bg_color, 1.05)));
+	color: shade (@theme_fg_color, 0.45);
 	text-shadow: none;
 }
 
+/* dictionary applet */
+GdictApplet .entry,
+GdictApplet .entry:focus {
+    border-style: none;
+    padding: 1px 4px 5px 4px;
+    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);
+}
+
+/* the grid left from wnckpager and wncktasklist */
+MatePanelAppletFrameDBus {
+    background-image: -gtk-scaled(url("assets/panel-grid.svg"));
+    background-color: transparent;
+    background-repeat: no-repeat;
+    background-position: left;
+}
+
+/* set normal menubar button */
 PanelMenuBar.menubar .menuitem {
     transition: all 300ms ease-out;
 }
@@ -331,42 +388,41 @@ PanelMenuBar.menubar .menu .menuitem {
 }
 
 /* set selected menubar menuitem */
+PanelMenuBar.menubar .menu .menuitem:checked:hover,
 PanelMenuBar.menubar .menu .menuitem:active:hover,
 PanelMenuBar.menubar .menu .menuitem:hover {
 }
 
-MatePanelApplet {
-	border-width: 0px;
+/* Mate menu button normal */
+/* makes the arrow visible, nothing more works */
+PanelMenuButton.button {
+    background-image: none;
+    background-color: transparent;
+    color: shade (@menu_fg_color, 1.00);
 }
 
-PanelSeparator {
-	border-width: 0;
-	background-image: -gtk-gradient (linear, left top, left bottom,
-		from (shade (@theme_bg_color, 0.96)),
-		to (shade (@theme_bg_color, 1.05)));
-	color: shade (@theme_fg_color, 0.45);
-	text-shadow: none;
+/* Mate menu menuitem */
+PanelMenuButton .menu .menuitem,
+PanelMenuButton .menu .menuitem:hover {
+    padding: 6px;
 }
 
-
 /* desktop-applet, clockapplet, drivemount, character-map,
 dictionary */
 MatePanelApplet .button,
 MatePanelApplet .button.flat {
     transition: all 400ms ease-out;
     border-radius: 1px;
-    transition: all 400ms ease-out;
-    /* Due to a bug somewhere in gtk or cairo,
-       a padding of zero (or even one) doesn't work always!!! */
     padding: 2px;
     border-radius: 3px;
     border-width: 1px;
     border-style: solid;
     text-shadow: none;
+    /* normal panel */
     color: @theme_fg_color;
-    background-image: linear-gradient(to bottom,
-                                      @button_hover_gradient_color_a,
-                                      @button_hover_gradient_color_b);
+    /* transparent panel light desktop background*/
+/*  color: @theme_selected_fg_color; */
+    background-image: none;
 }
 
 MatePanelApplet .button:checked:hover,
@@ -397,11 +453,22 @@ MatePanelApplet .button.flat:hover {
                       to (shade(@button_gradient_color_b, 0.7)));
 }
 
+/* drivemount */
+DriveList .button,
+DriveList .button.flat,
+DriveList .button:hover,
+DriveList .button.flat:hover,
+DriveList .button:active,
+DriveList .button.flat:active {
+    padding: 4px;
+    border-radius: 5px;
+    border-color: transparent;
+    box-shadow: none;
+}
+
 /*Wncklist */
 WnckTasklist .button {
     transition: all 400ms ease-out;
-    /* Due to a bug somewhere in gtk or cairo,
-       a padding of zero (or even one) doesn't work always!!! */
     padding: 2px;
     border-radius: 3px;
     border-width: 1px;
@@ -442,19 +509,16 @@ WnckTasklist .button:hover {
 	                                  shade(@less_dark_color, 0.4));
 }
 
-/* set button WnckSelector */
-MatePanelApplet > WnckSelector.menubar .menuitem {
+/* set normal button WnckSelector */
+WnckSelector.menubar .menuitem {
     border-radius: 3px;
     color: @theme_fg_color;
     border-style: solid;
-    background-image: linear-gradient(to bottom,
-                                      @button_hover_gradient_color_a,
-                                      @button_hover_gradient_color_b);
+    background-image: none;
 }
 
 /* set selected button WnckSelector */
-.mate-panel-window-menu-menu-bar .menuitem:hover,
-MatePanelApplet > WnckSelector.menubar .menuitem:hover {
+WnckSelector.menubar .menuitem:hover {
 	color: @theme_fg_color;
 	border-style: solid;
 	background-image: linear-gradient(to bottom,
@@ -464,8 +528,7 @@ MatePanelApplet > WnckSelector.menubar .menuitem:hover {
 }
 
 /* set WnckSelector menuitem */
-.mate-panel-window-menu-menu-bar .menu .menuitem,
-MatePanelApplet > WnckSelector.menubar .menu .menuitem {
+WnckSelector.menubar .menu .menuitem {
     background-image:  none;
     color: @theme_text_color;
     border-style: none;
@@ -474,8 +537,7 @@ MatePanelApplet > WnckSelector.menubar .menu .menuitem {
 }
 
 /* set WnckSelector selected menuitem */
-.mate-panel-window-menu-menu-bar .menu .menuitem:hover,
-MatePanelApplet > WnckSelector.menubar .menu .menuitem:hover {
+WnckSelector.menubar .menu .menuitem:hover {
 	border-image: none;
 	color: @theme_fg_color;
 	background-image: linear-gradient(to bottom,
@@ -491,27 +553,37 @@ MatePanelApplet > GtkMenuBar.menubar {
 
 WnckPager {
 	background-image: none;
-	border-color: @transparent;
-	background-color: @theme_bg_color;
+	border-color: transparent;
+	background-color: transparent;
 	text-shadow: none;
+    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);
+}
+
+/* selected WnckPager */
+WnckPager:selected {
+	background-image: linear-gradient(to bottom,
+		@theme_selected_bg_color,
+		shade (@theme_selected_bg_color, 0.36));
 }
 
 /* prelight of WnckPager */
-MatePanelApplet *:hover {
+WnckPager:hover {
 	background-image: linear-gradient(to bottom,
 		@theme_bg_color,
 		shade (@theme_selected_bg_color, 0.86));
-	background-color: @theme_base_color;
 }
 
-/* Classic icon style */
-.mate-panel-menu-bar {
-	-PanelMenuBar-icon-visible: true;
+NaTrayApplet {
+    -NaTrayApplet-icon-padding: 12px;
+    -NaTrayApplet-icon-size: 16;
 }
 
-NaTrayApplet {
-	-NaTrayApplet-icon-padding: 12;
-	-NaTrayApplet-icon-size: 16;
+/* Classic icon style */
+.mate-panel-menu-bar {
+    -PanelMenuBar-icon-visible: true;
 }
 
 /*********