diff --git a/.DS_Store b/.DS_Store index c9c43e3..2d7a1e6 100644 Binary files a/.DS_Store and b/.DS_Store differ diff --git a/src/.DS_Store b/src/.DS_Store index ebb5f9b..3fe832f 100644 Binary files a/src/.DS_Store and b/src/.DS_Store differ diff --git "a/src/a\303\261adirID.css" "b/src/a\303\261adirID.css" new file mode 100644 index 0000000..a5f7815 --- /dev/null +++ "b/src/a\303\261adirID.css" @@ -0,0 +1,384 @@ +.fondo-icon2, +.path-253-icon4 { + position: absolute; + right: 0; + max-width: 100%; + overflow: hidden; +} +.fondo-icon2 { + width: calc(100% + 17px); + top: 68px; + left: -17px; + height: 1107px; + object-fit: cover; + opacity: 0.63; + mix-blend-mode: multiply; +} +.path-253-icon4 { + width: 100%; + top: calc(50% - 213.1px); + left: 0; + height: 426.2px; +} +.group-child6 { + position: absolute; + height: calc(100% - 0.3px); + top: 0.26px; + bottom: 0.04px; + left: calc(50% - 3.05px); + width: 6.6px; + background-image: url(./public/rectangle-813@3x.png); + background-size: cover; + background-repeat: no-repeat; + background-position: top; +} +.facebook-inner2 { + position: absolute; + top: calc(50% - 7px); + left: calc(50% - 7px); + width: 14px; + height: 14.5px; +} +.facebook4 { + position: absolute; + top: calc(50% + 56.9px); + left: 244px; + border-radius: var(--br-21xl); + background-color: var(--color-dimgray); + width: 30px; + height: 30px; +} +.vector-smart-object4 { + position: absolute; + top: calc(50% - 7px); + left: calc(50% - 7.5px); + width: 15px; + height: 14px; + object-fit: cover; +} +.instagram4 { + position: absolute; + top: calc(50% + 56.9px); + left: 283px; + border-radius: var(--br-21xl); + background-color: var(--color-dimgray); + width: 31px; + height: 30px; +} +.rectangle-81311-copy-44 { + position: absolute; + top: calc(50% - 7.2px); + left: calc(50% - 6.77px); + width: 14.2px; + height: 13.7px; + background-image: url(./public/rectangle-81311-copy-4@3x.png); + background-size: cover; + background-repeat: no-repeat; + background-position: top; +} +.rectangle-81311-copy-4-wrapper2 { + position: absolute; + height: 100%; + width: 100%; + top: 0; + right: 0; + bottom: 0; + left: 0; + border-radius: var(--br-21xl); + background-color: var(--color-dimgray); +} +.imagemask4 { + position: absolute; + top: calc(50% - 7px); + left: calc(50% - 7px); + width: 14px; + height: 14px; +} +.linkedin4 { + position: absolute; + top: calc(50% + 56.9px); + left: 323px; + width: 30px; + height: 30px; +} +.rectangle-813111-copy-64 { + position: absolute; + height: calc(100% - 2.7px); + width: calc(100% - 0.3px); + top: 1.21px; + right: 0.05px; + bottom: 1.49px; + left: 0.25px; + background-image: url(./public/rectangle-813111-copy-6@3x.png); + background-size: cover; + background-repeat: no-repeat; + background-position: top; +} +.rectangle-813111-copy-6-wrapper2, +.twitter4 { + position: absolute; + top: calc(50% - 7px); + left: calc(50% - 7.5px); + width: 15.4px; + height: 15px; +} +.twitter4 { + top: calc(50% + 56.9px); + left: calc(50% - 601.7px); + border-radius: var(--br-21xl); + background-color: var(--color-dimgray); + width: 31px; + height: 30px; +} +.company4 { + position: absolute; + top: calc(50% - 109.47px); + left: calc(50% + 10.31px); + font-size: var(--font-size-sm); + font-weight: 600; + font-family: var(--font-josefin-sans); + color: var(--color-turquoise); +} +.profile4 { + margin: 0; +} +.profile-about-us-contact-addre4 { + position: absolute; + top: calc(50% - 34.1px); + left: calc(50% + 10.81px); + line-height: 36px; + display: inline-block; + width: 211px; + height: 132.6px; +} +.returns4 { + position: absolute; + top: calc(50% - 109.47px); + left: calc(50% + 335.37px); + font-size: var(--font-size-sm); + font-weight: 600; + font-family: var(--font-josefin-sans); + color: var(--color-turquoise); +} +.faqs-size-guide-contact-us-container4 { + position: absolute; + top: calc(50% - 34.1px); + left: calc(50% + 336.07px); + line-height: 36px; + display: inline-block; + width: 211px; + height: 171.3px; +} +.lorem-ipsum-dolor-container4 { + position: absolute; + top: calc(50% - 58.62px); + left: 240px; + line-height: 20px; +} +.caribbean-house-studio8 { + position: absolute; + top: calc(50% - 129.35px); + left: 240px; + font-size: var(--font-size-5xl); + text-transform: uppercase; + font-family: var(--font-literata); +} +.barrabutom2 { + position: absolute; + width: calc(100% + 12px); + right: -6px; + bottom: -3.2px; + left: -6px; + height: 426.2px; +} +.ingrese-id-de { + position: absolute; + top: 29px; + left: calc(50% - 196px); +} +.path-287 { + border: 2px solid var(--color-dimgray); + outline: 0; + background-color: var(--color-white); + position: absolute; + width: calc(100% - 108px); + top: calc(50% - 35px); + right: 54px; + left: 54px; + box-sizing: border-box; + height: 61px; +} +.acetpar { + position: absolute; + top: calc(50% - 17.5px); + left: calc(50% - 60px); +} +.aceptarbutt { + position: absolute; + bottom: 13px; + left: calc(50% - 111px); + border-radius: var(--br-12xl); + background-color: var(--color-turquoise); + width: 222px; + height: 61px; + cursor: pointer; + text-align: left; + font-size: 29px; + color: var(--color-white); + font-family: var(--font-montserrat); +} +.box { + position: absolute; + top: calc(50% - 306.5px); + left: calc(50% - 232px); + border-radius: 41px; + background-color: var(--color-thistle); + width: 448px; + height: 236px; + text-align: center; + font-size: 34px; + color: var(--color-darkslategray-100); + font-family: var(--font-josefin-sans); +} +.component-1-10-child { + position: absolute; + height: 100%; + width: 100%; + top: 0; + right: 0; + bottom: 0; + left: 0; + box-shadow: 0 6px 12px rgba(0, 0, 0, 0.13); + background-color: var(--color-whitesmoke); +} +.caribbean-house-studio9 { + position: absolute; + width: calc(100% + 1px); + top: calc(50% - 18.5px); + left: 0; + font-weight: 600; + display: inline-block; +} +.logo4 { + position: absolute; + top: calc(50% - 16px); + left: 150px; + width: 472px; + height: 37px; + cursor: pointer; +} +.component-1-10 { + position: absolute; + height: 100%; + width: 100%; + top: 0; + right: 0; + bottom: 0; + left: 0; + text-align: left; + font-size: var(--font-size-18xl); + color: var(--color-darkslategray-200); +} +.inicio4 { + position: absolute; + top: calc(50% - 5px); + left: calc(50% - 201.05px); + cursor: pointer; +} +.catlogo4 { + position: absolute; + top: calc(50% - 8px); + left: calc(50% + 102.95px); +} +.blog4 { + left: calc(50% + 239.95px); +} +.blog4, +.nuestra-historia5, +.seguimiento6 { + position: absolute; + top: calc(50% - 5px); +} +.nuestra-historia5 { + left: calc(50% - 101.05px); + cursor: pointer; +} +.seguimiento6 { + left: calc(50% + 333.95px); + color: var(--color-lightseagreen); +} +.cart-icon4, +.serach-icon4 { + position: absolute; + top: calc(50% - 10px); + left: calc(50% + 474.95px); + width: 23px; + height: 23px; +} +.cart-icon4 { + left: calc(50% + 515.95px); + width: 24px; +} +.login4 { + position: absolute; + top: calc(50% - 7.5px); + left: calc(50% - 23px); + text-transform: uppercase; + font-weight: 600; +} +.login-wrapper2 { + position: absolute; + top: calc(50% - 18px); + right: 246.1px; + background-color: var(--color-darkslategray-100); + width: 130px; + height: 35px; + text-align: left; + font-size: var(--font-size-sm); + color: var(--color-white); +} +.path-74-icon4 { + position: absolute; + top: calc(50% - 13.82px); + left: calc(50% + 530.69px); + width: 11.6px; + height: 11.6px; +} +.div25 { + position: absolute; + top: calc(50% - 13px); + left: calc(50% + 534.95px); + font-size: var(--font-size-3xs); + color: var(--color-white); +} +.logo-icon4 { + position: absolute; + height: calc(100% - 21.3px); + top: 11.15px; + bottom: 10.15px; + left: 13px; + max-height: 100%; + width: 113.1px; +} +.barra-pestaas4 { + position: fixed; + width: calc(100% + 2.1px); + top: -0.5px; + right: -2.1px; + left: 0; + height: 87px; + text-align: center; + font-size: var(--font-size-base); + color: var(--color-darkslategray-100); + font-family: var(--font-josefin-sans); +} +.idaadir { + position: relative; + background-color: var(--color-antiquewhite); + width: 100%; + height: 1503px; + text-align: left; + font-size: var(--font-size-xs); + color: var(--color-white); + font-family: var(--font-montserrat); +} diff --git "a/src/a\303\261adirID.html" "b/src/a\303\261adirID.html" new file mode 100644 index 0000000..3760800 --- /dev/null +++ "b/src/a\303\261adirID.html" @@ -0,0 +1,142 @@ + + + + + + + + + + + + + +
+ + +
+ + +
+ +
+
+ +
+
+
+
+
+
+
+
+
+
+
+
+
COMPANY
+
+

Profile

+

About us

+

Contact

+

Address

+
+
RETURNS
+
+

FAQs

+

Size Guide

+

Contact us

+
+
+

Lorem ipsum dolor sit amet,

+

consetetur sadipscing elitr,

+

sed diam nonumy

+
+
Caribbean House Studio
+
+
+ Ingrese ID de la compra + + +
+ Acetpar +
+
+
+
+
+ +
+
INICIO
+
CATÁLOGO
+
BLOG
+
+ NUESTRA HISTORIA +
+ SEGUIMIENTO + + + + + + + +
1
+ +
+
+ + + + diff --git a/src/colaborador.css b/src/colaborador.css new file mode 100644 index 0000000..b16b391 --- /dev/null +++ b/src/colaborador.css @@ -0,0 +1,101 @@ +body { + font-family: 'Montserrat', sans-serif; + background-color: #FAF4EF; + margin: 0; + display: flex; + justify-content: center; + align-items: center; + height: 100vh; +} + +.background { + position: fixed; + top: 0; + left: 0; + width: 100%; + height: 100%; + background-color: #FAF4EF; + z-index: -1; +} + +.colaborador-container { + background-color: #fff; + padding: 40px 80px; + box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1); + border-radius: 16px; + text-align: center; + width: 80%; + max-width: 800px; +} + +h1 { + font-size: 48px; + margin-bottom: 40px; + color: #333; +} + +.pedido-info { + text-align: left; + margin-bottom: 40px; + font-size: 24px; +} + +.pedido-info p { + margin: 10px 0; +} + +.botones-container { + display: flex; + flex-wrap: wrap; + justify-content: center; + gap: 20px; +} + +.boton { + border: none; + border-radius: 10px; + padding: 30px 40px; + font-size: 32px; + cursor: pointer; + transition: background-color 0.3s; + flex: 1 1 calc(33.333% - 40px); + box-sizing: border-box; + color: #fff; +} + +.verde { + background-color: #009688; +} + +.verde:hover { + background-color: #00796b; +} + +.naranja { + background-color: #D8A379; +} + +.naranja:hover { + background-color: #D8A379; +} + +.gris { + background-color: #BDBDBD; + cursor: not-allowed; +} + +.gris:hover { + background-color: #BDBDBD; +} + +@media (max-width: 768px) { + .boton { + flex: 1 1 calc(50% - 40px); + } +} + +@media (max-width: 480px) { + .boton { + flex: 1 1 100%; + } +} diff --git a/src/colaborador.html b/src/colaborador.html index e4007ad..e226064 100644 --- a/src/colaborador.html +++ b/src/colaborador.html @@ -3,26 +3,42 @@ - - + - - + -
+
+
+

Actualizar Estado del Pedido

+ +
+

ID de Pedido: 12345678

+

Nombre del Producto: Credenza

+

Nombre del Cliente: Juan Quintana

+

Dirección del Cliente: Av. Siempre Viva 742, Springfield, IL, 62704

+
+
- - - - - - - + + + + + + +
diff --git a/src/seguimiento.css b/src/seguimiento.css index 6d8975d..54e359b 100644 --- a/src/seguimiento.css +++ b/src/seguimiento.css @@ -548,7 +548,7 @@ .entregado-icon, .seguimiento4 { position: absolute; - top: calc(50% + 50px); + top: calc(50% + 30px); right: 126.8px; width: 28.1px; height: 29.4px; diff --git a/src/views/seguimiento.ejs b/src/views/seguimiento.ejs index bf7ec00..ac06f28 100644 --- a/src/views/seguimiento.ejs +++ b/src/views/seguimiento.ejs @@ -1,3 +1,18 @@ +<% +const descripciones = { + 1: 'El pedido ha sido confirmado y está en proceso de preparación.', + 2: 'Todos los insumos están listos para comenzar la fabricación.', + 3: 'El producto está en proceso de maquila, se está llevando a cabo la producción.', + 4: 'El producto está siendo barnizado para asegurar su acabado y durabilidad.', + 5: 'El producto está siendo armado por nuestros técnicos.', + 6: 'El producto ha sido empaquetado y enviado a la dirección indicada. Se espera que llegue en los próximos días.', + 7: 'El producto ha sido entregado al cliente.' +}; + +const etapaActual = etapa; // Aquí 'etapa' es el valor obtenido de la base de datos que indica la etapa actual del pedido +%> + + @@ -80,12 +95,12 @@ Días
-
+
+
Detalles de la Etapa Actual
- El mueble ha sido empaquetado y enviado a la dirección indicada. Se espera que llegue en los próximos días. + <%= descripciones[etapa] %>
-
@@ -93,16 +108,16 @@
Estado del Pedido
- <% for (let i = 1; i <= 7; i++) { %> -
- - -
- <% } %> -
-
-
-
+ <% for (let i = 1; i <= 7; i++) { %> +
+ + +
+ <% } %> + +
+
+