<section id="text-and-image-side-by-side-{{ section.id }}" class="text-and-image-side-by-side index-section" data-section-id="{{ section.id }}" data-section-type="image-section">
  <div class="row">
      <div class="desktop-6 tablet-2 mobile-2">
              <h2>{{section.settings.heading}}</h2>
              <div class="h2-border"></div>
              <p>{{section.settings.content}}</p>
              <div class="cta">
                  <a href="{{section.settings.button_url_link}}">{{section.settings.button_text}}</a>
              </div>
      </div>
      <div class="desktop-6 tablet-2 mobile-2">
          {%- if section.settings.image -%}
              <img src="{{ section.settings.image | img_url: 'master' }}" />
          {%- else -%}
              {{ 'image' | placeholder_svg_tag: 'placeholder-svg' }}
          {%- endif -%}
      </div>
  </div>

</section>

{% schema %}
  {
      "name": "Image / Text side by side",
      "settings": [
          {
              "type": "text",
              "id": "heading",
              "label": "Heading",
              "default": "Heading here"
          },
          {
              "type": "textarea",
              "id": "content",
              "label": "Content here",
              "default": "It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here,"
          },
          {
              "type": "text",
              "id": "button_text",
              "label": "Button text here",
              "default": "Shop now"
          },
          {
              "type": "url",
              "id": "button_url_link",
              "label": "Link for button"
          },
          {
              "type": "image_picker",
              "id": "image",
              "label": "Image on the side"
          }

      ],
      "presets": [
          {
          "name": "Image / Text side by side",
          "category": "Image"
          }
      ]
  }
{% endschema %}