{% extends "admin/admin_base.html" %}
{% load i18n %}

{% block admin_title %}{{ title }}{% endblock %}

{% block content %}
<main class="container">
    <article class="round padding">
        <header>
            <h5 class="max">{% trans "Site Settings" %}</h5>
        </header>
        <div class="space"></div>
        <form method="post">
            {% csrf_token %}
            <div class="grid">
                {% for field in form %}
                <div class="s12 m6">
                    <div class="field label border round">
                        {{ field }}
                        <label>{{ field.label }}</label>
                        {% if field.help_text %}
                        <div class="helper">{{ field.help_text }}</div>
                        {% endif %}
                        {% if field.errors %}
                        <span class="error">{{ field.errors|striptags }}</span>
                        {% endif %}
                    </div>
                </div>
                {% if field.name == 'instagram_enabled' %}
                <div class="s12">
                    <div class="space"></div>
                    <div class="padding">
                        <p class="italic">{% trans "Force a synchronization of existing recipes to Instagram that haven't been uploaded yet." %}</p>
                        <button type="submit" formaction="{% url 'admin_sync_instagram' %}" class="button border round">
                            <i>sync</i>
                            <span>{% trans "Sync recipes to Instagram" %}</span>
                        </button>
                    </div>
                    <div class="space"></div>
                </div>
                {% endif %}
                {% endfor %}
            </div>
            <div class="space"></div>
            <nav class="right-align">
                <button type="submit" class="button primary round">
                    <i>save</i>
                    <span>{% trans "Save Settings" %}</span>
                </button>
            </nav>
        </form>
    </article>
</main>
{% endblock %}