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

2 files changed, 11 insertions, 4 deletions

diff --git a/desktop-themes/Menta/gtk-3.0/gtk-widgets.css b/desktop-themes/Menta/gtk-3.0/gtk-widgets.css
index 032d433a..b293e540 100644
--- a/desktop-themes/Menta/gtk-3.0/gtk-widgets.css
+++ b/desktop-themes/Menta/gtk-3.0/gtk-widgets.css
@@ -965,6 +965,7 @@ GtkComboBox.combobox-entry .button {
 }
 
 .button {
+	transition: all 200ms ease-out;
 	-GtkButton-image-spacing: 4;
 	-GtkButton-interior-focus: true;
 	-GtkButton-default-border: 0;
@@ -2043,6 +2044,7 @@ GtkTreeMenu .menuitem,
 }
 
 .menubar .menuitem {
+	transition: all 200ms ease-out;
 	border-style: none;
 	padding: 4px 6px;
 	text-shadow: 0 1px @button_text_shadow;
@@ -2060,6 +2062,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 f5d96fd9..91d14570 100644
--- a/desktop-themes/Menta/gtk-3.0/mate-applications.css
+++ b/desktop-themes/Menta/gtk-3.0/mate-applications.css
@@ -227,6 +227,7 @@ MatePanelApplet *:hover {
 /* desktop-applet, clockapplet, drivemount, character-map,
 dictionary */
 MatePanelApplet .button {
+	transition: all 300ms ease-out;
 	background-image: none;
 	background-color: @theme_bg_color;
 	color: @theme_text_color;
@@ -241,12 +242,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;
@@ -256,12 +257,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;
@@ -272,6 +273,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));
@@ -288,12 +290,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;
@@ -303,12 +305,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;
@@ -319,6 +321,7 @@ WnckTasklist .button:hover {
 
 /* 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));
@@ -333,6 +336,7 @@ PanelMenuBar.menubar .menuitem:hover {
 /* 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),