From 4b5d34e930eb9299db2de32c272bf0c7130a9cfd Mon Sep 17 00:00:00 2001
From: devops <cristiancruz0529@gmail.com>
Date: Sun, 12 Jul 2026 05:31:29 +0000
Subject: [PATCH] Actualizar workloads/ecommerce/index.html

---
 workloads/ecommerce/index.html | 41 ++++++++++++++++++++++++++++++----
 1 file changed, 37 insertions(+), 4 deletions(-)
diff --git a/workloads/ecommerce/index.html b/workloads/ecommerce/index.html
index 9940df6..b35a0b5 100644
--- a/workloads/ecommerce/index.html
+++ b/workloads/ecommerce/index.html
@@ -1,8 +1,41 @@
 <!DOCTYPE html>
-<html>
-<head><title>CruzCloud Shop</title></head>
+<html lang="es">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>CruzCloud Shop</title>
+    <style>
+        body { font-family: 'Proxima Nova', -apple-system, Roboto, Arial, sans-serif; margin: 0; background-color: #ebebeb; color: #333; }
+        .header { background-color: #fff159; padding: 15px; display: flex; justify-content: center; }
+        .search-bar { width: 60%; padding: 12px; border: 1px solid #ccc; border-radius: 2px; font-size: 16px; box-shadow: 0 1px 2px 0 rgba(0,0,0,.1); }
+        .container { max-width: 1000px; margin: 40px auto; background: #fff; border-radius: 4px; box-shadow: 0 1px 2px 0 rgba(0,0,0,.1); display: flex; padding: 20px; }
+        .product-image { flex: 1; text-align: center; padding: 20px; }
+        .product-image img { max-width: 100%; border-radius: 4px; }
+        .product-details { flex: 1; padding: 20px; display: flex; flex-direction: column; }
+        .condition { font-size: 14px; color: rgba(0,0,0,.55); margin-bottom: 5px; }
+        .title { font-size: 22px; font-weight: 600; margin: 0 0 15px 0; }
+        .price { font-size: 36px; font-weight: 300; margin: 0 0 20px 0; }
+        .shipping { color: #00a650; font-weight: 600; margin-bottom: 20px; display: flex; align-items: center; }
+        .btn-buy { background-color: #3483fa; color: #fff; border: none; border-radius: 6px; padding: 16px; font-size: 16px; font-weight: 600; cursor: pointer; text-align: center; transition: background-color .2s; }
+        .btn-buy:hover { background-color: #2968c8; }
+        @media (max-width: 768px) { .container { flex-direction: column; } .search-bar { width: 90%; } }
+    </style>
+</head>
 <body>
-    <h1>Bienvenido al E-commerce de CruzCloud</h1>
-    <p>El frontend personalizado está funcionando.</p>
+    <header class="header">
+        <input type="text" class="search-bar" placeholder="Buscar productos, marcas y más...">
+    </header>
+    <main class="container">
+        <div class="product-image">
+            <img src="https://m.media-amazon.com/images/I/61y88qEwHPL._AC_SL1500_.jpg" alt="ZimaBoard 832">
+        </div>
+        <div class="product-details">
+            <span class="condition">Nuevo | +1000 vendidos</span>
+            <h1 class="title">Servidor ZimaBoard 832 - Single Board Server, Personal NAS</h1>
+            <p class="price">$ 199.00</p>
+            <p class="shipping">Llega gratis mañana</p>
+            <button class="btn-buy">Comprar ahora</button>
+        </div>
+    </main>
 </body>
 </html>
\ No newline at end of file
