Freie Grundschule Pfefferwerk - Frontend Design

Menu Social 

<!--
    @int:
    link title required due to accessibility
-->
<nav class="c-menu-social" aria-label="Social-Navigation">

    <ul class="c-menu-social__list" role="menu">

        <li class="c-menu-social__item" role="menuitem">
            <a href="#" class="c-menu-social__link" title="besuchen sie uns auf instagram">
                    <svg width="32px" height="32px" viewBox="0 0 32 32" class="o-icons o-icons--instagram" aria-hidden="true">
    <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="../../typo3conf/ext/fgp_template/Resources/Public/Frontend/_Default/icons/sprite/sprite.svg#instagram"></use>
</svg>

                </a>
        </li>
        <li class="c-menu-social__item" role="menuitem">
            <a href="#" class="c-menu-social__link" title="besuchen sie uns auf youtube">
                    <svg width="32px" height="32px" viewBox="0 0 32 32" class="o-icons o-icons--youtube" aria-hidden="true">
    <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="../../typo3conf/ext/fgp_template/Resources/Public/Frontend/_Default/icons/sprite/sprite.svg#youtube"></use>
</svg>

                </a>
        </li>
        <li class="c-menu-social__item" role="menuitem">
            <a href="#" class="c-menu-social__link" title="besuchen sie uns auf twitter">
                    <svg width="32px" height="32px" viewBox="0 0 32 32" class="o-icons o-icons--twitter" aria-hidden="true">
    <use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="../../typo3conf/ext/fgp_template/Resources/Public/Frontend/_Default/icons/sprite/sprite.svg#twitter"></use>
</svg>

                </a>
        </li>

    </ul>

</nav>
 
<!--
    @int:
    link title required due to accessibility
-->
<nav class="c-menu-social" aria-label="Social-Navigation">

    <ul class="c-menu-social__list" role="menu">

        {{#each menuSocialItems}}
            <li class="c-menu-social__item" role="menuitem">
                <a href="{{url}}" class="c-menu-social__link" title="{{title}}">
                    {{render (lookup . 'icon') }}
                </a>
            </li>
        {{/each}}

    </ul>

</nav>
 
{
  "menuSocialItems": [
    {
      "title": "besuchen sie uns auf instagram",
      "url": "#",
      "icon": "@icons--instagram"
    },
    {
      "title": "besuchen sie uns auf youtube",
      "url": "#",
      "icon": "@icons--youtube"
    },
    {
      "title": "besuchen sie uns auf twitter",
      "url": "#",
      "icon": "@icons--twitter"
    }
  ]
}

There are no notes for this item.