MozReview: Update header and navigation styles (Bug 1056377). r?smacleod draft
authorDavid Walsh <dwalsh@mozilla.com>
Thu, 23 Jun 2016 16:22:29 -0500
changeset 8601 19751ae5bfc8644d72014e4596649459f7b06873
parent 8600 a1703830bce1c18a718cccd431e419b7d10faa53
child 8602 96ce3e3502188fb960f7eae4d23a0d860ef6e2e3
push id943
push userbmo:dwalsh@mozilla.com
push dateFri, 24 Jun 2016 17:39:03 +0000
reviewerssmacleod
bugs1056377
MozReview: Update header and navigation styles (Bug 1056377). r?smacleod MozReview-Commit-ID: BSGxojqwIOb
pylib/mozreview/mozreview/static/mozreview/css/common.less
pylib/mozreview/mozreview/static/mozreview/js/default.js
--- a/pylib/mozreview/mozreview/static/mozreview/css/common.less
+++ b/pylib/mozreview/mozreview/static/mozreview/css/common.less
@@ -18,8 +18,121 @@
   border-radius: @arguments;
 }
 
 body {
   background: @moz-blue-light;
   font-size: 13px;
   padding-top: 8px;
 }
+
+/* Logo and Title */
+#headerbar {
+  height: 18px;
+
+  #title a {
+    font-weight: bold;
+    font-size: 100%;
+  }
+
+  #rbinfo > a {
+      display: block;
+      width: 60px;
+      height: 60px;
+      background: url("../logo.svg") 3px -6px no-repeat;
+      background-size: cover;
+      position: absolute;
+      top: 0;
+      left: 8px;
+      z-index: 50;
+
+      img {
+          display: none;
+      }
+  }
+}
+
+@media screen and (max-width: 720px), screen and (max-device-width: 720px) and (orientation: landscape) {
+  #headerbar {
+    #rbinfo a {
+      display: none;
+    }
+
+    #nav_toggle {
+      top: -10px;
+    }
+
+    #search {
+      position: absolute;
+      top: -10px;
+      right: 0;
+      left: 60px;
+    }
+  }
+
+  #navbar-container {
+    display: none;
+  }
+
+  #headerbar, .reviewable-page #headerbar {
+    border-bottom-color: @moz-blue-dark;
+  }
+}
+
+/* Account Navigation */
+#accountnav li {
+  /* background colors on hover; set twice for reviewable-page :( */
+  &:hover,
+  &:hover > a,
+  ul,
+  ul:hover,
+  .reviewable-page &:hover,
+  .reviewable-page & ul {
+    background: #fff;
+    border-color: #fff;
+  }
+
+  ul {
+    .border-radius(0);
+    min-width: 150px;
+    border-color: @moz-blue-dark;
+  }
+
+  &:hover ul,
+  .reviewable-page &:hover ul {
+    margin-top: -1px;
+    border-color:@moz-blue-light;
+  }
+
+  .reviewable-page &:hover ul li:hover a,
+  &:hover ul li:hover a {
+    background: @moz-blue-dark;
+  }
+}
+
+/* Main Navigation */
+#navbar {
+  border-bottom: 0;
+}
+
+#navbar-container {
+  padding-bottom: 10px;
+}
+
+#topbar,
+#navbar-container,
+.reviewable-page #topbar,
+.reviewable-page #navbar-container {
+  background: inherit !important;
+}
+
+.reviewable-page #navbar-container,
+#navbar-container {
+  border-bottom: 1px solid @moz-blue-dark;
+}
+
+/* Search Bar */
+#headerbar #search input,
+.reviewable-page #headerbar #search input {
+  .border-radius(0);
+  padding: 3px 6px;
+  border-color: #bbb;
+}
--- a/pylib/mozreview/mozreview/static/mozreview/js/default.js
+++ b/pylib/mozreview/mozreview/static/mozreview/js/default.js
@@ -3,9 +3,12 @@
   $('#navbar a[href="/r/new/"]').parent('li').remove();
 
   // Fix logout url
   $("a[href='/account/logout/']").attr("href", "/mozreview/logout/");
   $("#accountnav li").css("visibility", "visible");
 
   // Hide "Close Discarded" and "Close Submitted" in request listings
   $('#page_sidebar').find('a.discard, a.submit').remove();
+
+  // Update heading title for branding
+  $('#headerbar #title a').text('Review Board @ Mozilla');
 });