Basic MATE Gtk3 support (#473)

* * Match Metacity theme color

* [Gtk3] Add MATE support

gtk-3.0/gtk.gresource.xml

@@ -26,6 +26,7 @@
 		<file preprocess='to-pixdata'>assets/menuitem-radio-checked-hover.png</file>
 		<file preprocess='to-pixdata'>assets/menuitem-radio-checked-insensitive.png</file>
 		<file preprocess='to-pixdata'>assets/menuitem-radio-checked.png</file>
+		<file preprocess='to-pixdata'>assets/pane-handle.png</file>
 		<file preprocess='to-pixdata'>assets/radio-checked-dark.png</file>
 		<file preprocess='to-pixdata'>assets/radio-checked-insensitive-dark.png</file>
 		<file preprocess='to-pixdata'>assets/radio-checked-insensitive.png</file>

gtk-3.0/scss/apps/_mate-applications.scss

@@ -0,0 +1,81 @@
+@import "panel";
+
+/****************
+ ! MATE styles *
+*****************/
+
+@include exports("mate-applications") {
+    .mate-panel-menu-bar {
+        @extend %panel;
+
+        border: 0;
+        padding: 0;
+        text-shadow: none;
+    }
+
+    MatePanelApplet .label,
+    PanelMenuBar.menubar > .menuitem {
+        color: $panel_fg_color;
+    }
+
+    PanelSeparator, MatePanelAppletFrameDBus {
+        border-width: 0;
+        color: transparent;
+        background-image: -gtk-scaled(url("../assets/pane-handle.png"));
+        background-color: transparent;
+        background-repeat: no-repeat;
+        background-position: left;
+    }
+
+    MatePanelApplet .button,
+    MatePanelApplet .button.flat,
+    MatePanelApplet .button.toggle
+    MatePanelApplet .button.flat.toggle {
+        background-image: none;
+        background-color: transparent;
+        border-color: transparent;
+        border-style: solid;
+        border-radius: 0;
+        border-width: 1px;
+        color: $panel_fg_color;
+        text-shadow: none;
+        box-shadow: none;
+        padding: 2px;
+    }
+
+    MatePanelApplet .button:hover:active,
+    MatePanelApplet .button:checked,
+    MatePanelApplet .button:checked:hover,
+    MatePanelApplet .button.flat:hover:active,
+    MatePanelApplet .button.flat:checked,
+    MatePanelApplet .button.flat:checked:hover,
+    MatePanelApplet .button.toggle:hover:active,
+    MatePanelApplet .button.toggle:checked,
+    MatePanelApplet .button.toggle:checked:hover,
+    MatePanelApplet .button.flat.toggle:hover:active,
+    MatePanelApplet .button.flat.toggle:checked,
+    MatePanelApplet .button.flat.toggle:checked:hover {
+        background-image: none;
+        background-color: darker($panel_bg_color);
+        border-color: transparent;
+        border-radius: 0;
+        border-width: 1px;
+        color: lighter($panel_fg_color);
+        text-shadow: none;
+        padding: 2px;
+    }
+
+    MatePanelApplet .button:hover,
+    MatePanelApplet .button.flat:hover,
+    MatePanelApplet .button.toggle:hover,
+    MatePanelApplet .button.flat.toggle:hover {
+        background-image: none;
+        background-color: shade($panel_bg_color, 1.3);
+        border-color: transparent;
+        border-radius: 0;
+        border-width: 1px;
+        color: $selected_fg_color;
+        text-shadow: none;
+        padding: 2px;
+    }
+}

gtk-3.20/gtk.gresource.xml

@@ -26,6 +26,7 @@
 		<file preprocess='to-pixdata'>assets/menuitem-radio-checked-hover.png</file>
 		<file preprocess='to-pixdata'>assets/menuitem-radio-checked-insensitive.png</file>
 		<file preprocess='to-pixdata'>assets/menuitem-radio-checked.png</file>
+		<file preprocess='to-pixdata'>assets/pane-handle.png</file>
 		<file preprocess='to-pixdata'>assets/radio-checked-dark.png</file>
 		<file preprocess='to-pixdata'>assets/radio-checked-insensitive-dark.png</file>
 		<file preprocess='to-pixdata'>assets/radio-checked-insensitive.png</file>

gtk-3.20/scss/_widgets.scss

@@ -25,6 +25,7 @@
 @import "widgets/view";
 @import "widgets/window";
 
+@import "apps/mate-applications";
 @import "apps/cinnamon-applications";
 @import "apps/unity-greeter";
 @import "apps/gedit";

gtk-3.20/scss/apps/_mate-applications.scss

@@ -0,0 +1,85 @@
+@import "panel";
+
+/****************
+ ! MATE styles *
+*****************/
+
+@include exports("mate-applications") {
+    .mate-panel-menu-bar {
+        @extend %panel;
+
+        border: 0;
+        padding: 0;
+        text-shadow: none;
+    }
+
+    #PanelApplet label,
+    .mate-panel-menu-bar menubar > menuitem {
+        color: $panel_fg_color;
+    }
+
+    PanelSeparator, MatePanelAppletFrameDBus {
+        border-width: 0;
+        color: transparent;
+        background-image: -gtk-scaled(url("../assets/pane-handle.png"));
+        background-color: transparent;
+        background-repeat: no-repeat;
+        background-position: left;
+    }
+
+    #PanelApplet button,
+    #PanelApplet button.flat,
+    #PanelApplet button.toggle
+    #PanelApplet button.flat.toggle {
+        background-image: none;
+        background-color: transparent;
+        border-color: transparent;
+        border-style: solid;
+        border-radius: 0;
+        border-width: 1px;
+        color: $panel_fg_color;
+        text-shadow: none;
+        box-shadow: none;
+        padding: 2px;
+    }
+
+    #PanelApplet button:hover:active,
+    #PanelApplet button:checked,
+    #PanelApplet button:checked:hover,
+    #PanelApplet button.flat:hover:active,
+    #PanelApplet button.flat:checked,
+    #PanelApplet button.flat:checked:hover,
+    #PanelApplet button.toggle:hover:active,
+    #PanelApplet button.toggle:checked,
+    #PanelApplet button.toggle:checked:hover,
+    #PanelApplet button.flat.toggle:hover:active,
+    #PanelApplet button.flat.toggle:checked,
+    #PanelApplet button.flat.toggle:checked:hover {
+        background-image: none;
+        background-color: darker($panel_bg_color);
+        border-color: transparent;
+        border-radius: 0;
+        border-width: 1px;
+        color: lighter($panel_fg_color);
+        text-shadow: none;
+        padding: 2px;
+    }
+
+    #PanelApplet button:hover,
+    #PanelApplet button.flat:hover,
+    #PanelApplet button.toggle:hover,
+    #PanelApplet button.flat.toggle:hover {
+        background-image: none;
+        background-color: shade($panel_bg_color, 1.3);
+        border-color: transparent;
+        border-radius: 0;
+        border-width: 1px;
+        color: $selected_fg_color;
+        text-shadow: none;
+        padding: 2px;
+    }
+
+    .mate-panel-menu-bar menubar > menuitem {
+        padding: 3px 7px;
+    }
+}

metacity-1/metacity-theme-2.xml

@@ -9,7 +9,7 @@
 </info>
 
 <!-- ::: CONSTANTS ::: -->
-<constant name="C_titlebar" value="#333333" />
+<constant name="C_titlebar" value="#444444" />
 <constant name="C_border_focused" value="#484848" />
 <constant name="C_border_unfocused" value="#393939" />
 <constant name="C_title_focused" value="#eeeeee" />

metacity-1/metacity-theme-3.xml

@@ -9,7 +9,7 @@
 </info>
 
 <!-- ::: CONSTANTS ::: -->
-<constant name="C_titlebar" value="gtk:custom(wm_bg,#333333)" />
+<constant name="C_titlebar" value="gtk:custom(wm_bg,#444444)" />
 <constant name="C_border_focused" value="gtk:custom(wm_border_focused,#484848)" />
 <constant name="C_border_unfocused" value="gtk:custom(wm_border_unfocused,#393939)" />
 <constant name="C_title_focused" value="gtk:custom(wm_title_focused,#eeeeee)" />