Pull the updated nav into the non-vue version of the site

This commit is contained in:
Kevin MacMartin 2017-12-19 16:37:34 -05:00
parent 1b2a3aa3f0
commit b3e2a398c3
4 changed files with 26 additions and 17 deletions

1
gulpfile.js vendored
View file

@ -36,6 +36,7 @@ const vuePublic = "resources/assets/js/app-vue.js";
// Javascript files for the public site
const jsPublic = [
"resources/assets/js/site-vars.js",
"resources/assets/js/nav.js",
"resources/assets/js/contact.js",
"resources/assets/js/subscription.js",
"resources/assets/js/app.js"

View file

@ -1,5 +1,7 @@
// run once the document is ready
$(document).ready(function() {
navInit();
switch (SiteVars.page) {
case "":
subscriptionFormInit();

6
resources/assets/js/nav.js vendored Normal file
View file

@ -0,0 +1,6 @@
// nav functionality
function navInit() {
$(".nav-section-component-mobile-header-toggle").on("click", function() {
$(".nav-section-component-mobile-header-toggle, .nav-section-component-links").toggleClass("open");
});
}

View file

@ -1,21 +1,21 @@
<nav class="nav-section-component navbar navbar-default navbar-fixed-top">
<div class="container-fluid">
<div class="navbar-header">
<button type="button" id="navbar-toggle" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse" aria-expanded="false" aria-controls="navbar">
<span class="sr-only">Toggle Navigation</span>
<nav class="nav-section-component">
<div class="nav-section-component-mobile-header">
<button class="nav-section-component-mobile-header-toggle">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="sr-only">Toggle navigation</span>
</button>
<a class="navbar-logo" href="/"></a>
</div>
<div id="navbar-collapse" class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li class="navlink"><a href="/" title="Home">Home</a></li>
<li class="navlink"><a href="/contact" title="Contact">Contact</a></li>
</ul>
<div class="nav-section-component-links" :class="{ open: openNav }">
<div class="nav-section-component-links-wrapper">
<a class="navlink" href="/"><span>Home</span></a>
<a class="navlink" href="/contact"><span>Contact</span></a>
</div>
</div>
<a class="nav-section-component-logo" href="/">
<img src="/img/logo.png" />
</a>
</nav>