{% if not embedded %}{% extends 'base/base.html' %}{% endif %}
{% import 'input/textbox.html' as textbox with context %}
{% import 'blog/macros.html' as blog with context %}
{% import 'input/form.html' as form with context %}
{% import 'input/field.html' as field with context %}

{% block body %}
    <div class="panel is-primary mt-4">
        <p class="panel-heading">New blog post</p>
        <p class="panel-tabs">
        <a class="tab__btn click_to_edit is-active"
           href="#">
            {% trans %}edit{% endtrans %}
        </a>

        <a class="tab__btn click_to_preview nojs_hide"
           href="#">
            {% trans %}preview{% endtrans %}
        </a>
        </p>
        <div id="tab_edit" class="panel-block is-active tab__page state_clicked">
            {% call form.form(id="blog_post_edit", class="is-flex-grow-1") %}
                {{ field.text("title", _("title"), help=_("title is optional"))}}
                {{ field.text("tags", _("tags"), placeholder=_("tags are comma separated"))}}
                {{ field.textarea("body", "", rows=12, cols=none, help=_("You can use markdown syntax"),
                                  required=true) }}
                {{ field.submit(_("Publish"), class="is-fullwidth is-outlined has-text-weight-bold") }}
            {% endcall %}
        </div>
        <div id="tab_preview" class="panel-block tab__page">
        </div>
    </div>
{% endblock body %}