InduJyV – Tienda en línea de ropa

InduJyV

• Inicio
• Productos
• Nosotros
• Contacto

Productos

Camisa casual

$25.99

Comprar

Pantalón de mezclilla

$39.99

Comprar

Sudadera con capucha

$45.99

Comprar

Carrito de compras

Total: $0

Comprar ahora

http://script.js
* {
box-sizing: border-box;
margin: 0;
padding: 0;
}

body {
font-family: sans-serif;
}

header {
background-color: #FF6464;
color: white;
display: flex;
justify-content: space-between;
align-items: center;
padding: 1rem;
}

header h1 {
font-size: 2rem;
}

nav ul {
list-style: none;
display: flex;
}

nav li {
margin-right: 1rem;
}

nav a {
color: white;
text-decoration: none;
font-weight: bold;
}

main {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
padding: 1rem;
}

.productos {
width: 70%;
}

.producto {
background-color: white;
border: 1px solid #ccc;
border-radius: 5px;
padding: 1rem;
margin-bottom: 1rem;
width: 30%;
}

.product
const productos = [
{
nombre: «Camisa casual»,
precio: 25.99
},
{
nombre: «Pantalón de mezclilla»,
precio: 39.99
},
{
nombre: «Sudadera con capucha»,
precio: 45.99
}
];

const carrito = [];

const actualizarCarrito = () => {
const ulCarrito = document.querySelector(«.productos-carrito»);
const totalCarrito = document.querySelector(«.total-carrito»);
ulCarrito.innerHTML = «»;
let total = 0;
carrito.forEach(producto => {
const li = document.createElement(«li»);
li.innerText = `${producto.nombre} – $${producto.precio}`;
ulCarrito.appendChild(li);
total += producto.precio;
});
totalCarrito.innerText = `Total: $${total.toFixed(2)}`;
};

document.addEventListener(«DOMContentLoaded», () => {
const botonesComprar = document.querySelectorAll(«.comprar»);
botonesComprar.forEach((boton, index) => {
boton.addEventListener(«click», () => {
carrito.push(productos[index]);
actualizarCarrito();
});
});

const botonComprarCarrito = document.querySelector(«.comprar-carrito»);
botonComprarCarrito.addEventListener(«click», () => {
carrito.length = 0;
actualizarCarrito();
alert(«¡Gracias por su compra!»);
});
});