SIA Web Design Library

User account: Anonymous

No notes defined.

<div class='c-user-account'>
    <nav id='user-account-navigation' class='c-user-account__nav js-has-toggler' role='navigation'>
        <button class="js-toggle c-button--icon c-user-account__js-toggle" aria-expanded="false" aria-controls="user-account-menu">
            <span class='c-avatar c-user-account__avatar'>
                <span class='c-icon c-avatar__icon c-icon--noun_user_1515313-svg'>
                    <svg height='100px' width='100px' fill="#000000" xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="25 25 50 50" x="0px" y="0px">
                        <path d="M50,26A24,24,0,1,0,74,50,24,24,0,0,0,50,26ZM40,67.29V66a10,10,0,0,1,20,0v1.29a19.81,19.81,0,0,1-20,0ZM44,46a6,6,0,1,1,6,6A6,6,0,0,1,44,46ZM63.89,64.35a14,14,0,0,0-7.45-10.77A9.91,9.91,0,0,0,60,46a10,10,0,0,0-20,0,9.91,9.91,0,0,0,3.56,7.58,14,14,0,0,0-7.45,10.77,20,20,0,1,1,27.78,0Z"></path>
                    </svg>
                </span></span> </button>
        <ul id="user-account-menu" class="c-menu c-menu--toc">
            <li class="
            c-menu__item 
             
             
            "><a class="
                c-menu__item__link 
                                " href=''>Log in</a> </li>
            <li class="
            c-menu__item 
             
             
            "><a class="
                c-menu__item__link 
                                " href=''>Register</a> </li>
        </ul>
    </nav>
</div>
 
<div class='{{ get_component_class( 'user-account', display ) }}'>
    <nav id='user-account-navigation' class='c-user-account__nav js-has-toggler' role='navigation'>
        <button class="js-toggle c-button--icon c-user-account__js-toggle" aria-expanded="false" aria-controls="user-account-menu">
            {% if headshot %}
                {% include '@unit/headshot/headshot.twig' with headshot %}
            {% else %}
                {% include '@unit/avatar/avatar.twig' with avatar %}
            {% endif %}
        </button>
        {% include '@unit/menu/menu.twig' with menu %}
    </nav>
</div>
 
{
  "headshot": null,
  "menu": {
    "id": "user-account-menu",
    "display": {
      "modifiers": [
        "toc"
      ]
    },
    "items": [
      {
        "title": "Log in"
      },
      {
        "title": "Register"
      }
    ]
  },
  "avatar": {
    "display": {
      "component": "user-account"
    }
  }
}