{# ========================================================================= #}
{# :: Imports #}
{# ========================================================================= #}
{% import "molecules/list/list-macros.njk" as list %}

{# ========================================================================= #}
{# :: Default #}
{# ========================================================================= #}
{% macro default(classes, data) %}

<div class="a-quote {{classes}}">
  <h3 class="a-quote__text">{{data.text}}</h3>
  <p class="a-quote__author">- {{data.author}} -</p>
</div>

{% endmacro %}

{# ========================================================================= #}
{# :: Portrait #}
{# ========================================================================= #}
{% macro portrait(classes, data) %}

<div class="a-quote a-quote--portrait {{classes}}">
	<div class="a-quote__container">
		<div class="a-quote__content">
			<h3 class="a-quote__text">{{data.text}}</h3>
			<p class="a-quote__author">- {{data.author}} -</p>
		</div>

		<div class="a-quote__author-container">
			<picture class="a-quote__picture">
			<img class="a-quote__image" src="{{data.image}}" alt="{{data.author}}" title="{{data.author}}" />
			</picture>

			<p class="a-quote__author a-quote__author-mobile">- {{data.author}} -</p>
		</div>
	</div>
</div>

{% endmacro %}

{# ========================================================================= #}
{# :: SMALL #}
{# ========================================================================= #}
{% macro small(classes, data) %}

<div class="a-quote a-quote--small {{classes}}">
  <h4 class="a-quote__text">{{data.text}}</h4>

  {% if data.author %}
    <p class="a-quote__author a-label">- {{data.author}} -</p>
  {% endif %}
</div>

{% endmacro %}

{# ========================================================================= #}
{# :: EXTA SMALL #}
{# ========================================================================= #}
{% macro extraSmall(classes, data) %}

<div class="a-quote a-quote--extra-small {{classes}}">
  <h4 class="a-quote__text">{{data.text}}</h4>
</div>

{% endmacro %}