Skip to content
Snippets Groups Projects
  • Claas Kazzer's avatar
    refs #15282 · 771e81c5
    Claas Kazzer authored and Dorian Merz's avatar Dorian Merz committed
    * reworks header as flex containers and items
    * fixes keep-filters bug for desktop
    * turns search tools into proper buttons on SM/XS
    * fixes context/hierarchy icon display in default/result-list
    * copies solr_ai/result-list over to fid_bdi and fixes icon display there too
    * fixes result list display on XS
    * improves filter checkbox display on XS
    771e81c5
Code owners
Assign users and groups as approvers for specific file changes. Learn more.
header.phtml 4.99 KiB
<!-- fid_bbi: header -->
<?php $account = $this->auth()->getManager(); ?>
<?php /* This navbar is the sticky element in the header - CK; you can use 'affix' as an alternative to  'navbar-fixed-top' like so:
 <div data-spy="affix" data-offset-top="1" class="navbar">
 Do not use 'navbar-fixed-top' and 'affix' at the same time. When using 'affix', set the variables for
 '$navbar-height', '$navbar-height-xs' and '$navbar-height-sm' in _customVariables.scss to '=0'
 or set the paddings-top under 'body' in compiled.scss to '=0'
 */ ?>
<div class="banner container navbar navbar-fixed-top">
  <?php /* This element only holds the mobile toggler and the navbar-brand/library name - CK */ ?>
  <div class="navbar-header">
    <?php /* mobile navigation toggler - CK */ ?>
    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#header-collapse">
      <span class="sr-only">Toggle navigation</span>
      <i class="fa fa-bars" aria-hidden="true"></i>
    </button>

    <h1>
      <a class="navbar-brand lang-<?=$this->layout()->userLang?>" href="<?=$this->url('home')?>">
        <?php /* Custom finc header - CK */ ?>
          <img src="<?=$this->imageLink('headerlogo.png')?>" class="hidden-xs" alt="Logo <?=$this->transEsc("LibraryName")?>" title="<?=$this->transEsc("LibraryName")?>"> <span><?=$this->transEsc("LibraryNameShort")?></span>
        <?php /*  Custom finc header - END */ ?>
      </a>
    </h1>
  </div>

  <div class="flex-column">
  <?php if (!isset($this->layout()->renderingError)): ?>
    <div id="header-collapse" class="collapse navbar-collapse">
      <?php /* finc: right-hand navbar section - see flex-container in SCSS:
              we need this order on XS: navbar-right searchbox
              but reverse it on anything but mobile */ ?>
      <nav>
        <ul class="nav navbar-nav navbar-right flip">
          <? $cart = $this->cart();
          if ($cart->isActive()): ?>
            <li id="cartSummary">
              <a id="cartItems" class="btn" data-lightbox title="<?=$this->transEsc('View Book Bag')?>" href="<?=$this->url('cart-home')?>">
                <i class="fa fa-clipboard" aria-hidden="true"></i> <strong><?=count($cart->getItems())?></strong> <span class="cart-label"><?=$this->transEsc('items')?></span>
                <span class="hidden-sm full<?=!$cart->isFull() ? ' hidden' : ''?>">(<?=$this->transEsc('bookbag_full')?>)</span>
              </a>
            </li>
          <?php endif; ?>

          <?php if (isset($this->layout()->themeOptions) && count($this->layout()->themeOptions) > 1): ?>
            <li class="theme dropdown">
              <form method="post" name="themeForm" id="themeForm">
                <input type="hidden" name="ui"/>
              </form>
              <a href="#" class="dropdown-toggle" data-toggle="dropdown"><?=$this->transEsc("Theme")?> <strong class="caret"></strong></a>

              <ul class="dropdown-menu">
                <?php foreach ($this->layout()->themeOptions as $current): ?>
                  <li<?=$current['selected'] ? ' class="active"' : ''?>>
                    <a href="#" onClick="document.themeForm.ui.value='<?=$this->escapeHtmlAttr($current['name'])?>';document.themeForm.submit()"><?=$this->transEsc($current['desc'])?></a>
                  </li>
                <?php endforeach; ?>
              </ul>
            </li>
          <?php endif; ?>

          <?php if (isset($this->layout()->allLangs) && count($this->layout()->allLangs) > 1): ?>
            <li class="language dropdown">
              <form method="post" name="langForm" id="langForm">
                <input type="hidden" name="mylang"/>
              </form>
              <span id="langmenu">
                <? /* Hide active language and show only second choice,
                      add language code in css for BG image - CK */ ?>
                <?php foreach ($this->layout()->allLangs as $langCode => $langName): ?>
                  <span<?=$this->layout()->userLang == $langCode ? ' class="hidden"' : ''?>>
                    <a class="btn <?=$langCode?>" href="#" onClick="document.langForm.mylang.value='<?=$langCode?>';document.langForm.submit()"><?=$this->displayLanguageOption($langName)?></a>
                  </span>
                <?php endforeach; ?>
              </span>
            </li>
          <?php endif; ?>
        </ul>
      </nav>
    </div>
  <?php endif; ?>
    <?php /* finc searchbox: we use searchbox here so it becomes part of the sticky header,
        we need to place this after the navbar-right for anything but mobile  - see flex-container in SCSS:*/ ?>
    <?php if ($this->layout()->searchbox !== false): ?>
    <?php /* FID BBI: Do not use .container class here ! - CK */ ?>
      <div class="search">
        <nav class="nav searchbox hidden-print">
          <?=$this->layout()->searchbox?>
        </nav>
      </div>
    <?php endif; ?>
    <?php /* finc searchbox - END */ ?>
  </div>
</div>
<?php /* If you want to use searchbox in a separate row, insert it here as in bootstrap theme - CK */ ?>
<!-- fid_bbi: header -->