Update logo. Update Header and Footer to use new style from bazel-website.

Refactor CSS structure to only contain shared and docs CSS

RELNOTES: None
PiperOrigin-RevId: 159837919

4 files changed, 45 insertions, 17 deletions

diff --git a/site/_includes/footer-content.html b/site/_includes/footer-content.html
new file mode 100644
index 0000000000..1801c37616
--- /dev/null
+++ b/site/_includes/footer-content.html
@@ -0,0 +1,37 @@
+<div class="container">
+  <div class="row">
+    <div class="col-md-4">
+      <p>About</p>
+      <ul class="list-unstyled">
+        <li><a href="https://github.com/bazelbuild/bazel/wiki/Bazel-Users">Who's using Bazel</a></li>
+        <li><a href="{{ site.main_site_url }}/roadmap.html">Roadmap</a></li>
+        <li><a href="{{ site.main_site_url }}/contributing.html">Contribute</a></li>
+        <li><a href="{{ site.main_site_url }}/governance.html">Governance Plan</a></li>
+      </ul>
+    </div>
+    <div class="col-md-4">
+      <p>Support</p>
+      <ul class="list-unstyled">
+        <li><a href="http://stackoverflow.com/questions/tagged/bazel">Stack Overflow</a></li>
+        <li><a href="https://github.com/bazelbuild/bazel/issues">Issue Tracker</a></li>
+        <li><a href="https://docs.bazel.build">Documentation</a></li>
+        <li><a href="{{ site.main_site_url }}/faq.html">FAQ</a></li>
+        <li><a href="{{ site.main_site_url }}/support.html">Support Policy</a></li>
+      </ul>
+    </div>
+    <div class="col-md-4">
+      <p>Stay Connected</p>
+      <ul class="list-unstyled">
+        <li><a href="https://twitter.com/bazelbuild">Twitter</a></li>
+        <li><a href="https://blog.bazel.build">Blog</a></li>
+        <li><a href="https://github.com/bazelbuild/bazel">GitHub</a></li>
+        <li><a href="https://groups.google.com/forum/#!forum/bazel-discuss">Discussion group</a></li>
+      </ul>
+    </div>
+  </div>
+  <div class="row">
+    <div class="col-lg-12">
+      <p class="text-muted">&copy; {{ 'now' | date: "%Y" }} Google</p>
+    </div>
+  </div>
+</div>
diff --git a/site/_includes/footer.html b/site/_includes/footer.html
index e3c36cf821..915f99aa5d 100644
--- a/site/_includes/footer.html
+++ b/site/_includes/footer.html
@@ -1,11 +1,5 @@
     <footer class="footer">
-      <div class="container">
-        <div class="row">
-          <div class="col-lg-12">
-            <p class="text-muted">&copy; {{ 'now' | date: "%Y" }} Google</p>
-          </div>
-        </div>
-      </div>
+      {% include footer-content.html %}
     </footer>
 
     <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
diff --git a/site/_includes/head.html b/site/_includes/head.html
index 5dfdb9f5ab..3eda1bd0f9 100644
--- a/site/_includes/head.html
+++ b/site/_includes/head.html
@@ -40,7 +40,8 @@
     <!-- Webfont -->
     <link href="//fonts.googleapis.com/css?family=RobotoDraft:300,400,500|Source+Code+Pro:400,500,700" rel="stylesheet">
 
-    <link rel="shortcut icon" type="image/png" href="/images/favicon.ico">
+    <link rel="icon" type="image/png" href="/images/favicon-32x32.png" sizes="32x32" />
+    <link rel="icon" type="image/png" href="/images/favicon-16x16.png" sizes="16x16" />
 
     <!-- Bootstrap -->
     <link href="/assets/css/bootstrap.min.css" rel="stylesheet">
diff --git a/site/_includes/header.html b/site/_includes/header.html
index 55cd13d087..88622107ad 100644
--- a/site/_includes/header.html
+++ b/site/_includes/header.html
@@ -8,8 +8,8 @@
             <span class="icon-bar"></span>
             <span class="icon-bar"></span>
           </button>
-          <a class="navbar-brand" href="{{ site.main_site_url }}">
-            <img src="/images/bazel-navbar.png" height="30px">
+          <a class="navbar-brand" href="{{ site.main_site_url }}/">
+            <img class="navbar-logo" src="/images/bazel-navbar.svg">
           </a>
         </div>
 
@@ -28,21 +28,17 @@
           </form>
           <ul class="nav navbar-nav navbar-right">
             <li{% if page.nav == "docs" %} class="active"{% endif %}>
-              <a href="/">Docs</a>
+              <a href="{{ site.docs_site_url }}">Documentation</a>
             </li>
             <li{% if page.nav == "contribute" %} class="active"{% endif %}>
-              <a href="{{ site.main_site_url }}/contributing.html">Contribute!</a>
+              <a href="{{ site.main_site_url }}/contributing.html">Contribute</a>
             </li>
-            <li{% if page.nav == "faq" %} class="active"{% endif %}>
-              <a href="{{ site.main_site_url }}/faq.html">FAQ</a></li>
             <li{% if page.nav == "blog" %} class="active"{% endif %}>
               <a href="{{ site.blog_site_url }}">Blog</a>
             </li>
-            <li><a href="http://stackoverflow.com/questions/tagged/bazel" class="nav-icon"><i class="fa fa-stack-overflow"></i></a></li>
-            <li><a href="https://groups.google.com/forum/#!forum/bazel-discuss" class="nav-icon"><i class="fa fa-envelope"></i></a></li>
             <li><a href="https://twitter.com/bazelbuild" class="nav-icon"><i class="fa fa-twitter"></i></a></li>
+            <li><a href="http://stackoverflow.com/questions/tagged/bazel" class="nav-icon"><i class="fa fa-stack-overflow"></i></a></li>
           </ul>
         </div><!-- /.navbar-collapse -->
       </div><!-- /.container-fluid -->
     </nav>
-