changeset 38:1cf0cdbc18cc

better first-run experience
author Atul Varma <avarma@mozilla.com>
date Sat, 24 Apr 2010 13:55:15 -0700
parents deebff30e816
children 6f48313c4da3
files css/main.css js/main.js main.html
diffstat 3 files changed, 26 insertions(+), 1 deletions(-) [+]
line wrap: on
line diff
--- a/css/main.css	Sat Apr 24 13:33:41 2010 -0700
+++ b/css/main.css	Sat Apr 24 13:55:15 2010 -0700
@@ -69,6 +69,7 @@
 
 /* Rule to fix quirks-mode inheritance behavior */
 table, caption {
+  color: inherit;
   font-size: inherit;
   font-weight: inherit;
   font-style: inherit;
@@ -122,3 +123,17 @@
     background-repeat: no-repeat;
     background-position: top right;
 }
+
+.dialog {
+    position: absolute;
+    top: 0px;
+    left: 0px;
+}
+
+.dialog .content {
+    color: white;
+    background: rgba(0, 0, 0, 0.75);
+    padding: 2em;
+    width: 50%;
+    margin: 10em auto;
+}
--- a/js/main.js	Sat Apr 24 13:33:41 2010 -0700
+++ b/js/main.js	Sat Apr 24 13:55:15 2010 -0700
@@ -11,6 +11,7 @@
         $("#login").fadeOut();
         title = username + "'s " + BASE_TITLE;
 
+        $(".requires-no-login").hide();
         $(".requires-login").show();
         if (password) {
           $(".requires-auth-login").show();
@@ -19,6 +20,7 @@
         }
       } else {
         $("#login").fadeIn();
+        $(".requires-no-login").show();
         $(".requires-login").hide();
         $(".requires-auth-login").hide();
       }
@@ -43,5 +45,10 @@
         onLoginChange();
       });
 
+    $(".dialog").click(
+      function(event) {
+        if (event.target == this)
+          $(this).fadeOut();
+      });
     onLoginChange();
   });
--- a/main.html	Sat Apr 24 13:33:41 2010 -0700
+++ b/main.html	Sat Apr 24 13:55:15 2010 -0700
@@ -7,8 +7,9 @@
 </head>
 <body>
 <div id="header">
-  <h1 class="title"></h1>
+  <h1 class="title">Bugzilla Dashboard</h1>
   <ul class="menu">
+    <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>
@@ -17,6 +18,7 @@
 <div id="reports">
 </div>
 <div id="login" class="dialog">
+  <div class="content">
   <form id="login-form">
   <p>Enter your Bugzilla login information below.</p>
   <p>Your browser sends these credentials directly to
@@ -35,6 +37,7 @@
   <br/>
   <input type="submit" id="login-submit" value="View Dashboard"/>
   </form>
+  </div>
 </div>
 </body>
 <!-- Base Scripts -->