MozReview: Update base site colors and fonts (Bug 1056377). r?smacleod draft
authorDavid Walsh <dwalsh@mozilla.com>
Mon, 11 Jul 2016 13:00:59 -0500
changeset 8779 7480da88772eb611545649fc3afd074f4308d430
parent 8577 d3ec5d71c8e79141dc80e66b5a629243006ff4e7
child 8780 85bcf4c321ae7a3f1b3395ee7f20814ee2f5377d
push id991
push userbmo:dwalsh@mozilla.com
push dateMon, 11 Jul 2016 18:43:30 +0000
reviewerssmacleod
bugs1056377
MozReview: Update base site colors and fonts (Bug 1056377). r?smacleod MozReview-Commit-ID: 3JAddi5hTZI
pylib/mozreview/mozreview/static/mozreview/css/common.less
pylib/mozreview/mozreview/static/mozreview/js/default.js
pylib/mozreview/mozreview/static/mozreview/logo.svg
--- a/pylib/mozreview/mozreview/static/mozreview/css/common.less
+++ b/pylib/mozreview/mozreview/static/mozreview/css/common.less
@@ -1,7 +1,138 @@
 #accountnav li {
   visibility: hidden;
 }
 
 #navbar a[href="/r/new/"] {
   display: none;
 }
+
+/*
+  Mozilla skin
+*/
+@moz-blue-dark: #d4dde4;
+@moz-blue-light: #eaeff2;
+
+.border-radius(...) {
+  -moz-border-radius: @arguments;
+  -webkit-border-radius: @arguments;
+  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');
 });
new file mode 100644
--- /dev/null
+++ b/pylib/mozreview/mozreview/static/mozreview/logo.svg
@@ -0,0 +1,10 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 19.1.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1 Tiny//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11-tiny.dtd">
+<svg version="1.1" baseProfile="tiny" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
+	 x="0px" y="0px" width="72px" height="72px" viewBox="0 0 72 72" xml:space="preserve">
+<path fill="#56565A" d="M16.4,13.9c0.8,1.2,1.1,2.3,1.6,4.5c3-3,6.8-4.5,10.9-4.5c3.7,0,6.7,1.2,9.1,3.6c0.6,0.6,1.2,1.4,1.8,2.2
+	c4.1-4.2,7.7-5.8,12.6-5.8c3.5,0,6.8,1,8.8,2.8c2.5,2.2,3.3,4.8,3.3,10.9v31.7H53.1V29.9c0-5.3-0.6-6.4-3.7-6.4
+	c-2.2,0-5.2,1.5-7.8,3.8v32.1H30.6v-29c0-5.6-0.8-6.9-4.1-6.9c-2.2,0-5.1,1.1-7.7,3.4v32.5H7.5V28.2c0-6.4-0.4-9.2-1.7-11.4
+	L16.4,13.9z"/>
+</svg>