changeset 48:b86cf631e753

turned menu into a fixed overlay
author Atul Varma <avarma@mozilla.com>
date Sat, 24 Apr 2010 21:10:22 -0700
parents 0b71df72ebe1
children 808687cab9c0
files css/main.css main.html
diffstat 2 files changed, 26 insertions(+), 17 deletions(-) [+]
line wrap: on
line diff
--- a/css/main.css	Sat Apr 24 20:24:54 2010 -0700
+++ b/css/main.css	Sat Apr 24 21:10:22 2010 -0700
@@ -19,26 +19,32 @@
 
 #header .menu {
     margin: 0;
+    padding: 0.5em;
+    background: rgba(0, 0, 0, 0.75);
+    position: fixed;
+    right: 0;
+    top: 0;
 }
 
 #header .menu li {
     display: inline;
-    border-right: 1px solid black;
-    padding-left: 0.25em;
-    color: gray;
+    color: white;
+}
+
+#header .menu li:last-child:after {
+    content: "";
+}
+
+#header .menu li:after {
+    content: " | ";
+}
+
+#header .menu li span {
     cursor: pointer;
 }
 
-#header .menu li:last-child {
-    border-right: none;
-}
-
-#header .menu li:hover {
-    background: yellow;
-}
-
-#header .menu {
-    float: right;
+#header .menu li span:hover {
+    text-decoration: underline;
 }
 
 #loading-screen {
--- a/main.html	Sat Apr 24 20:24:54 2010 -0700
+++ b/main.html	Sat Apr 24 21:10:22 2010 -0700
@@ -9,10 +9,13 @@
 <div id="header">
   <h1 class="title">Bugzilla Dashboard</h1>
   <ul class="menu hide-while-loading">
-    <li title="login" class="requires-no-login">Log In</span>
-    <li title="login" class="requires-login">Change User</span>
-    <li title="find-user" class="requires-auth-login">Find A User</span>
-    <li title="file-bug">File A Bug</span>
+    <li title="login"
+        class="requires-no-login"><span>Log In</span></li>
+    <li title="login"
+        class="requires-login"><span>Change User</span></li>
+    <li title="find-user"
+        class="requires-auth-login"><span>Find A User</span></li>
+    <li title="file-bug"><span>File A Bug</span></li>
   </ul>
 </div>
 <div id="loading-screen" class="loading">&nbsp;</div>