{% extends 'base.html.twig' %}
{% block stylesheets %}
      {{ parent() }}
      <link rel='stylesheet' type='text/css' href="{{ asset('assets/css/settings/settings.css') }}" media="screen and (min-width: 1300px)">
      <link rel='stylesheet' type='text/css' href="{{ asset('assets/css/settings/settings_mid.css') }}" media="screen and (max-width: 1300px)">
      <link rel='stylesheet' type='text/css' href="{{ asset('assets/css/settings/settings_small.css') }}" media="screen and (max-width: 750px)">
{% endblock %}

{% block title %}Profile Settings{% endblock %}

{% block header %}{{ parent() }}{% endblock %}

{% block body %}

<div class='content'>
      <nav class='set-nav'>
            <ul>
                  <li>
                        <a href="{{ path('settings_profile') }}" class='hover-effect {% if (app.request.attributes.get('_route') starts with 'settings_profile') or (app.request.attributes.get('_route') starts with 'settings_avatar')%}active{% endif %}'>Settings</a>
                  </li>
                  <li>
                        <a href="{{ path('settings_account') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'settings_account' %}active{% endif %}'>Account</a>
                  </li>
                  <li>
                        <a href="{{ path('doc_tags') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'doc_tags' %}active{% endif %}'>Misc</a>
                  </li>
            </ul>
      </nav>
      <nav class='set-nav2'>
            <ul>
                  <li>
                        <a href="{{ path('settings_profile') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'settings_profile' %}active{% endif %}'>Profile</a>
                  </li>
                  <li>
                        <a href="{{ path('settings_avatar') }}" class='hover-effect {% if app.request.attributes.get('_route') starts with 'settings_avatar' %}active{% endif %}'>Avatar</a>
                  </li>
            </ul>
      </nav>
{% block form %}
<div class='form'>
      {{ form(prof) }}
</div>
{% endblock %}
</div>
{% endblock %}