Sha256: a5fbe8a226e09cddca666ffbc12184c6d44b6ddea33af869a3d5224d561f4893

Contents?: true

Size: 1.91 KB

Versions: 1

Compression:

Stored size: 1.91 KB

Contents

<header class="navigation">
  <div class="menu-wrapper">
    <a href="javascript:void(0)" class="logo">
      <img src="https://raw.github.com/Magnus-G/Random/master/placeholder_logo_1.png" alt="">
    </a>
    <p class="navigation-menu-button" id="js-mobile-menu">MENU</p>
    <div class="nav">
      <ul id="navigation-menu">
        <li class="nav-link"><a href="javascript:void(0)">Products</a></li>
        <li class="nav-link"><a href="javascript:void(0)">About Us</a></li>
        <li class="nav-link"><a href="javascript:void(0)">Contact</a></li>
        <li class="nav-link more"><a href="javascript:void(0)">More</a>
          <ul class="submenu">
            <li><a href="javascript:void(0)">Submenu Item</a></li>
            <li><a href="javascript:void(0)">Another Item</a></li>
          </ul>
        </li>
        
      </ul>
    </div>
    <div class="navigation-tools">
      <div class="search-bar">
        <div class="search-and-submit">
          <input type="search" placeholder="Enter Search" />
          <button type="submit">
            <img src="https://raw.githubusercontent.com/Magnus-G/Random/master/search-icon.png" alt="">
          </button>
        </div>
      </div>
      <a href="javascript:void(0)" class="sign-up">Sign Up</a>
    </div>
  </div>
</header>

<script>
  $(function() {
    var menu = $('#navigation-menu');
    var menuToggle = $('#js-mobile-menu');
    var signUp = $('.sign-up');

    $(menuToggle).on('click', function(e) {
      e.preventDefault();
      menu.slideToggle(function(){
        if(menu.is(':hidden')) {
          menu.removeAttr('style');
        }
      });
    });

    // underline under the active nav item
    $(".nav .nav-link").click(function() {
      $(".nav .nav-link").each(function() {
        $(this).removeClass("active-nav-item");
      });
      $(this).addClass("active-nav-item"); 
      $(".nav .more").removeClass("active-nav-item");
    });
  });
</script>

Version data entries

1 entries across 1 versions & 1 rubygems

Version Path
refills-0.0.2 source/_navigation.html.erb