Cacher is the code snippet organizer for pro developers

<div class="home-promotion">
  <div class="page-width">
    {% if section.settings.title != blank %}
      <div class="section-header text-center">
        <h2>{{ section.settings.title | escape }}</h2>
      </div>
    {% endif %}

    {% case section.settings.grid %}
      {% when '2' %}
        {%- assign grid_item_width = 'medium-up--one-half' -%}
        {%- assign image_size = '540x600' -%}
      {% when '3' %}
        {%- assign grid_item_width = 'small--one-half medium-up--one-third' -%}
        {%- assign image_size = '345x550' -%}
      {% when '4' %}
        {%- assign grid_item_width = 'small--one-half medium-up--one-quarter' -%}
        {%- assign image_size = '250x' -%}
      {% when '5' %}
        {%- assign grid_item_width = 'small--one-half medium-up--one-fifth' -%}
        {%- assign image_size = '195x' -%}
    {% endcase %}

    <div class="grid">
      {% for block in section.blocks %}
      <div class="grid__item {{ grid_item_width }}">
        <div class="promo-block">
          {{ block.settings.promo-image | img_url: image_size | img_tag: block.settings.image.alt }}
          <div class="caption">
            <div class="heading">{{ block.settings.caption-head }}</div>
            <span class="body">{{ block.settings.caption-text }}</span>
            <a href="{{ block.settings.link }}">Learn More</a>
          </div>
        </div>
      </div>
      {% endfor %}
    </div>
  </div>
</div>



{% schema %}
  {
    "name": "Custom Section",
    "class": "index-section",
    "max_blocks": 10,
    "settings": [
      {
        "type": "text",
        "id": "title",
        "label": "Section Heading",
        "default": "Default Section Heading"
      },
      {
        "type": "select",
        "id": "grid",
        "label": "Columns per row",
        "default": "3",
        "options": [
          {
            "value": "2",
            "label": "2"
          },
          {
            "value": "3",
            "label": "3"
          },
          {
            "value": "4",
            "label": "4"
          },
          {
            "value": "5",
            "label": "5"
          }
        ]
      }
    ],
    "blocks": [
      {
        "type": "custom-block",
        "name": "Custom Block",
        "settings": [
          {
            "type": "text",
            "id": "caption-head",
            "label": "Caption Heading",
            "default": "Default Heading"
          },
          {
            "type": "richtext",
            "id": "quote",
            "label": "Text",
            "default": "<p>Default Text.</p>"
          },
          {
            "type": "image_picker",
            "id": "promo-image",
            "label": "Promo Image"
          },
          {
            "type": "url",
            "id": "link",
            "label": "Link"
          }
        ]
      }
    ],
    "presets": [
      {
        "name": "Custom Section",
        "blocks": [
          {
            "type": "custom-block"
          },
          {
            "type": "custom-block"
          },
          {
            "type": "custom-block"
          }
        ]
      }
    ]
  }
{% endschema %}