<div class="furniture_new_arrivals" id="new_arrivals-{{ section.id }}">
  <div class="page-width fna_wrapper">
    {% if section.settings.title != blank %}
    <div class="section-header text-center animatable fadeInLeftBig animate">
      <h1>{{ section.settings.title }}</h1>
    </div>
    {% endif %}

    {% if section.blocks.size > 0 %}
    <div class="fna_container">
      <div class="fna_content">
        <ul class="grid collection_grids">
          {% for block in section.blocks %}
          <li class="grid__item medium-up--one-half">
            <div class="collection_content">
              <a href="{% if block.settings.btn_url != blank %}{{ block.settings.btn_url }}{% else %}#{% endif %}">
                {% if block.settings.collection_image != blank %}
                <img class="lazyload animatable fadeInUpBig animate" data-src="{{ block.settings.collection_image | img_url: "770x" }}" alt="" />
                {% else %}
                {{ 'image' | placeholder_svg_tag: 'placeholder-svg' }}
                {% endif %}
                <div class="content">
                  <h3 class="title animatable fadeInDownBig animate" style="color: {{ block.settings.text_color }}">{{ block.settings.title }}</h3>
                  <a class="btn coll_btn btn-{{ block.id }} animatable fadeInDownBig animate"
                     href="{% if block.settings.btn_url != blank %}{{ block.settings.btn_url }}{% else %}#{% endif %}">{{ block.settings.btn_text }}</a>
                </div>
              </a>
            </div>
          </li>
          {% endfor %}
        </ul>
      </div>
    </div>
    {% endif %}
  </div>
</div>


{% if section.blocks.size > 0 %}
{% for block in section.blocks %}
<style type="text/css">
  .furniture_new_arrivals .fna_container .collection_grids li .collection_content .content a.btn-{{ block.id }} {
    background: {{ block.settings.btn_bg_color }};
    color: {{ block.settings.btn_text_color }};
    border: 1px solid {{ block.settings.btn_bg_color }};
  }
  .furniture_new_arrivals .fna_container .collection_grids li .collection_content .content a.btn-{{ block.id }}:hover {
    background: {{ block.settings.btn_bg_hover_color }};
    color: {{ block.settings.btn_text_hover_color }};
  }
</style>
{% endfor %}
{% endif %}


{% schema %}
  {
    "name": "Recém chegados",
    "settings": [
		{
			"type": "text",
			"id": "title",
			"label": "Título",
			"default": "Recém chegados"
		}
	],
	"blocks": [
		{
			"type": "collection_type",
			"name": "Coleção",
			"settings": [
				{
					"type": "image_picker",
					"id": "collection_image",
					"label": "Imagem",
					"info": "770x445"
				},
				{
					"type": "text",
					"id": "title",
					"label": "Título"
				},
				{
					"type": "text",
					"id": "btn_text",
					"label": "Título do botão",
					"default": "Ver produto"
				},
				{
					"type": "url",
					"id": "btn_url",
					"label": "URL do botão"
				},
				{
                    "type": "header",
                    "content": "Color"
                },
                {
                    "type": "color",
                    "id": "text_color",
                    "label": "Cor do texto",
                    "default": "#ffffff"
                },
				{
                    "type": "color",
                    "id": "btn_bg_color",
                    "label": "Cor de fundo do botão",
                    "default": "#000000"
                },
                {
                    "type": "color",
                    "id": "btn_bg_hover_color",
                    "label": "Cor de fundo do botão, ao passar mouse",
                    "default": "#ffffff"
                },
                {
                    "type": "color",
                    "id": "btn_text_color",
                    "label": "Cor do texto do botão",
                    "default": "#ffffff"
                },
                {
                    "type": "color",
                    "id": "btn_text_hover_color",
                    "label": "Cor do texto do botão, ao passar mouse",
                    "default": "#000000"
                }
			]
		}
	],
	"presets": [
		{
			"name": "Recém chegados",
			"category": "astron"
		}
	]
  }
{% endschema %}

{% stylesheet %}
{% endstylesheet %}

{% javascript %}
{% endjavascript %}

