{% extends "base.html" %}
{% load i18n static %}

{% block extra_head %}
<link href="{% static "dist/main.css" %}" rel="stylesheet">
<script src="{% static "dist/main.js" %}" defer></script>
{% if UMAMI_HOST and UMAMI_WEBSITE_ID %}
<script defer src="https://{{ UMAMI_HOST }}/script.js" data-website-id="{{ UMAMI_WEBSITE_ID }}"></script>
{% endif %}
<link rel="icon" type="image/svg+xml" href="{% static "icons/favicon.svg" %}">
<style>
    main.container {
        padding-top: 5rem;
        padding-bottom: 2rem;
        padding-left: 5%;
        padding-right: 5%;
    }
    .admin-thumb {
        width: 80px;
        height: 80px;
        object-fit: cover;
    }
</style>
{% endblock %}

{% block navbar %}
<nav class="fixed top primary-container">
  <button class="circle transparent large" data-ui="#admin-menu">
    <i>menu</i>
  </button>
  <a href="{% url 'admin_dashboard' %}" class="row align-center">
    <img src="{% static 'icons/icon.svg' %}" class="circle small">
  </a>
  <div class="max"></div>

  <button class="circle transparent" data-ui="#user-menu">
    {% if user.avatar %}
    <img src="{{ user.avatar.url }}" class="circle">
    {% else %}
    <img src="https://www.w3schools.com/howto/img_avatar.png" class="circle">
    {% endif %}
  </button>
</nav>

<dialog id="admin-menu" class="left">
    <nav class="drawer vertical">
        <header>
            <img src="{% static 'icons/icon.svg' %}" class="circle large">
            <h5 class="max">{% trans "Admin" %}</h5>
        </header>
        <div class="space"></div>
        <a href="{% url 'admin_dashboard' %}" class="padding {% if request.resolver_match.url_name == 'admin_dashboard' %}active{% endif %}">
            <i>dashboard</i>
            <span class="large-text">{% trans "Dashboard" %}</span>
        </a>
        <a href="{% url 'admin_recipe_list' %}" class="padding {% if request.resolver_match.url_name == 'admin_recipe_list' %}active{% endif %}">
            <i>restaurant</i>
            <span class="large-text">{% trans "Recipes" %}</span>
        </a>
        <a href="{% url 'admin_recipe_approval_list' %}" class="padding {% if request.resolver_match.url_name == 'admin_recipe_approval_list' %}active{% endif %}">
            <i>how_to_reg</i>
            <span class="large-text">{% trans "Approvals" %}</span>
        </a>
        <a href="{% url 'admin_user_list' %}" class="padding {% if request.resolver_match.url_name == 'admin_user_list' %}active{% endif %}">
            <i>people</i>
            <span class="large-text">{% trans "Users" %}</span>
        </a>
        <a href="{% url 'admin_tag_list' %}" class="padding {% if request.resolver_match.url_name == 'admin_tag_list' %}active{% endif %}">
            <i>label</i>
            <span class="large-text">{% trans "Tags" %}</span>
        </a>
        <a href="{% url 'admin_rating_list' %}" class="padding {% if request.resolver_match.url_name == 'admin_rating_list' %}active{% endif %}">
            <i>star</i>
            <span class="large-text">{% trans "Ratings" %}</span>
        </a>
        <a href="{% url 'admin_order_list' %}" class="padding {% if request.resolver_match.url_name == 'admin_order_list' %}active{% endif %}">
            <i>shopping_cart</i>
            <span class="large-text">{% trans "Orders" %}</span>
        </a>
        <a href="{% url 'admin_settings' %}" class="padding {% if request.resolver_match.url_name == 'admin_settings' %}active{% endif %}">
            <i>settings</i>
            <span class="large-text">{% trans "Site Settings" %}</span>
        </a>
        <a href="{% url 'admin_task_list' %}" class="padding {% if request.resolver_match.url_name == 'admin_task_list' %}active{% endif %}">
            <i>assignment</i>
            <span class="large-text">{% trans "Tasks" %}</span>
        </a>
        <a href="{% url 'admin_logs' %}" class="padding {% if request.resolver_match.url_name == 'admin_logs' %}active{% endif %}">
            <i>terminal</i>
            <span class="large-text">{% trans "Logs" %}</span>
        </a>
        <div class="divider"></div>
        <a href="{% url 'index' %}" class="padding">
            <i>home</i>
            <span class="large-text">{% trans "Public Site" %}</span>
        </a>
    </nav>
</dialog>

{% if user.is_authenticated %}
<menu id="user-menu" class="no-wrap">
  <a href="{% url 'admin:logout' %}" class="row"><i>logout</i>{% trans "Logout" %}</a>
</menu>
{% endif %}
{% endblock %}

{% block footer %}
    {% include "components/footer.html" %}
{% endblock %}

{% block extra_scripts %}
{{ block.super }}
{% block admin_scripts %}{% endblock %}
{% endblock %}