{
  "manifest": {
    "id": "developer-starter",
    "name": "Developer Starter",
    "engine": "nunjucks",
    "engine_version": "1.0",
    "context_version": "1",
    "pages": {
      "home": "templates/home.njk",
      "product": "templates/product.njk"
    },
    "page_settings": {
      "home": {
        "section_order": [
          "Header",
          "Hero",
          "Products",
          "Footer"
        ]
      },
      "product": {
        "section_order": [
          "Header",
          "Product detail",
          "Footer"
        ]
      }
    },
    "sections": {
      "Header": {
        "path": "sections/header.njk"
      },
      "Hero": {
        "path": "sections/hero.njk",
        "settings": {
          "eyebrow": "THE COLLECTION"
        }
      },
      "Products": {
        "path": "sections/products.njk",
        "settings": {
          "block_order": [
            "Product list"
          ]
        }
      },
      "Product detail": {
        "path": "sections/product-detail.njk"
      },
      "Footer": {
        "path": "sections/footer.njk"
      }
    },
    "blocks": {
      "Product list": {
        "path": "blocks/product-list.njk",
        "settings": {
          "show_stock": true
        }
      }
    },
    "snippets": {
      "Product card": {
        "path": "snippets/product-card.njk"
      }
    },
    "settings_schema": [
      {
        "id": "accent",
        "type": "color",
        "label": "Accent color",
        "default": "#6E56CF"
      },
      {
        "id": "surface",
        "type": "color",
        "label": "Background",
        "default": "#11121A"
      },
      {
        "id": "text",
        "type": "color",
        "label": "Text color",
        "default": "#F4F4FA"
      },
      {
        "id": "hero_title",
        "type": "text",
        "label": "Hero title",
        "default": "Something worth discovering."
      },
      {
        "id": "hero_copy",
        "type": "text",
        "label": "Hero description",
        "default": "Explore our collection and find your next essential."
      },
      {
        "id": "show_description",
        "type": "checkbox",
        "label": "Show product summaries",
        "default": true
      },
      {
        "id": "card_style",
        "type": "select",
        "label": "Card style",
        "default": "bordered",
        "options": [
          {
            "value": "bordered",
            "label": "Bordered"
          },
          {
            "value": "minimal",
            "label": "Minimal"
          }
        ]
      }
    ]
  },
  "files": {
    "assets/product.css": ".starter-product { padding: 40px 0 64px; }\n.starter-product-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 40px; margin: 28px 0; }\n.starter-product-image { width: 100%; max-height: 440px; object-fit: contain; border-radius: 12px; }\n.starter-purchase { align-self: start; border: 1px solid #ffffff25; border-radius: 12px; padding: 24px; }\n.starter-purchase form { display: grid; gap: 18px; margin-bottom: 20px; }\n.starter-purchase label { display: grid; gap: 6px; }\n.starter-purchase select, .starter-purchase input { max-width: 100%; width: 100%; padding: 10px; color: var(--sx-text); background: var(--sx-surface); border: 1px solid #ffffff45; border-radius: 6px; }\n.starter-purchase button:disabled { opacity: .5; cursor: not-allowed; }\n.starter-description img { max-width: 100%; height: auto; }\n@media (max-width: 700px) { .starter-product-grid { grid-template-columns: 1fr; gap: 24px; } }\n",
    "assets/theme.css": ".starter-theme { min-height: 100vh; background: var(--sx-surface); color: var(--sx-text); font-family: system-ui, sans-serif; line-height: 1.65; }\n.starter-theme * { box-sizing: border-box; }\n.starter-theme a { color: inherit; text-decoration: none; }\n.starter-theme button, .starter-theme input, .starter-theme select { font: inherit; }\n.starter-shell { max-width: 1120px; margin: auto; padding: 0 24px; }\n.starter-header, .starter-brand, .starter-header nav, .starter-footer { display: flex; align-items: center; flex-wrap: wrap; gap: 24px; }\n.starter-header { justify-content: space-between; padding: 28px 0; border-bottom: 1px solid #ffffff20; }\n.starter-brand { font-size: 20px; font-weight: 750; gap: 10px; }\n.starter-header nav button { color: inherit; background: none; border: 0; cursor: pointer; padding: 0; }\n.starter-hero { padding: 88px 0; max-width: 760px; }\n.starter-eyebrow { color: var(--sx-accent); font-size: 12px; font-weight: 700; letter-spacing: .15em; }\n.starter-hero h1 { font-size: clamp(36px, 6vw, 68px); line-height: 1.08; letter-spacing: -.045em; margin: 16px 0 24px; }\n.starter-hero > p:not(.starter-eyebrow) { opacity: .8; max-width: 560px; font-size: 18px; }\n.starter-button { display: inline-block; background: var(--sx-accent); color: #fff !important; padding: 12px 22px; border: 0; border-radius: 8px; font-weight: 700; cursor: pointer; }\n.starter-products { padding: 16px 0 64px; scroll-margin-top: 24px; }\n.starter-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }\n.starter-card { padding: 20px; min-width: 0; border-radius: 12px; }\n.starter-card--bordered { border: 1px solid #ffffff25; }\n.starter-card img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 8px; }\n.starter-card h3 { font-size: 18px; margin-bottom: 6px; overflow-wrap: anywhere; }\n.starter-card p, .starter-card small { opacity: .75; }\n.starter-footer { border-top: 1px solid #ffffff20; padding: 28px 0; font-size: 14px; }\n.starter-footer span { margin-right: auto; }\n.starter-theme a:focus-visible, .starter-theme button:focus-visible { outline: 3px solid var(--sx-accent); outline-offset: 4px; }\n@media (max-width: 760px) { .starter-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }\n@media (max-width: 480px) { .starter-grid { grid-template-columns: 1fr; } .starter-shell { padding: 0 18px; } .starter-hero { padding: 52px 0; } .starter-header nav { gap: 16px; font-size: 14px; } }\n",
    "blocks/product-list.njk": "<div class=\"starter-grid\">\n  {% for product in products %}\n    {% render_snippet \"Product card\", product=product, show_stock=properties.show_stock %}\n  {% else %}\n    <p>No products are available yet.</p>\n  {% endfor %}\n</div>\n",
    "layouts/base.njk": "<div class=\"sx-theme starter-theme\">\n  <div class=\"starter-shell\">\n    {% block content %}{% endblock %}\n  </div>\n</div>\n",
    "locales/en.json": "{\n  \"catalog\": {\n    \"title\": \"Explore the collection\",\n    \"count\": \"{count} products\"\n  }\n}\n",
    "sections/footer.njk": "<footer class=\"starter-footer\">\n  <span>{{ shop.name }}</span>\n  <a href=\"{{ routes.terms }}\">Terms</a>\n  {% if shop.contact_url %}<a href=\"{{ shop.contact_url }}\">Contact</a>{% endif %}\n</footer>\n",
    "sections/header.njk": "<header class=\"starter-header\">\n  <a class=\"starter-brand\" href=\"{{ routes.home }}\">\n    {% if shop.logo_url %}<img src=\"{{ shop.logo_url }}\" alt=\"{{ shop.name }}\" width=\"36\" height=\"36\">{% endif %}\n    <span>{{ shop.name }}</span>\n  </a>\n  <nav aria-label=\"Store navigation\">\n    <a href=\"{{ routes.home }}#products\">Products</a>\n    {% if shop.contact_url %}<a href=\"{{ shop.contact_url }}\">Contact</a>{% endif %}\n    <button type=\"button\" data-sx-track-order>Track order</button>\n  </nav>\n</header>\n",
    "sections/hero.njk": "<section class=\"starter-hero\">\n  <p class=\"starter-eyebrow\">{{ settings.eyebrow }}</p>\n  <h1>{{ themeProperties.hero_title }}</h1>\n  <p>{{ themeProperties.hero_copy }}</p>\n  <a class=\"starter-button\" href=\"#products\">Explore products</a>\n</section>\n",
    "sections/product-detail.njk": "<main class=\"starter-product\">\n  <a href=\"{{ routes.home }}\">Back to {{ shop.name }}</a>\n  <div class=\"starter-product-grid\">\n    <div>\n      {% if product.image_url %}<img class=\"starter-product-image\" src=\"{{ product.image_url }}\" alt=\"{{ product.name }}\" data-sx-product-image>{% endif %}\n      <h1>{{ product.name }}</h1>\n      <div class=\"starter-description\">{{ product.description_html | default(product.description) }}</div>\n      {% for tab in product.description_tabs %}\n        <section><h2>{{ tab.title }}</h2><div>{{ tab.content_html | default(tab.content) }}</div></section>\n      {% endfor %}\n    </div>\n    <aside class=\"starter-purchase\">\n      <h2>Make it yours</h2>\n      <form data-sx-product-form data-sx-variants=\"{{ product.variants | dump }}\">\n        <label>Option\n          <select name=\"variant\" data-sx-variant>\n            {% for variant in product.variants %}\n              <option value=\"{{ variant.index }}\">{{ variant.name }} - {{ variant.price_display }}</option>\n            {% endfor %}\n          </select>\n        </label>\n        <label>Quantity <input type=\"number\" name=\"quantity\" value=\"1\" min=\"1\" max=\"25\" data-sx-quantity></label>\n        <strong data-sx-total>{{ product.display_price }}</strong>\n        <p data-sx-availability>{{ product.stock_label }}</p>\n        <button class=\"starter-button\" type=\"submit\" data-sx-checkout-button>Continue to checkout</button>\n      </form>\n      <a href=\"{{ product.checkout_url }}\">Open checkout directly</a>\n    </aside>\n  </div>\n  {% if product.terms_html or product.terms %}<section><h2>Terms</h2><div>{{ product.terms_html | default(product.terms) }}</div></section>{% endif %}\n  {% if product.review_count %}\n    <section><h2>Customer reviews</h2>\n      {% for review in product.reviews %}<article><strong>{{ review.rating }} / 5</strong><p>{{ review.comment }}</p></article>{% endfor %}\n    </section>\n  {% endif %}\n</main>\n",
    "sections/products.njk": "<section id=\"products\" class=\"starter-products\">\n  <h2>Explore the collection</h2>\n  {% for block_name in settings.block_order %}\n    {% render_block block_name %}\n  {% endfor %}\n</section>\n",
    "snippets/product-card.njk": "<article class=\"starter-card starter-card--{{ themeProperties.card_style }}\">\n  <a href=\"{{ product.url }}\">\n    {% if product.image_url %}<img src=\"{{ product.image_url }}\" alt=\"{{ product.name }}\" loading=\"lazy\">{% endif %}\n    <h3>{{ product.name }}</h3>\n    <strong>{{ product.display_price }}</strong>\n  </a>\n  {% if themeProperties.show_description %}<p>{{ product.description }}</p>{% endif %}\n  {% if show_stock %}<small>{{ product.stock_label }}</small>{% endif %}\n</article>\n",
    "templates/home.njk": "{% extends \"layouts/base.njk\" %}\n{% block content %}\n  {% for section_name in settings.section_order %}\n    {% render_section section_name %}\n  {% endfor %}\n{% endblock %}\n",
    "templates/product.njk": "{% extends \"layouts/base.njk\" %}\n{% block content %}\n  {% for section_name in settings.section_order %}\n    {% render_section section_name %}\n  {% endfor %}\n{% endblock %}\n"
  },
  "settings": {
    "accent": "#6E56CF",
    "surface": "#11121A",
    "text": "#F4F4FA",
    "hero_title": "Something worth discovering.",
    "hero_copy": "Explore our collection and find your next essential.",
    "show_description": true,
    "card_style": "bordered"
  }
}