<div class="index-section home-section {% if section.settings.is_effect_apply%}no_animation_effect{% else %}animation_effect{% endif %}">
	{% for block in section.blocks %}
	  {% if block.settings.image %}
	    {% capture feature_image_url %}{{ block.settings.image | img_url: '900x900' }}{% endcapture %}
	  {%else%}
  		{% capture feature_image_url %}{{ 'image-content.jpg' | asset_url }}{% endcapture %}
  	  {% endif %}
	<div data-animation_name="{{ block.settings.animation_name }}" data-animation_delay="{{ block.settings.animation_delay }}" class="home-imagebox {% if block.settings.animation_name != 'noeffect' %}scroll_animation {% endif %}" style="animation-duration: {{ block.settings.animation_duration }};" {{ block.shopify_attributes }}>
		<div class="grid-item half medium-down--one-whole image {% if block.settings.home-featured-align == 'right-img' %} push--large--one-half {% endif %}" {% if feature_image_url %}style="background-image: url('{{ feature_image_url }}')"{% endif %}>
			
		</div>
		<div class="grid">
			<div class="grid-item half medium-down--one-whole content {% if block.settings.home-featured-align == 'left-img' %} push--large--one-half {% else %} pull--no {% endif %}">
				<div class="large--display-table">
					<div class="large--display-table-cell">


						  {% unless block.settings.home-featured-title == blank %}
							<h{{ block.settings.heading_tag }} style="font-weight:{{ block.settings.heading_tag_text_style9}};" class="top-heading-big">{{ block.settings.home-featured-title | escape }}</h{{ block.settings.heading_tag }}>
						  {% endunless %}
						  {% unless block.settings.home-featured-content == blank %}
							{{ block.settings.home-featured-content }}
						  {% endunless %}
						  {% unless block.settings.home-featured-btn-label == blank %}
							<a class="button" href="{{ block.settings.home-featured-btn-url }}">{{ block.settings.home-featured-btn-label | escape }}</a>
						  {% endunless %}

					</div>
				</div>
			</div>
		</div>
	</div>

  {% endfor %}
</div>

{% schema %}
	{
		"name": "Image Content",
		"settings": [
					{
              	"type": "paragraph",
              	"content": "Video Tutorial FR : [Image Content by Ulrich Vallée](https:\/\/www.ulrichvallee.com\/pages\/image-content)"
       				 },
					{
                        "type":"checkbox",
                        "id":"is_effect_apply",
                        "label":"Apply Section Effect",
                        "default":false
                    }
        ],
		"blocks": [
			{
				"type": "text",
				"name": "Image and text",
				"settings": [
					
					{
						"type": "select",
						"id": "home-featured-align",
						"label": "Alignment",
						"default": "left-img",
						"options": [
							{
								"value": "left-img",
								"label": "Image on left"
							},
							{
								"value": "right-img",
								"label": "Image on right"
							}
						]
					},
					{
						"type": "image_picker",
						"id": "image",
						"label": "Image",
                		"info": "Minimun: 640px X 398px - Maximum : 1280px X 797px"
					},
					{
						"type": "text",
						"id": "home-featured-title",
						"label": "Heading",
						"default": "Talk about your brand"
					},
					{
						"type": "richtext",
						"id": "home-featured-content",
						"label": "Text",
						"default": "<p>Use this text to share information about your brand with your customers. <b>Describe a product, share announcements, or welcome customers to your store.</b></p>"
					},
					{
						"type": "text",
						"id": "home-featured-btn-label",
						"label": "Button label"
					},
					{
						"type": "url",
						"id": "home-featured-btn-url",
						"label": "Button link"
					},
					{
                      "type": "select",
                      "id": "heading_tag",
                      "label": "Heading Tag",
                      "default":"2",
                      "options": [
                        {
                            "value": "1",
                            "label": "H1"
                        },
                        {
                            "value": "2",
                            "label": "H2"
                        },
                        {
                            "value": "3",
                            "label": "H3"
                        },
                        {
                            "value": "4",
                            "label": "H4"
                        },
                        {
                            "value": "5",
                            "label": "H5"
                        },
                        {
                            "value": "6",
                            "label": "H6"
                        }
                      ]
                    },
					{
                      "type": "select",
                      "id": "heading_tag_text_style9",
                      "label": "Heading Font Style",
                      "options": [
                        {
                          "value": "300",
                          "label": "Lighter",
                          "group": "Font Style"
                        },
                        {
                          "value": "400",
                          "label": "Normal",
                          "group": "Font Style"
                        },
                        {
                          "value": "600",
                          "label": "Bold",
                          "group": "Font Style"
                        },
                        {
                          "value": "700",
                          "label": "Bolder",
                          "group": "Font Style"
                        }
                      ],
                      "default": "600"
                    },
                    {
                        "type": "select",
                        "id": "animation_name",
                        "label": "Animation Effect",
                        "default": "noeffect",
                        "options": [
                          {
                            "label": "No Effect",
                            "value": "noeffect"
                          },
                          {
                            "label": "bounce",
                            "value": "bounce"
                          },
                          {
                            "label": "flash",
                            "value": "flash"
                          },
                          {
                            "label": "pulse",
                            "value": "pulse"
                          },
                          {
                            "label": "rubberBand",
                            "value": "rubberBand"
                          },
                          {
                            "label": "shake",
                            "value": "shake"
                          },
                          {
                            "label": "headShake",
                            "value": "headShake"
                          },
                          {
                            "label": "swing",
                            "value": "swing"
                          },
                          {
                            "label": "tada",
                            "value": "tada"
                          },
                          {
                            "label": "wobble",
                            "value": "wobble"
                          },
                          {
                            "label": "jello",
                            "value": "jello"
                          },
                          {
                            "label": "bounceIn",
                            "value": "bounceIn"
                          },
                          {
                            "label": "bounceInDown",
                            "value": "bounceInDown"
                          },
                          {
                            "label": "bounceInLeft",
                            "value": "bounceInLeft"
                          },
                          {
                            "label": "bounceInRight",
                            "value": "bounceInRight"
                          },
                          {
                            "label": "bounceInUp",
                            "value": "bounceInUp"
                          },
                          {
                            "label": "fadeIn",
                            "value": "fadeIn"
                          },
                          {
                            "label": "fadeInDown",
                            "value": "fadeInDown"
                          },
                          {
                            "label": "fadeInDownBig",
                            "value": "fadeInDownBig"
                          },
                          {
                            "label": "fadeInLeft",
                            "value": "fadeInLeft"
                          },
                          {
                            "label": "fadeInLeftBig",
                            "value": "fadeInLeftBig"
                          },
                          {
                            "label": "fadeInRight",
                            "value": "fadeInRight"
                          },
                          {
                            "label": "fadeInRightBig",
                            "value": "fadeInRightBig"
                          },
                          {
                            "label": "fadeInUp",
                            "value": "fadeInUp"
                          },
                          {
                            "label": "fadeInUpBig",
                            "value": "fadeInUpBig"
                          },
                          {
                            "label": "flipInX",
                            "value": "flipInX"
                          },
                          {
                            "label": "flipInY",
                            "value": "flipInY"
                          },
                          {
                            "label": "lightSpeedIn",
                            "value": "lightSpeedIn"
                          },
                          {
                            "label": "rotateIn",
                            "value": "rotateIn"
                          },
                          {
                            "label": "rotateInDownLeft",
                            "value": "rotateInDownLeft"
                          },
                          {
                            "label": "rotateInDownRight",
                            "value": "rotateInDownRight"
                          },
                          {
                            "label": "rotateInUpLeft",
                            "value": "rotateInUpLeft"
                          },
                          {
                            "label": "rotateInUpRight",
                            "value": "rotateInUpRight"
                          },
                          {
                            "label": "hinge",
                            "value": "hinge"
                          },
                          {
                            "label": "jackInTheBox",
                            "value": "jackInTheBox"
                          },
                          {
                            "label": "rollIn",
                            "value": "rollIn"
                          },
                          {
                            "label": "zoomIn",
                            "value": "zoomIn"
                          },
                          {
                            "label": "zoomInDown",
                            "value": "zoomInDown"
                          },
                          {
                            "label": "zoomInLeft",
                            "value": "zoomInLeft"
                          },
                          {
                            "label": "zoomInRight",
                            "value": "zoomInRight"
                          },
                          {
                            "label": "zoomInUp",
                            "value": "zoomInUp"
                          },
                          {
                            "label": "slideInDown",
                            "value": "slideInDown"
                          },
                          {
                            "label": "slideInLeft",
                            "value": "slideInLeft"
                          },
                          {
                            "label": "slideInRight",
                            "value": "slideInRight"
                          },
                          {
                            "label": "slideInUp",
                            "value": "slideInUp"
                          },
                          {
                            "label": "heartBeat",
                            "value": "heartBeat"
                          }
                        ]
                      },
                      {
                        "type": "select",
                        "id": "animation_duration",
                        "label": "Animation Duration",
                        "options": [
                          {
                            "value": "1s",
                            "label": "1s"
                          },
                          {
                            "value": "2s",
                            "label": "2s"
                          },
                          {
                            "value": "3s",
                            "label": "3s"
                          }
                        ],
                        "default": "1s"
                      },
                      {
                        "type": "select",
                        "id": "animation_delay",
                        "label": "Animation Delay",
                        "options": [
                          {
                            "value": "0",
                            "label": "0"
                          },
                          {
                            "value": "1",
                            "label": "1s"
                          },
                          {
                            "value": "2",
                            "label": "2s"
                          },
                          {
                            "value": "3",
                            "label": "3s"
                          },
                          {
                            "value": "4",
                            "label": "4s"
                          },
                          {
                            "value": "5",
                            "label": "5s"
                          },
                          {
                            "value": "6",
                            "label": "6s"
                          },
                          {
                            "value": "7",
                            "label": "7s"
                          },
                          {
                            "value": "8",
                            "label": "8s"
                          }
                        ],
                        "default": "0"
                    }
				]
			}
		]
	}
{% endschema %}