Untitled

{% form 'customer' %}
  {% if form.errors %}
    <div class="text-theme-basic needs-attention">
      {{ form.errors | default_errors }}
    </div>
  {% endif %}

  {% if form.posted_successfully? %}
    <p class="mb-5 text-theme-basic">
      {{ 'general.newsletter_form.confirmation' | t }}
    </p>
  {% else %}
    <input
      type="hidden"
      name="contact[tags]"
      value="newsletter"
    >
    <label for="Email" class="">
      {{ 'general.newsletter_form.newsletter_email' | t }}
    </label>
    <div class="grid grid-cols-[minmax(0,_1fr)_auto]">
      <input
        type="email"
        name="contact[email]"
        id="Email"
        class="
          bg-none border-l-0 border-t-0 border-r-0 pl-0 border-b outline-none {% if section_color == "primary" %}
            border-black
          {% else %}
          border-white
          {% endif %} rounded-none text-sm
        "
        value="{% if customer %}{{ customer.email }}{% endif %}"
        placeholder="{{ 'general.newsletter_form.newsletter_email' | t }}"
        autocorrect="off"
        autocapitalize="off"
      >
      <button
        type="submit"
        class="
          rounded-[4px] border-black border-2
          py-[10px] w-fit px-6 ml-6 {% if section_color == "secondary" %}
            bg-white text-black hover:bg-black hover:text-white
          {% else %}
            bg-black text-white hover:bg-white hover:text-black
          {% endif %} transition-all duration-200
        "
      >
        <span class="text-theme-basic">
          {{ 'general.newsletter_form.submit' | t }}
        </span>
      </button>
    </div>
  {% endif %}
{% endform %}