Barmer Fractal

Navigation Item: Logged In Nav 

<div class="m-nav__item nav__item--main nav__item--logged-in navigation__level--col-1">
    <button class="a-btn btn--logged-in js-nav-sub-open" type="button" aria-haspopup="true" aria-expanded="false"><span class="btn__initials" aria-hidden="true">CK</span><span class="btn__text">Meine BARMER</span></button>

    <div class="navigation__level navigation__level--sub">
        <button class="a-btn btn--back js-back" type="button">zurück<i class="a-icon icon--arrow-back" aria-hidden="true"></i></button>

        <a href="/components/preview/article" class="m-navigation__level-header">
            Übersicht Meine BARMER
        </a>

        <button class="a-btn btn--close js-close" type="button" aria-label="Schließt das Menü"><i class="a-icon icon--close" aria-hidden="true"></i></button>

        <ul class="m-nav__list nav__list--sub">
            <li class="m-nav__item  ">
                <a href="http://radiofrance.fr" class="a-link ">
                    Anträge & Bescheinigungen

                </a>

            </li>

            <li class="m-nav__item  ">
                <a href="http://orf.at" class="a-link ">
                    Meine Versicherung

                </a>

            </li>

            <li class="m-nav__item  ">
                <a href="http://fm4.orf.at" class="a-link ">
                    Postfach <span class="js-mailbox" hidden>(<span class="js-mail-counter">99</span>)</span>

                </a>

            </li>

            <li class="m-nav__item  ">
                <a href="http://fm4.orf.at" class="a-link ">
                    Benutzerkonto verwalten

                </a>

            </li>

            <li class="m-nav__item  ">
                <a href="http://fm4.orf.at" class="a-link ">
                    Gesundheitsmanager

                </a>

            </li>

            <li class="m-nav__item  ">
                <a href="http://fm4.orf.at" class="a-link ">
                    Kompass Krankengeld

                </a>

            </li>

            <li class="m-nav__item  ">
                <a href="http://fm4.orf.at" class="a-link ">
                    Hilfe & Tipps

                </a>

            </li>

        </ul>

    </div>
</div>
 
<{{content.tag}} class="m-nav__item {{viewtypes.specifier}} {{viewtypes.numberOfCols}}">
  {{#if switches.isLoggedInNav}}
    {{ render '@button--login-with-user-initials' }}
  {{else}}
    {{# each partials.links as |link| }}
      {{ render '@link--navigation' link merge=true }}
    {{/each }}
  {{/if}}

  {{# switches.hasSessionTimer }}
    {{ render '@separator' }}
    {{ render '@session-timer' partials.sessionTimer merge=true }}
  {{/switches.hasSessionTimer}}

	{{# switches.hasSubnav }}
		<div class="navigation__level navigation__level--sub">
      {{# switches.hasBackButton }}{{ render '@button--back' partials.btnBack merge=true }}{{/ switches.hasBackButton}}
      {{# switches.hasOverviewLink }}{{ render '@navigation-level-header' partials.navSubHeader merge=true }} {{/ switches.hasOverviewLink }}
      {{# switches.hasCloseButton }}{{ render '@button--close' partials.btnClose merge=true }}{{/ switches.hasCloseButton}}
			{{ render '@navigation-list' partials.navSubLink merge=true }}
		</div>
	{{/ switches.hasSubnav }}
</{{content.tag}}>
 
{
  "switches": {
    "isLoggedInNav": true,
    "hasSubnav": true,
    "hasBackButton": true,
    "hasOverviewLink": true,
    "hasCloseButton": true
  },
  "viewtypes": {
    "specifier": "nav__item--main nav__item--logged-in",
    "numberOfCols": "navigation__level--col-1"
  },
  "content": {
    "tag": "div"
  },
  "partials": {
    "links": [
      {
        "switches": {
          "hasAriaExpanded": false,
          "hasAriaPopup": false,
          "isNavItemWithoutLink": false
        },
        "viewtypes": {},
        "content": {
          "url": "http://ard.de",
          "text": "Molekül Nav-Item (default)"
        },
        "partials": {}
      }
    ],
    "btnBack": {
      "switches": {},
      "viewtypes": {
        "specifier": "btn--back js-back"
      },
      "content": {},
      "partials": {}
    },
    "btnClose": {
      "switches": {},
      "viewtypes": {
        "specifier": "btn--close js-close"
      },
      "content": {},
      "partials": {}
    },
    "navSubHeader": {
      "content": {
        "label": "Übersicht",
        "text": "Meine BARMER"
      }
    },
    "navSubLink": {
      "viewtypes": {
        "specifier": "nav__list--sub"
      },
      "switches": {
        "itemCount": 7
      },
      "partials": {
        "navItem": [
          {
            "switches": {},
            "viewtypes": {},
            "content": {},
            "partials": {
              "links": [
                {
                  "switches": {},
                  "viewtypes": {},
                  "content": {
                    "url": "http://radiofrance.fr",
                    "text": "Anträge & Bescheinigungen"
                  },
                  "partials": {}
                }
              ]
            }
          },
          {
            "switches": {},
            "viewtypes": {},
            "content": {},
            "partials": {
              "links": [
                {
                  "switches": {},
                  "viewtypes": {},
                  "content": {
                    "url": "http://orf.at",
                    "text": "Meine Versicherung"
                  },
                  "partials": {}
                }
              ]
            }
          },
          {
            "switches": {},
            "viewtypes": {},
            "content": {},
            "partials": {
              "links": [
                {
                  "switches": {},
                  "viewtypes": {},
                  "content": {
                    "url": "http://fm4.orf.at",
                    "text": "Postfach <span class=\"js-mailbox\" hidden>(<span class=\"js-mail-counter\">99</span>)</span>"
                  },
                  "partials": {}
                }
              ]
            }
          },
          {
            "switches": {},
            "viewtypes": {},
            "content": {},
            "partials": {
              "links": [
                {
                  "switches": {},
                  "viewtypes": {},
                  "content": {
                    "url": "http://fm4.orf.at",
                    "text": "Benutzerkonto verwalten"
                  },
                  "partials": {}
                }
              ]
            }
          },
          {
            "switches": {},
            "viewtypes": {},
            "content": {},
            "partials": {
              "links": [
                {
                  "switches": {},
                  "viewtypes": {},
                  "content": {
                    "url": "http://fm4.orf.at",
                    "text": "Gesundheitsmanager"
                  },
                  "partials": {}
                }
              ]
            }
          },
          {
            "switches": {},
            "viewtypes": {},
            "content": {},
            "partials": {
              "links": [
                {
                  "switches": {},
                  "viewtypes": {},
                  "content": {
                    "url": "http://fm4.orf.at",
                    "text": "Kompass Krankengeld"
                  },
                  "partials": {}
                }
              ]
            }
          },
          {
            "switches": {},
            "viewtypes": {},
            "content": {},
            "partials": {
              "links": [
                {
                  "switches": {},
                  "viewtypes": {},
                  "content": {
                    "url": "http://fm4.orf.at",
                    "text": "Hilfe & Tipps"
                  },
                  "partials": {}
                }
              ]
            }
          }
        ]
      }
    }
  }
}

No notes defined.