{% extends 'cms/blocks/_block.html' %}
{% load wagtailcore_tags %}

{% block block_content %}
    <div class="component-text-container">
        {% if request.user_agent.is_pc %}
            {% for component in value.component %}
                <div class="component-container {{ component.block_type }} {% if value.animation and not amp %}animation fade-up{% endif %}">
                    {% include_block component with theme=value.theme block_num=block_num %}
                </div>
            {% endfor %}
        {% endif %}
        <{% if value.section %}section{% else %}div{% endif %}
                class="padding text-container {% if value.reverse %}reverse{% endif %} {% if value.align %}align-text-{{ value.align }}{% endif %}">
            {% include_block value.titles with theme=value.theme %}
            {% if not request.user_agent.is_pc %}
                {% for component in value.component %}
                    <div class="component-container {{ component.block_type }} {% if value.animation and not amp %}animation fade-up{% endif %}">
                        {% include_block component with theme=value.theme block_num=block_num %}
                    </div>
                {% endfor %}
            {% endif %}
            {% include_block value.text with theme=value.theme %}
            <div class="btn-container">
                {% for button in value.buttons %}
                    {% if value.align == 'center' %}
                        {% include_block button with space='c' %}
                    {% elif value.align == 'right' %}
                        {% include_block button with space='l' %}
                    {% elif value.align == 'left' %}
                        {% include_block button with space='r' %}
                    {% elif value.reverse %}
                        {% include_block button with space='l' %}
                    {% else %}
                        {% include_block button with space='r' %}
                    {% endif %}
                {% endfor %}
            </div>
        </{% if value.section %}section{% else %}div{% endif %}>
    </div>
{% endblock %}
