Navbarchanges

[MatthewBorda]

Added navbar dropdown for Find a Poem

[MatthewBorda]

Here is a rough outline of the embedded dropdowns. I will work to clean them up

[branchaw]

Great to have so many search options in the drop downs!

[MikeGalli]

I admit it is hard to do a layout for the nav bar before the wireframe has been approved. When I looked at the view generated by the code, I saw some things that could be improved. I think:
The nav bar is too tall.
The sign in is too close to the right side.
The line under Home ends randomly.

[lukegreen]

Maybe tweek the CSS on this so that the content in the jumbotron clears the navbar. I think if you put the navbar elements in a div with the following attributes, then it should at least put them inline with the page title element and shave a row off the top of the header: <div class="collapse navbar-collapse" id="js-navbar-collapse">

[lukegreen]

Here's a more detailed template to clarify my previous comment:

<div class="header">
      <div class="navbar navbar-default" role="navigation">
        <div class="container">
          <div class="navbar-header">

            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#js-navbar-collapse">
              <span class="sr-only">Toggle navigation</span>
              <span class="icon-bar"></span>
              <span class="icon-bar"></span>
              <span class="icon-bar"></span>
            </button>

            <a class="navbar-brand" href="#/">RoverTrak: Development</a>
          </div><div class="collapse navbar-collapse" id="js-navbar-collapse">

            <ul class="nav navbar-nav">
              <li class="active"><a href="#/">Home</a></li>
              <li><a href="">About</a></li>
              <li><a href="">Find a Poem</a></li>
              <li><a href="">Find a Drink</a></li>
            </ul>
          </div>
        </div>
      </div>
    </div>

This should also give you a hamburger menu on small (mobile) screen sizes.

[branchaw]

I think the overlap issues might be avoided by locating the drop downs inline with the nav bar and below header image as shown in the mockup suggested in Pull Request #12

for eg:

[branchaw]

Suggest moving tabs to be inline with main nav bar rather than above. Also incorporate header image put forward in pull request #12

[MatthewBorda]

This should be all replaced with something less hardcoded. I would recommend a plugin such as this one: http://mmenu.frebsite.nl/. We had discussed making this menus and submenus contain dynamic content that is based off of either counts from the API we used or popularity of the site users. This plugin contains the ability to dynamically add menu options and has a mobile first format to it. Overall, I think this code is too clunky to be maintained. This should be used only as a proof of concept.

[MatthewBorda]

I'd recommend scrapping this request. Merge the other page pull request and redo the navbar with a plugin only after an API and backend data structure are finalized. Then we could create the dynamic navbar that fits with the structure of the page.