{% load i18n wagtailcore_tags %}

<div class="newsletter_wrapper" id="newsletter_subscription">
    {% if page.newsletter_header %}
        <div class="newsletter_header">
            {{ page.newsletter_header|richtext }}
        </div>
    {% endif %}

    {% if form.is_valid and page.newsletter_thankyou %}
        {{ page.newsletter_thankyou|richtext|default:"Bedankt voor het inschrijven" }}
    {% endif %}
    <form action="{% url 'ocyan_plugin_newsletter:newsletter-subscribe' %}" method="post" {% if name %} name="{{ name }}" {% endif %}>
        {% csrf_token %}
        <div class="newsletter_inner">
            <div class="w-100">
            	<div class="mb-3">
                    {% if self.title %}
            		  <h3>{{ self.title }}</h3>
                    {% else %}
                        <h3>{% trans 'Newsletter' %}</h3>
                    {% endif %}
                    {% if self.description %}
            		  <div>{{ self.description }}</div>
                    {% else %}
                      <div>{% trans 'Receive great offers regularly by email!' %}</div>
                    {% endif %}
            	</div>
                <div class="row">
                    <div class="col-lg-8">
                        <div class="row">
                        {% for field in form %}
                            <div class="col-lg-6">
                                <div class="fieldWrapper">
                                	{% include "oscar/partials/form_field.html" with field=field placeholder=field.label nolabel=True %}
                                </div>
                            </div>
                        {% endfor %}
                        </div>
                    </div>
                    <div class="col-lg-4">
                        <input type="submit" class="btn btn-submit" value="{% trans 'Subscribe' %}">
                    </div>
                </div>
            </div>
            <div>
                {% if form.is_valid and not page.newsletter_thankyou %}
                    <p class="text-success">{% trans 'Thank you for subscribing to our newsletter' %}</p>
                {% endif %}
            </div>
        </div>
    </form>
</div>