Styleguide

Navigation 

<ul class="navbar-nav mr-auto" aria-label="Categories">
    <li class="nav-item ">
        <a class="nav-link dropdown-toggle" href="#" id="navbarDropdownMenuLink-2" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">Produkt</a>
        <div class="dropdown-menu fullsize-dropdown-menu border-0 " aria-labelledby="navbarDropdownMenuLink-2">
            <div class="container first-dropdown-items">
                <ul>
                    <li class="dropdown-submenu dropdown">
                        <a class="dropdown-item dropdown-header" title="Testen Sie unser Smart Logistics System und erleben Sie, wie Logistik 4.0 Ihren Arbeitsalltag auf vielseitige Art erleichtern wird." href="/smart-logistics-system">Übersicht Smart Logistics System</a>
                        <ul class="dropdown-menu dropdown-child-menu animated fadeIn faster">
                            <li>
                                <a class="dropdown-item dropdown-header" href="/smart-logistics-system/frachtenbörse" title="Jetzt Leerfahrten vermeiden! Dank unserem Netzwerk mit über 800.000 internationalen Fracht- &amp;amp; Laderaumangeboten täglich.">Überblick</a>
                            </li>
                        </ul>
                    </li>

                </ul>
            </div>
            <div class="navbar-close d-none d-xl-block">
                <button type="button" class="close" title="Menü schließen" data-dismiss="alert" aria-label="Close">
                    <span aria-hidden="true"><i class="icon-light-plus-circle"></i></span>
                </button>
            </div>
        </div>
    </li>
    <li class="nav-item is-input mt-3 mt-lg-0" role="listitem">
        <a class="btn btn-highlight btn-block nowrap" href="/registrieren" onclick="if(window.dataLayer){window.dataLayer.push({'event': 'call_to_action', 'event_category': 'click_button', 'event_action': 'register in navigation', 'event_label': '/kostenlos testen - language=de'});}" role="button" aria-label="Kostenlos testen">Kostenlos testen</a>
    </li>
</ul>
 
<ul class="navbar-nav mr-auto" aria-label="Categories">
  {{#each item}}
  <li class="nav-item {{#if open}}active show{{/if}}">
    <a
      class="{{class}}"
      href="{{href}}"
      id="{{id}}"
      data-toggle="dropdown"
      aria-haspopup="{{popup}}"
      aria-expanded="{{expanded}}"
      >{{text}}</a
    >
    {{#if popup}}
    <div
      class="dropdown-menu fullsize-dropdown-menu border-0 {{#if open}}show{{/if}}"
      aria-labelledby="{{id}}"
    >
      <div class="container first-dropdown-items">
        <ul>
          {{#each item}}
          <li class="{{#if popup}}dropdown-submenu dropdown{{/if}}">
            <a class="{{class}}" title="{{title}}" href="{{href}}">{{text}}</a>
            {{#if item}}
            <ul
              class="dropdown-menu dropdown-child-menu animated fadeIn faster"
            >
              {{#each item}}
              <li>
                <a class="{{class}}" href="{{href}}" title="{{title}}"
                  >{{text}}</a
                >
              </li>
              {{/each}}
            </ul>
            {{/if}}
          </li>

          {{/each}}
        </ul>
      </div>
      <div class="navbar-close d-none d-xl-block">
        <button
          type="button"
          class="close"
          title="Menü schließen"
          data-dismiss="alert"
          aria-label="Close"
        >
          <span aria-hidden="true"><i class="icon-light-plus-circle"></i></span>
        </button>
      </div>
    </div>
    {{/if}}
  </li>
  {{/each}}
  <li class="nav-item is-input mt-3 mt-lg-0" role="listitem">
    <a
      class="btn btn-highlight btn-block nowrap"
      href="/registrieren"
      onclick="if(window.dataLayer){window.dataLayer.push({'event': 'call_to_action', 'event_category': 'click_button', 'event_action': 'register in navigation', 'event_label': '/kostenlos testen - language=de'});}"
      role="button"
      aria-label="Kostenlos testen"
      >Kostenlos testen</a
    >
  </li>
</ul>
 
{
  "item": [
    {
      "class": "nav-link dropdown-toggle",
      "href": "#",
      "id": "navbarDropdownMenuLink-2",
      "popup": true,
      "expanded": false,
      "text": "Produkt",
      "open": false,
      "item": [
        {
          "class": "dropdown-item dropdown-header",
          "title": "Testen Sie unser Smart Logistics System und erleben Sie, wie Logistik 4.0 Ihren Arbeitsalltag auf vielseitige Art erleichtern wird.",
          "href": "/smart-logistics-system",
          "text": "Übersicht Smart Logistics System",
          "popup": true,
          "item": [
            {
              "class": "dropdown-item dropdown-header",
              "href": "/smart-logistics-system/frachtenbörse",
              "title": "Jetzt Leerfahrten vermeiden! Dank unserem Netzwerk mit über 800.000 internationalen Fracht- &amp; Laderaumangeboten täglich.",
              "text": "Überblick"
            }
          ]
        }
      ]
    }
  ]
}

No notes defined.