summaryrefslogtreecommitdiffstats
path: root/core/css
diff options
context:
space:
mode:
authorRaghu Nayyar <me@iraghu.com>2013-04-17 10:20:36 -0700
committerRaghu Nayyar <me@iraghu.com>2013-04-17 10:20:36 -0700
commita3e5da834bb2a0697d5e301eb74bbbc423301913 (patch)
treea64ab0f4129b8ae188bd4d6c0813fa938471bd9a /core/css
parent3b2a0523f8544601a330bffecc1f04645d92dfc4 (diff)
parent3d47c62a204393e68594bbcc00ccafde7a99f47d (diff)
downloadnextcloud-server-a3e5da834bb2a0697d5e301eb74bbbc423301913.tar.gz
nextcloud-server-a3e5da834bb2a0697d5e301eb74bbbc423301913.zip
Merge pull request #2925 from owncloud/navigation-icon-fix
fix navigation hover effect, documentation
Diffstat (limited to 'core/css')
-rw-r--r--core/css/styles.css35
1 files changed, 29 insertions, 6 deletions
diff --git a/core/css/styles.css b/core/css/styles.css
index 15df5852477..d3aec156852 100644
--- a/core/css/styles.css
+++ b/core/css/styles.css
@@ -266,19 +266,42 @@ fieldset.warning a { color:#b94a48 !important; font-weight:bold; }
-moz-box-shadow:0 0 7px #000; -webkit-box-shadow:0 0 7px #000; box-shadow:0 0 7px #000;
overflow:hidden; box-sizing:border-box; -moz-box-sizing:border-box;
}
-#navigation:hover { overflow-y:auto; }
+#navigation:hover { overflow-y:auto; } /* show scrollbar only on hover */
#navigation a span {
display:block;
text-decoration:none; font-size:10px; text-align:center;
color:#fff; text-shadow:#000 0 -1px 0;
- -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; filter:alpha(opacity=50); opacity:.5;
white-space:nowrap; overflow:hidden; text-overflow:ellipsis; /* ellipsize long app names */
}
- #navigation a:hover, #navigation a:focus { -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=80)"; filter:alpha(opacity=80); opacity:.8; }
- #navigation a.active .icon, #navigation a.active span { -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter:alpha(opacity=100); opacity:1; }
+
+ /* icon opacity and hover effect */
+ #navigation a img,
+ #navigation a span {
+ /* 50% opacity when inactive */
+ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
+ filter: alpha(opacity=50);
+ opacity: .5;
+ }
+ #navigation a:hover img, #navigation a:focus img,
+ #navigation a:hover span, #navigation a:focus span {
+ /* 80% opacity when hovered or focused */
+ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
+ filter: alpha(opacity=80);
+ opacity: .8;
+ }
+ #navigation a.active img,
+ #navigation a.active span {
+ /* full opacity for the active app */
+ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
+ filter: alpha(opacity=100);
+ opacity: 1;
+ }
+
+ /* positioning */
#navigation .icon {
- display:block; width:32px; height:32px; margin:0 16px 0; padding:8px 0 4px;
- -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; filter:alpha(opacity=50); opacity:.5;
+ display:block;
+ width:32px; height:32px;
+ margin:0 16px 0; padding:8px 0 4px;
}
#navigation li:first-child a { padding-top:16px; }