Add fixes to scrolling nav

matthewblewitt · May 2, 2014 · 8b54d17 · 8b54d17
1 parent 3ee675d
commit 8b54d17
Show file tree

Hide file tree

Showing 5 changed files with 86 additions and 83 deletions.
diff --git a/css/main.auto.css b/css/main.auto.css
diff --git a/css/main.css b/css/main.css
diff --git a/css/ui/_modules.scss b/css/ui/_modules.scss
@@ -104,12 +104,12 @@
         content: "+";
         line-height: 5px;
         text-align: center;
-        margin-top:-7px;
+        margin-top:-4px;
         top:50%;
         right:10px;
-        width:14px;
-        height:14px;
-        z-index: 10;
+        width:8px;
+        height:8px;
+        z-index: 1;
     } 
 }
 
@@ -126,81 +126,84 @@
 /* Tabs */
 
 .tabs {
-  
-  border: 1px solid $ui-color;
-  margin-bottom: $base-margin;
-  
-  > .tabs__content {
-    display: none;
-    padding: 1em;
-    position: relative;
-    border-top: 1px solid $ui-color;
-  }
-  > .active {
-    display: block;
-  }
+
+    border: 1px solid $ui-color;
+    margin-bottom: $base-margin;
+
+    > .tabs__content {
+        display: none;
+        padding: 1em;
+        position: relative;
+        border-top: 1px solid $ui-color;
+    }
+    > .active {
+        display: block;
+    }
 }
 
 .tabs__nav {
-  ul {
-    list-style: none;
-    padding: 0;
-    margin: 0;
-  }
-  li {
-    display: inline-block;
-    padding: 0;
-    border-right: 1px solid $ui-color;
-    border-bottom: 0;
-
-  }
-  a {
-    display:block;
-    text-decoration: none;
-    padding: .5em;
-    &.active {
-      position: relative;
-    }
-  }
-  @media (max-width: 700px) {
     ul {
-      border-bottom: 0;
-      overflow: hidden;
-      position: relative;
-      background: #fff; /* fallback */
-
-      &::after {
-        content: "☰";
-        position: absolute;
-        top: 5px;
-        right: 10px;
-        z-index: 2;
-        pointer-events: none;
-      }
-      &.open {
-        a {
-          position: relative;
-          display: block;
-        }
-      }
+        list-style: none;
+        padding: 0;
+        margin: 0;
     }
     li {
-      display: block;
-      border: 0;
+        display: inline-block;
+        padding: 0;
+        border-right: 1px solid $ui-color;
+        border-bottom: 0;
+        margin-right: -3px; //inline-block spacing
     }
     a {
-      position: absolute;
-      top: 0;
-      left: 0;
-      width: 100%;
-      height: 100%;
-      &.active {
-        border: 0;
-        z-index: 1;
-        background: #fff;
-      }
+        display:block;
+        text-decoration: none;
+        padding: .5em;
+        &.active {
+            position: relative;
+            background: $ui-color-light;
+        }
+    }
+    @media (max-width: 700px) {
+        ul {
+            border-bottom: 0;
+            overflow: hidden;
+            position: relative;
+            background: #fff; /* fallback */
+
+            &::after {
+                content: "☰";
+                position: absolute;
+                top: 5px;
+                right: 10px;
+                z-index: 2;
+                pointer-events: none;
+            }
+            &.open {
+                a {
+                    position: relative;
+                    display: block;
+                }
+            }
+        }
+
+        li {
+            display: block;
+            border: 0;
+        }
+
+        a {
+            position: absolute;
+            top: 0;
+            left: 0;
+            width: 100%;
+            height: 100%;
+            &.active {
+                border: 0;
+                z-index: 1;
+                background: #fff;
+            }
+        }
     }
-  }
 }
 
 

diff --git a/index.html b/index.html
@@ -576,31 +576,31 @@ <h2><a name="hcard" class="anchor" href="#hcard"><span class="octicon octicon-li
             <div class="html-snippet">
                 <p class="vcard">
 
-                    <a class="fn org" href="http://www.w3.org/Consortium/contact-keio" title="Contact Information for W3C/Keio">
-                        <span class="organization-name">University of Leeds</span>
-
-                    </a>
+                    <span class="fn org organization-name" title="Contact Information for University of Leeds">University of Leeds
+                    </span><br>
 
                     <span class="adr">
 
-                        <a class="extended-address" href="http://www.keio.ac.jp/english/about_keio/campus_info/sfc1.html">University of Leeds</a>
+                        <span class="extended-address">Room 101, EC Stoner Building</span><br>
 
                         <span class="street-address">Street Name</span>, 
 
-                        <span class="locality">Leeds</span>,
+                        <span class="locality">Leeds</span>,<br>
 
-                        <span class="region">West Yorkshire</span> 
-                        <span class="postal-code">LS2 9JT</span> 
+                        <span class="region">West Yorkshire,</span>
+                        <span class="postal-code">LS2 9JT,</span>
 
-                        <b class="country">UK</b>
+                        <span class="country">UK</span><br>
 
                         <span class="tel">Telephone: 
-                            <span class="value">+44 (0) 113 243 1751</span>
+                            <span class="value">+44 (0) 113 243 1751</span><br>
                         </span>
+
                         <span class="tel">
                             <span class="type">Fax</span>: 
                             <span class="value">+44 (0) 113 244 3923</span>
                         </span>
+
                     </span>
                 </p>
             </div>

diff --git a/js/scripts.js b/js/scripts.js
@@ -184,7 +184,7 @@ Tabs.init();
 
 //Smooth scroll effect
 $(function() {
-    $('#main_navigation a[href*=#]:not([href=#])').bind("click", function() {
+    $('.slicknav_nav a[href*=#]:not([href=#])').bind("click", function() {
         var offsetTop = 0;
         $('.active-pattern').removeClass('active-pattern');
         var thisLink = $(this).attr("href");