Menta themes GTK3: add transition effect for buttons and menu-buttons/items

2 files changed, 38 insertions, 5 deletions

diff --git a/desktop-themes/Menta/gtk-3.0/gtk-widgets.css b/desktop-themes/Menta/gtk-3.0/gtk-widgets.css
index cb14da08..3712f90d 100644
--- a/desktop-themes/Menta/gtk-3.0/gtk-widgets.css
+++ b/desktop-themes/Menta/gtk-3.0/gtk-widgets.css
@@ -1028,6 +1028,7 @@ GtkComboBox.combobox-entry .button {
 }
 
 .button {
+	transition: all 200ms ease-out;
 	-GtkButton-image-spacing: 4;
 	-GtkButton-interior-focus: true;
 	-GtkButton-default-border: 0;
@@ -2003,6 +2004,7 @@ GtkTreeMenu .menuitem,
 }
 
 .menubar .menuitem {
+	transition: all 200ms ease-out;
 	border-style: none;
 	padding: 4px 6px;
 	text-shadow: 0 1px @button_text_shadow;
@@ -2020,6 +2022,7 @@ GtkTreeMenu .menuitem,
 
 .menu .menuitem {
 	-GtkMenuItem-arrow-scaling: 0.4;
+	transition: all 100ms ease-out;
 	padding: 4px;
 }
 
diff --git a/desktop-themes/Menta/gtk-3.0/mate-applications.css b/desktop-themes/Menta/gtk-3.0/mate-applications.css
index eddab3ea..4fdc75d9 100644
--- a/desktop-themes/Menta/gtk-3.0/mate-applications.css
+++ b/desktop-themes/Menta/gtk-3.0/mate-applications.css
@@ -250,7 +250,7 @@ PanelMenuBar.menubar .menu .menuitem:hover {
 /* desktop-applet, clockapplet, drivemount, character-map,
 dictionary */
 MatePanelApplet .button {
-	padding: 1px 0px 1px 0px;
+	transition: all 300ms ease-out;
 	background-image: none;
 	background-color: @theme_bg_color;
 	color: @theme_text_color;
@@ -265,12 +265,12 @@ MatePanelApplet .button {
 
 MatePanelApplet .button:active:hover,
 MatePanelApplet .button:active {
+	transition: all 300ms ease-out;
 	background-image: linear-gradient(to bottom,
 		shade (@theme_selected_bg_color, 0.86),
 		shade (@theme_selected_bg_color, 0.26));
 	background-color: @theme_base_color;
 	color: shade (@theme_selected_fg_color, 1.00);
-
 	border-image: none;
 	border-style: solid;
 	border-width: 0px;
@@ -280,12 +280,12 @@ MatePanelApplet .button:active {
 }
 
 MatePanelApplet .button:hover {
+	transition: all 300ms ease-out;
 	background-image: linear-gradient(to bottom,
 		@theme_bg_color,
 		shade (@theme_selected_bg_color, 0.86));
 	background-color: @theme_base_color;
 	color: shade (@theme_text_color, 1.0);
-
 	border-image: none;
 	border-style: solid;
 	border-width: 0px;
@@ -296,6 +296,7 @@ MatePanelApplet .button:hover {
 
 /*Wncklist */
 WnckTasklist .button {
+	transition: all 300ms ease-out;
 	background-image: linear-gradient(to bottom,
 		shade (@theme_bg_color, 1.0),
 		shade (@theme_bg_color, 0.96));
@@ -312,12 +313,12 @@ WnckTasklist .button {
 
 WnckTasklist .button:active:hover,
 WnckTasklist .button:active {
+	transition: all 300ms ease-out;
 	background-image: linear-gradient(to bottom,
 		shade (@theme_selected_bg_color, 0.86),
 		shade (@theme_selected_bg_color, 0.26));
 	background-color: @theme_base_color;
 	color: shade (@theme_selected_fg_color, 1.00);
-
 	border-image: none;
 	border-style: solid;
 	border-width: 0px;
@@ -327,12 +328,12 @@ WnckTasklist .button:active {
 }
 
 WnckTasklist .button:hover {
+	transition: all 300ms ease-out;
 	background-image: linear-gradient(to bottom,
 		@theme_bg_color,
 		shade (@theme_selected_bg_color, 0.86));
 	background-color: @theme_base_color;
 	color: shade (@theme_text_color, 1.0);
-
 	border-image: none;
 	border-style: solid;
 	border-width: 0px;
@@ -341,6 +342,35 @@ WnckTasklist .button:hover {
 	-GtkWidget-window-dragging: true;
 }
 
+/* set selected menubar button */
+PanelMenuBar.menubar .menuitem:hover {
+	transition: all 300ms ease-out;
+	background-image: linear-gradient(to bottom,
+		shade (@theme_selected_bg_color, 0.86),
+		shade (@theme_selected_bg_color, 0.26));
+	background-color: @theme_base_color;
+	color: shade (@theme_selected_fg_color, 1.00);
+	text-shadow: none;
+	border-style: solid;
+	border-width: 0px;
+	border-radius: 5px;
+}
+
+/* set selected menubar menuitem */
+PanelMenuBar.menubar .menu .menuitem:active:hover,
+PanelMenuBar.menubar .menu .menuitem:hover {
+	transition: all 200ms ease-out;
+	background-color: @theme_selected_bg_color;
+	background-image: linear-gradient(to bottom,
+		shade (@theme_selected_bg_color, 1.0),
+		shade (@theme_selected_bg_color, 0.85));
+	color: shade (@theme_selected_fg_color, 1.00);
+	text-shadow: none;
+	border-style: none;
+	border-width: 0px;
+	border-radius: 0px;
+}
+
 /* set normal button WnckSelector */
 .mate-panel-window-menu-menu-bar .menuitem,
 MatePanelApplet > WnckSelector.menubar .menuitem {