hover effect for app switcher label

1 files changed, 18 insertions, 6 deletions

diff --git a/core/css/header.css b/core/css/header.css
index 01f7dd06f09..83612c67445 100644
--- a/core/css/header.css
+++ b/core/css/header.css
@@ -74,6 +74,24 @@
 	padding-right: 10px;
 }
 
+/* hover effect for app switcher label */
+.menutoggle .header-appname,
+.menutoggle .icon-caret {
+	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
+	filter: alpha(opacity=75);
+	opacity: .75;
+}
+.menutoggle:hover .header-appname,
+.menutoggle:hover .icon-caret,
+.menutoggle:focus .header-appname
+.menutoggle:focus .icon-caret
+.menutoggle.active .header-appname
+.menutoggle.active .icon-caret {
+	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
+	filter: alpha(opacity=100);
+	opacity: 1;
+}
+
 /* show appname next to logo */
 .header-appname {
 	display: inline-block;
@@ -95,12 +113,6 @@
 	padding: 0;
 	vertical-align: middle;
 }
-.header-appname,
-#header .icon-caret {
-	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
-	filter: alpha(opacity=75);
-	opacity: .75;
-}
 /* do not show menu toggle on public share links as there is no menu */
 #body-public #header .icon-caret {
 	display: none;