{% if theme() and file_exists('app/templates/themes/' + theme() + '/base.html') %}
    {% extends 'themes/' + theme() + '/base.html' %}
{% else %}
    {% extends "base.html" %}
{% endif %} %}
{% from 'bootstrap/form.html' import render_field %}

{% block app_content %}
    <div class="row">
        <div class="col col-login mx-auto">
            <div class="card mt-5">
                <div class="card-body p-6">
                    <div class="card-title">{{ _('Create community') }}</div>
                    <form method="post" enctype="multipart/form-data" id="add_local_community_form" role="form">
                        {{ form.csrf_token() }}
                        {{ render_field(form.community_name) }}
                        <div class="form-group">{{ form.url.label(class_="form-control-label required") }}
                            /c/{{ form.url(class_="form-control", maxlength=255) }}
                            {% for error in form.url.errors %}
                            <span style="color: red;">[{{ error }}]</span>
                            {% endfor %}
                        </div>
                        {{ render_field(form.description) }}
                        {{ render_field(form.icon_file) }}
                        <small class="field_hint">{{ _('Provide a square image that looks good when small. SVG is allowed.') }}</small>
                        {{ render_field(form.banner_file) }}
                        <small class="field_hint">{{ _('Provide a wide image - letterbox orientation.') }}</small>
                        {{ render_field(form.rules) }}
                        {{ render_field(form.nsfw) }}
                        {{ render_field(form.local_only) }}
                        <small class="field_hint">{{ _('Only people using %(name)s can post or reply', name=current_app.config['SERVER_NAME']) }}.</small>
                        {{ render_field(form.languages) }}
                        {{ render_field(form.submit) }}
                    </form>
                </div>
            </div>
        </div>
    </div>
{% endblock %}