Masthead Navigation Bar

Ready

Notes
Info
HTML
View
Context

No notes defined.

Handle: @navbar-masthead
Variants (3): Springfield , West Plains , Foundation
Preview:
- With layout
- Component only
Filesystem Path: src/components/03-page-elements-and-patterns/navigation-elements/navbar-masthead/navbar-masthead.hbs
Referenced by (26): @campus-masthead, @campus-masthead--foundation-alert, @homepage-masthead, @homepage-masthead--foundation-alert, @interior-masthead, @interior-masthead--foundation-alert, @mlp-masthead, @mlp-masthead--foundation-alert, @campus-masthead, @campus-masthead--sgf-alert, @homepage-masthead, @homepage-masthead--sgf-alert, @homepage-masthead--sgf-calendar, @interior-masthead, @interior-masthead--sgf-alert, @mlp-masthead, @mlp-masthead--sgf-alert, @campus-masthead, @campus-masthead--wp-alert, @homepage-masthead, @homepage-masthead--wp-alert, @homepage-masthead--wp-calendar, @interior-masthead, @interior-masthead--wp-alert, @mlp-masthead, @mlp-masthead--wp-alert


        
        <nav class='Masthead Navbar' aria-label='Top menu'>
    <div id='MastheadControls'>
        <div class='BearPass'>
            <div class='BearPassLogin'>
                <input type='checkbox' id='bearpass-toggle' />
                <label for='bearpass-toggle' data-toggle='dropdown' class='keyicon'>
                    <div class='BPlogin'>Log in</div><img src='../../images/sgf-logo.svg' alt='Key' />
                </label>
                <div class='SearchContainer'>
                    <div id='BearPassMenu'>
                        <ul class='bearpassmenu'>
                            <li>
                                <a href='https://my.missouristate.edu/' aria-label='My Missouri State'>My Missouri State</a>
                            </li>
                            <li>
                                <a href='https://blackboard.missouristate.edu/webapps/login/' aria-label='Office 365 and Email'>Office 365 and Email</a>
                            </li>
                            <li>
                                <a href='https://brightspace.missouristate.edu/' aria-label='Brightspace'>Brightspace</a>
                            </li>
                            <li>
                                <a href='https://organizations.missouristate.edu/login' aria-label='BearLink'>BearLink</a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
        <div class='SiteIndex'>
            <div class='SiteIndexDropDown'>
                <input type='checkbox' id='siteindex-toggle' value='' name='siteindex-checkbox' />
                <label for='siteindex-toggle' data-toggle='dropdown'>A-Z</label>
                <div class='SearchContainer' aria-label='Site Index'>
                    <div id='SiteIndexMenu'>
                        <ul>
                            <li>
                                <a href='https://search.MissouriState.edu/siteindex/a' aria-label='a'>a</a>
                            </li>
                            <li>
                                <a href='https://search.MissouriState.edu/siteindex/b' aria-label='b'>b</a>
                            </li>
                            <li>
                                <a href='https://search.MissouriState.edu/siteindex/c' aria-label='c'>c</a>
                            </li>
                            <li>
                                <a href='https://search.MissouriState.edu/siteindex/d' aria-label='d'>d</a>
                            </li>
                            <li>
                                <a href='https://search.MissouriState.edu/siteindex/e' aria-label='e'>e</a>
                            </li>
                            <li>
                                <a href='https://search.MissouriState.edu/siteindex/f' aria-label='f'>f</a>
                            </li>
                            <li>
                                <a href='https://search.MissouriState.edu/siteindex/g' aria-label='g'>g</a>
                            </li>
                            <li>
                                <a href='https://search.MissouriState.edu/siteindex/h' aria-label='h'>h</a>
                            </li>
                            <li>
                                <a href='https://search.MissouriState.edu/siteindex/i' aria-label='i'>i</a>
                            </li>
                            <li>
                                <a href='https://search.MissouriState.edu/siteindex/j' aria-label='j'>j</a>
                            </li>
                            <li>
                                <a href='https://search.MissouriState.edu/siteindex/k' aria-label='k'>k</a>
                            </li>
                            <li>
                                <a href='https://search.MissouriState.edu/siteindex/l' aria-label='l'>l</a>
                            </li>
                            <li>
                                <a href='https://search.MissouriState.edu/siteindex/m' aria-label='m'>m</a>
                            </li>
                            <li>
                                <a href='https://search.MissouriState.edu/siteindex/n' aria-label='n'>n</a>
                            </li>
                            <li>
                                <a href='https://search.MissouriState.edu/siteindex/o' aria-label='o'>o</a>
                            </li>
                            <li>
                                <a href='https://search.MissouriState.edu/siteindex/p' aria-label='p'>p</a>
                            </li>
                            <li>
                                <a href='https://search.MissouriState.edu/siteindex/q' aria-label='q'>q</a>
                            </li>
                            <li>
                                <a href='https://search.MissouriState.edu/siteindex/r' aria-label='r'>r</a>
                            </li>
                            <li>
                                <a href='https://search.MissouriState.edu/siteindex/s' aria-label='s'>s</a>
                            </li>
                            <li>
                                <a href='https://search.MissouriState.edu/siteindex/t' aria-label='t'>t</a>
                            </li>
                            <li>
                                <a href='https://search.MissouriState.edu/siteindex/u' aria-label='u'>u</a>
                            </li>
                            <li>
                                <a href='https://search.MissouriState.edu/siteindex/v' aria-label='v'>v</a>
                            </li>
                            <li>
                                <a href='https://search.MissouriState.edu/siteindex/w' aria-label='w'>w</a>
                            </li>
                            <li>
                                <a href='https://search.MissouriState.edu/siteindex/x' aria-label='x'>x</a>
                            </li>
                            <li>
                                <a href='https://search.MissouriState.edu/siteindex/y' aria-label='y'>y</a>
                            </li>
                            <li>
                                <a href='https://search.MissouriState.edu/siteindex/z' aria-label='z'>z</a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
        <div class='SearchMenuDropDown'>
            <input type='checkbox' id='searchmenu-toggle' value='' name='searchmenu-checkbox' />
            <label for='searchmenu-toggle' data-toggle='dropdown' class='magnifyicon'>
                <img src='../../images/sgf-logo.svg' alt='Magnify glass' />
            </label>
            <div class='SearchContainer' aria-label='Search'>
                <form action='' itemprop='potentialAction' itemscope itemtype='https://schema.org/SearchAction' method='get'>
                    <meta content='https://search.missouristate.edu/?q={q}' itemprop='target' />
                    <label for='KeywordsDropDown'>
                        <img src='data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7' alt='Enter keyword:' width='1' height='1' />Search
                    </label>
                    <input id='KeywordsDropDown' itemprop='query-input' name='q' placeholder='Search' type='search' />
                    <input alt='Go' cheight='1' src='data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7' type='image' width='1' />
                </form>
            </div>
        </div>
        <div class='Search'>
            <form action='' method='get' itemprop='potentialAction' itemscope itemtype='https://schema.org/SearchAction' method='get'>
                <meta content='https://search.missouristate.edu/?q={q}' itemprop='target' />
                <label for='Keywords'>
                    <img src='data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7' alt='Enter keyword:' width='1' height='1' />Search
                </label>
                <input id='Keywords' itemprop='query-input' name='q' placeholder='Search' type='search' />
                <input alt='Go' height='1' src='data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7' type='image' width='1' />
            </form>
        </div>
    </div>
</nav>


        <nav class='Masthead Navbar' aria-label='Top menu'>
  <div id='MastheadControls'>
    {{#if bearpassmenu}}
      <div class='BearPass'>
        <div class='BearPassLogin'>
          <input type='checkbox' id='bearpass-toggle' />
          <label
            for='bearpass-toggle'
            data-toggle='dropdown'
            class='keyicon'
          ><div class='BPlogin'>Log in</div><img
              src='../../images/sgf-logo.svg'
              alt='Key'
            /></label>
          <div class='SearchContainer'>
            <div id='BearPassMenu'>
              <ul class='bearpassmenu'>
                {{#each this.bearpassmenu}}
                  <li>
                    <a
                      href='{{this.url}}'
                      aria-label='{{this.label}}'
                    >{{this.label}}</a>
                  </li>
                {{/each}}
              </ul>
            </div>
          </div>
        </div>
      </div>
    {{/if}}
    {{#if siteindexmenu}}
      <div class='SiteIndex'>
        <div class='SiteIndexDropDown'>
          <input
            type='checkbox'
            id='siteindex-toggle'
            value=''
            name='siteindex-checkbox'
          />
          <label for='siteindex-toggle' data-toggle='dropdown'>A-Z</label>
          <div class='SearchContainer' aria-label='Site Index'>
            <div id='SiteIndexMenu'>
              <ul>
                {{#each this.siteindexmenu}}
                  <li>
                    <a
                      href='{{this.url}}'
                      aria-label='{{this.label}}'
                    >{{this.label}}</a>
                  </li>
                {{/each}}
              </ul>
            </div>
          </div>
        </div>
      </div>
    {{/if}}
    {{#if navmenu}}
      <div class='NavMenu'>
        {{#each this.navmenu}}
          <a
            href='{{this.url}}'
            aria-label='{{this.label}}'
            target='_self'
          >{{this.label}}</a>
        {{/each}}
      </div>
    {{/if}}
    <div class='SearchMenuDropDown'>
      <input
        type='checkbox'
        id='searchmenu-toggle'
        value=''
        name='searchmenu-checkbox'
      />
      <label for='searchmenu-toggle' data-toggle='dropdown' class='magnifyicon'>
        <img src='../../images/sgf-logo.svg' alt='Magnify glass' />
      </label>
      <div class='SearchContainer' aria-label='Search'>
        <form
          action='{{utility.search.url}}'
          itemprop='potentialAction'
          itemscope
          itemtype='https://schema.org/SearchAction'
          method='get'
        >
          <meta
            content='https://search.missouristate.edu/?q={q}'
            itemprop='target'
          />
          <label for='KeywordsDropDown'>
            <img
              src='data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7'
              alt='Enter keyword:'
              width='1'
              height='1'
            />Search
          </label>
          <input
            id='KeywordsDropDown'
            itemprop='query-input'
            name='q'
            placeholder='Search'
            type='search'
          />
          <input
            alt='Go'
            cheight='1'
            src='data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7'
            type='image'
            width='1'
          />
        </form>
      </div>
    </div>
    <div class='Search'>
      <form
        action='{{utility.search.url}}'
        method='get'
        itemprop='potentialAction'
        itemscope
        itemtype='https://schema.org/SearchAction'
        method='get'
      >
        <meta
          content='https://search.missouristate.edu/?q={q}'
          itemprop='target'
        />
        <label for='Keywords'>
          <img
            src='data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7'
            alt='Enter keyword:'
            width='1'
            height='1'
          />Search
        </label>
        <input
          id='Keywords'
          itemprop='query-input'
          name='q'
          placeholder='Search'
          type='search'
        />
        <input
          alt='Go'
          height='1'
          src='data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7'
          type='image'
          width='1'
        />
      </form>
    </div>
  </div>
</nav>


        
            
            /* No context defined. */