4.2.4 molecules.navigation.nav-book Nav book

Toggle example guides Toggle HTML markup

Styles for table of contents as provided bij the social_book module. Menu items have triangle icons indicating wether there are menu items below this item or not. The highlighted path leads to the page title the user is currently viewing.

Markup: 03-molecules/navigation/nav-book/nav-book.twig
<ul block="block-booknavigation-2" class="nav-book">
  <li class="menu-item menu-item--collapsed">
    <a href="#">Lorem ipsum dolor sit amet</a>
  </li>
  <li class="menu-item menu-item--has-children menu-item--expanded menu-item--active-trail">
    <a href="#">Lorem ipsum dolor sit amet sequitur sunt</a>
    <ul class="menu">
      <li class="menu-item menu-item--has-children menu-item--expanded menu-item--active-trail">
        <a href="#">Lorem ipsum dolor sit amet</a>
        <ul class="menu">
          <li class="menu-item menu-item--active-trail">
            <a href="#">Lorem ipsum.</a>
          </li>
        </ul>
      </li>
    </ul>
  </li>
  <li class="menu-item">
    <a href="#">Lorem ipsum dolor sit amet</a>
  </li>
</ul>
Source: 03-molecules/navigation/nav-book/nav-book.scss, line 1