Merge branch '170-zurich-site-nav' into zurich

4 files changed, 73 insertions, 10 deletions

diff --git a/templates/web/zurich/footer.html b/templates/web/zurich/footer.html
index 6b8ad004d..a570a66a3 100644
--- a/templates/web/zurich/footer.html
+++ b/templates/web/zurich/footer.html
@@ -4,16 +4,25 @@
 
         <div class="nav-wrapper">
             <div class="nav-wrapper-2">
-              <div class="nav-wrapper-3">
-                <div id="main-nav" role="navigation">
-                  [% IF c.user_exists %]
-                    <p>
-                        [% tprintf(loc('Hi %s'), c.user.name || c.user.email) %]
+                <div class="nav-wrapper-3">
+                    <div id="main-nav" role="navigation">
+                      [% IF c.user_exists %]
+                        <p>
+                            [% tprintf(loc('Hi %s'), c.user.name || c.user.email) %]
                         </p><p><a href="/auth/sign_out">[% loc('sign out') %]</a>
-                    </p>
-                  [% END %]
+                        </p>
+                      [% ELSE %]
+                        <ul id="main-menu" class="mob-only">
+                            <li><[% IF c.req.uri.path == '/' %]span[% ELSE %]a href="/"[% END %]
+                            >[% loc("Report a problem") %]</[% c.req.uri.path == '/' ? 'span' : 'a' %]></li>[%
+                            %]<li><[% IF c.req.uri.path == '/reports' %]span[% ELSE %]a href="/reports"[% END
+                            %]>[% loc("All reports") %]</[% c.req.uri.path == '/reports' ? 'span' : 'a' %]></li>[%
+                            %]<li><[% IF c.req.uri.path == '/faq' %]span[% ELSE %]a href="/faq"[% END
+                            %]>[% loc("Help") %]</[% c.req.uri.path == '/faq' ? 'span' : 'a' %]></li>
+                        </ul>
+                      [% END %]
+                    </div>
                 </div>
-              </div>
             </div>
         </div>
 
diff --git a/templates/web/zurich/header.html b/templates/web/zurich/header.html
index 75698993f..77dd3cd63 100644
--- a/templates/web/zurich/header.html
+++ b/templates/web/zurich/header.html
@@ -43,8 +43,6 @@
                 </div>
             </header>
 
-            [% pre_container_extra %]
-
             <div class="container">
 
 [% IF admin %]
@@ -82,5 +80,8 @@
 [% END %]
 
                 <div class="content[% " $mainclass" | html IF mainclass %]" role="main">
+                [% INCLUDE 'nav_over_content.html' %]
+
+                [% pre_container_extra %]
 
         <!-- [% INCLUDE 'debug_header.html' %] -->
diff --git a/templates/web/zurich/nav_over_content.html b/templates/web/zurich/nav_over_content.html
new file mode 100644
index 000000000..4dbe87652
--- /dev/null
+++ b/templates/web/zurich/nav_over_content.html
@@ -0,0 +1,10 @@
+         <div id="zurich-main-nav" class="desk-only">
+            <ul>
+                <li><[% IF c.req.uri.path == '/around' || c.req.uri.path == '/' %]span[% ELSE %]a href="/"[% END %]
+                    >[% loc("Report a problem") %]</[% c.req.uri.path == '/around' ? 'span' : 'a' %]></li>[%
+                %]<li><[% IF c.req.uri.path == '/reports' %]span[% ELSE %]a href="/reports"[% END
+                    %]>[% loc("All reports") %]</[% c.req.uri.path == '/reports' ? 'span' : 'a' %]></li>[%
+                %]<li><[% IF c.req.uri.path == '/faq' %]span[% ELSE %]a href="/faq"[% END
+                    %]>[% loc("Help") %]</[% c.req.uri.path == '/faq' ? 'span' : 'a' %]></li>
+            </ul>
+         </div>
diff --git a/web/cobrands/zurich/layout.scss b/web/cobrands/zurich/layout.scss
index f9147820b..189957f5d 100644
--- a/web/cobrands/zurich/layout.scss
+++ b/web/cobrands/zurich/layout.scss
@@ -87,6 +87,11 @@ body.mappage {
     }
 }
 
+#front-main {
+  background-color: inherit;
+  color: inherit;
+}
+
 /* TODO Change the main-nav to be what is wanted */
 #main-nav {
     ul#main-menu {
@@ -101,6 +106,41 @@ body.mappage {
     }
 }
 
+#zurich-main-nav {
+  margin: -1em -1em 1em -1em; // -1em spreads back out over content's 1em padding
+  padding: 0;
+  background-color: #6A6869;
+
+  ul {
+      overflow:auto;
+      margin:0 0 0 0;
+      list-style: none;
+      padding: 0;
+      li {
+          font-size: 80%;
+          float:left;
+          list-style: none;
+          margin:0;
+          font-weight: bold;
+          color: #fff;
+          a, span {
+            display: block;
+            padding: 0.75em 1em;
+          }
+          a {
+              color: #fff;
+              text-decoration: none;
+              &:hover {
+                background-color: #333;
+              }
+          }
+          span {
+            background-color: #0056A4;
+          }
+      }
+  }
+}
+
 body.mappage {
     #main-nav ul#main-menu li a,
     #main-nav ul#main-menu li span {
@@ -116,6 +156,9 @@ body.twothirdswidthpage {
         aside {
             @include box-shadow(none);
         }
+        .sticky-sidebar aside {
+          top: 14em; // overrides default value, due to Zurich nav at top of content
+        }
     }
 }