fullstock-static-files/order-confirmation.html at main · codeableorg/fullstock-static-files · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
<!doctype html>
<html lang="es">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Full Stock | Confirmación de pedido</title>
    <!-- Google Fonts preconnect for performance optimization -->
    <link rel="preconnect" href="https://fonts.googleapis.com" />
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
    <!-- Google Fonts stylesheet -->
    <link
      href="https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Lora:ital,wght@0,400..700;1,400..700&family=Protest+Guerrilla&family=Source+Code+Pro:ital,wght@0,200..900;1,200..900&display=swap"
      rel="stylesheet"
    />
    <link rel="stylesheet" href="/css/index.css" />
  </head>

  <body>
    <div class="root">
      <header class="root__header">
        <div class="container header-main">
          <div class="header-main__top">
            <a href="/index.html">
              <img
                src="/images/fullstock-logo.svg"
                alt="FullStock inicio"
                width="128"
                height="32"
              />
            </a>
            <div class="header-actions">
              <a
                href="/cart.html"
                class="button button--ghost button--xl-icon header-actions__cart"
                aria-label="Carrito de compras"
              >
                <img src="/images/icons/cart.svg" alt="Carrito de compras" />
                <span class="header-actions__cart-badge">0</span>
              </a>
            </div>
          </div>
          <div class="separator header-main__separator"></div>
          <nav aria-label="Navegación principal" class="main-nav">
            <ul class="main-nav__list" role="menubar">
              <li class="main-nav__item" role="none">
                <a href="/category.html" role="menuitem" class="main-nav__link"
                  >Polos</a
                >
              </li>
              <li class="main-nav__item" role="none">
                <a href="/category.html" role="menuitem" class="main-nav__link"
                  >Tazas</a
                >
              </li>
              <li class="main-nav__item" role="none">
                <a href="/category.html" role="menuitem" class="main-nav__link"
                  >Stickers</a
                >
              </li>
            </ul>
          </nav>
        </div>
      </header>
      <main class="root__main">
        <section class="order-confirmation">
          <div class="container">
            <h1 class="order-confirmation__title">
              ¡Muchas gracias por tu compra!
            </h1>
            <p class="order-confirmation__heading">Tu orden está en camino</p>
            <p class="order-confirmation__description">
              Llegaremos a la puerta de tu domicilio lo antes posible
            </p>
            <p class="order-confirmation__tracking-label">Número de orden</p>
            <p class="order-confirmation__tracking-code">1</p>
          </div>
        </section>
      </main>
      <footer class="root__footer">
        <div class="container">
          <section class="section footer__section">
            <div class="footer__links">
              <ul role="list" class="footer__list">
                <li class="footer__title">Tienda</li>
                <li><a href="/category.html">Polos</a></li>
                <li><a href="/category.html">Tazas</a></li>
                <li><a href="/category.html">Stickers</a></li>
              </ul>
              <ul role="list" class="footer__list">
                <li class="footer__title">Compañía</li>
                <li><a href="/about.html">Quienes somos</a></li>
                <li>
                  <a href="/terms.html">Términos y condiciones</a>
                </li>
                <li><a href="/privacy.html">Privacidad</a></li>
              </ul>
              <ul role="list" class="footer__list">
                <li class="footer__title">Conecta</li>
                <li><a href="https://wa.me/" target="_blank">WhatsApp</a></li>
                <li>
                  <a href="https://www.facebook.com/" target="_blank"
                    >Facebook</a
                  >
                </li>
                <li>
                  <a href="https://www.instagram.com/" target="_blank"
                    >Instagram</a
                  >
                </li>
              </ul>
            </div>
            <div class="footer__newsletter">
              <p class="footer__newsletter-title">
                Suscríbete a nuestro boletín
              </p>
              <p class="footer__newsletter-text">
                Recibe las últimas ofertas y descuentos en tu correo
                semanalmente.
              </p>
              <form class="footer__form">
                <input
                  type="email"
                  aria-label="Correo"
                  name="email"
                  required
                  placeholder="ejemplo@mail.com"
                  autocomplete="email"
                />
                <button
                  class="button button--lg button--secondary"
                  type="submit"
                >
                  Suscribirse
                </button>
              </form>
            </div>
          </section>
          <div class="separator"></div>
          <small class="footer__copyright">
            Todos los derechos reservados © Full Stock
          </small>
        </div>
      </footer>
    </div>
  </body>
</html>