Related to #1465 - fixed some secondary nav styling issues

MozillaFoundation · May 4, 2018 · 669edd5 · 669edd5
1 parent ec7e143
commit 669edd5
Show file tree

Hide file tree

Showing 7 changed files with 16 additions and 21 deletions.
diff --git a/network-api/networkapi/fellows/templates/fellows_home.html b/network-api/networkapi/fellows/templates/fellows_home.html
@@ -24,7 +24,6 @@ <h1 class="h1-heading">Mozilla Fellowships</h1>
 {% block mainContent %}
 <div class="row mb-5">
   <div class="col-12 mt-2 mb-5">
-    <hr class="hr-gradient mt-0">
     <h2 class="h2-heading">What are Mozilla Fellowships?</h2>
   </div>
   <div class="col-12 mb-4">

diff --git a/network-api/networkapi/templates/pages/fellowships.html b/network-api/networkapi/templates/pages/fellowships.html
@@ -14,14 +14,17 @@
 <div id="fellowships-nav" class="hidden-sm-down my-4">
   <div class="container">
     <div class="row">
-      <div class="col">
+      <div class="col-12">
         <div id="multipage-nav" class="d-flex flex-row align-items-center">
           <div><a href="{% url 'fellowships-home' %}" class="{% fellowship_active_nav request 'fellowships-home fellowships-type' %}">Fellowships</a></div>
           <div><a href="{% url 'fellowships-directory' %}" class="{% fellowship_active_nav request 'fellowships-directory fellowships-directory-archive' %}">Directory</a></div>
           <div><a href="{% url 'fellowships-support' %}" class="{% fellowship_active_nav request 'fellowships-support' %}">Support the Program</a></div>
           <div><a href="{% url 'fellowships-apply' %}" class="{% fellowship_active_nav request 'fellowships-apply' %}">Apply to be a Fellow</a></div>
         </div>
       </div>
+      <div class="col-12">
+        <hr class="hr-gradient mb-0">
+      </div>
     </div>
   </div>
 </div>

diff --git a/network-api/networkapi/wagtailpages/templates/wagtailpages/primary_page.html b/network-api/networkapi/wagtailpages/templates/wagtailpages/primary_page.html
@@ -23,8 +23,10 @@ <h1 class="h1-heading pb-5">{% if root.title %}{{ root.title }}{% elif page.head
       {% primary_page_menu page %}
     </div>
     {% if singleton_page == False %}
-    <div class="pt-3">
-      <hr class="hr-gradient mt-0">
+    <div class="row mb-4">
+      <div class="col">
+        <hr class="hr-gradient mb-0">
+      </div>
     </div>
     {% endif %}
   </div>

diff --git a/network-api/networkapi/wagtailpages/templates/wagtailpages/tags/mini_site_sidebar.html b/network-api/networkapi/wagtailpages/templates/wagtailpages/tags/mini_site_sidebar.html
@@ -2,7 +2,7 @@
 
 {% if menu_pages %}
 <div class="py-5 col-md-3 mb-3 hidden-sm-down">
-  <div class="multipage-nav" id="multipage-nav">
+  <div class="multipage-nav side-nav" id="multipage-nav">
     {% for entry in menu_pages %}
     <div>
       <a class="multipage-link {% if current.title == entry.page.title %}multipage-link-active{% endif %}" href="{% pageurl entry.page %}">{% if entry.depth == 2 %}→ {% endif %}{{ entry.menu_title }}

diff --git a/source/sass/type.scss b/source/sass/type.scss
@@ -50,7 +50,7 @@ a {
   line-height: 1.5;
 }
 
-@mixin yellow-underline-nav-link($active-class-name) {
+@mixin secondary-nav-link($active-class-name) {
   font-family: "Nunito Sans";
   color: $black;
 
@@ -200,6 +200,9 @@ p,
 }
 
 .multipage-link {
-  @include yellow-underline-nav-link(".multipage-link-active");
-  @include scaleText(18px, 27px, 20px, 30px);
+  @include secondary-nav-link(".multipage-link-active");
+
+  @at-root .side-nav #{&} {
+    @include scaleText(17px, 17px*1.6);
+  }
 }
diff --git a/source/sass/views/fellowships/shared.scss b/source/sass/views/fellowships/shared.scss
@@ -1,6 +1,6 @@
 #fellowships-nav {
   a {
-    @include yellow-underline-nav-link(".active");
+    @include secondary-nav-link(".active");
   }
 }
 

diff --git a/source/sass/wagtail.scss b/source/sass/wagtail.scss
@@ -71,18 +71,6 @@
   }
 }
 
-.primary-menu {
-  a.multipage-link {
-    &.multipage-link-active {
-      box-shadow: 0 2px black;
-    }
-
-    &:hover {
-      box-shadow: 0 2px black;
-    }
-  }
-}
-
 .homepage-feature p {
   font-size: inherit;
   line-height: inherit;