`sections/password.liquid`

112 lines
<script
  type="application/json"
  data-section-type="password"
  data-section-id="{{ section.id }}"
></script>

<div class="password-page main-content">
  <div class="password-page-header">
    <div class="password-page-inner">
      <a href="#modal-login" class="admin-login-modal">
        {{ 'general.password_page.password_link' | t }}
      </a>
    </div>
  </div>

  <div class="password-page-content">
    <div class="password-page-inner">
      <div class="password-page-logo">
        <header class="main-header" role="banner">
          <div class="password-branding">
            <a class="logo-link" href="{{ routes.root_url }}">
              <h1>{{ shop.name }}</h1>
            </a>
          </div>
        </header>
      </div>
      <div class="password-page-signup-form">
        <div class="password-page-form-header">
          <h2>{{ 'general.password_page.opening_soon' | t }}</h2>

          {% unless shop.password_message == blank %}
            <p class="password-page-message">
              {{ shop.password_message }}
            </p>
          {% endunless %}
        </div>

        {% form 'customer', class: 'newsletter-signup' %}
          {{ form.errors | default_errors }}

          {% if form.posted_successfully? %}
            <p class="form-success">{{ 'general.password_page.signup_form_success' | t }}</p>
          {% else %}
            {% if section.settings.newsletter_text != blank %}
              {{ section.settings.newsletter_text }}
            {% endif %}

            <div class="password-page-field-wrap">
              <input class="password-page-input input" type="text" name="contact[email]" id="email" placeholder="{{ 'general.password_page.signup_form_email_placeholder' | t }}">
              <input class="submit input" name="commit" type="submit" value="{{ 'general.password_page.signup_form_submit' | t }}">
              <input type="hidden" class="input" name="contact[tags]" value="prospect, password page">
            </div>
          {% endif %}
        {% endform %}
      </div>
    </div>
  </div>

  <div class="password-page-footer" role="contentinfo">
    <div class="password-page-inner">
      {% capture shopify %}
        <a
          class="shopify-link"
          href="//www.shopify.com/"
          rel="nofollow"
          target="_blank"
          title="Create your own online store with Shopify"
        >
          <span class="shopify-name">Shopify</span>
        </a>
      {% endcapture %}
      {{ 'general.password_page.powered_by_shopify_html' | t: shopify: shopify }}
    </div>
  </div>

</div>

<div id="modal-login" class="password-page-modal-wrapper">
  <div class="password-page-modal">
    <div class="module header">
      <p class="form-title">{{ 'general.password_page.login_form_heading' | t }}</p>
    </div>

    {% form 'storefront_password' %}
      {{ form.errors | default_errors }}
      <div class="password-page-field-wrap" {% if form.errors %}data-open-modal{% endif %}>
        <input class="password-page-input input" type="password" name="password" id="password" placeholder="{{ 'general.password_page.login_form_password_label' | t }}" autofocus>
        <input class="submit input" name="submit" type="submit" value="{{ 'general.password_page.login_form_submit' | t }}">
      </div>
    {% endform %}
  </div>
</div>

{% schema %}
{
  "name": "Password pages",
  "class": "section-password",
  "settings": [
    {
      "type": "header",
      "content": "Newsletter"
    },
    {
      "id": "newsletter_text",
      "type": "richtext",
      "label": "Text",
      "default": "<p>Find out when we open:</p>"
    }
  ]
}

{% endschema %}