Merge pull request #280 from codeableorg/fix/UI-update-for-responsive-design-and-readme-update

Fix/UI update for responsive design and readme update

Author: Vazzukoff

README.md

@@ -309,9 +309,10 @@ npm run test:e2e
 - **Sistema de Variantes de Producto**: Implementación completa del sistema de variantes con base de datos (Prisma schema)
 - **Carrito con Variantes**: Actualización del carrito para mostrar información detallada de variantes seleccionadas
 
-### 👨‍💻 Sebastian
-- **UI/UX Design & Responsive Design**: Diseño e implementación de la interfaz adaptativa con Tailwind CSS
-- **Chat Bot AI**: Integración con Google Gemini para el asistente virtual y sistema de recomendaciones
+### 👨‍💻 Sebastián
+- **UI/UX Design & Responsive Design**: Implementación con Tailwind CSS y ajustes ligeros en 'initial_data.ts' y servicios para la correcta comunicación backend–frontend.
+- **Actualización del ChatBot**: Actualización con nuevo contexto, prompts de comportamiento, estrategia de ventas, ejemplos de respuesta y lógica de recomendaciones.
+
 
 ### 👩‍💻 Janet
 - **Modificacion del archivo de data inicial**: Modificación del archivo 'initial_data.ts' para las diferentes variables de productos

src/routes/product/index.tsx

@@ -106,13 +106,13 @@ export default function Product({ loaderData }: Route.ComponentProps) {
                     <p className="text-sm font-semibold text-accent-foreground mb-2">
                       {attributeName.charAt(0).toUpperCase() + attributeName.slice(1)}
                     </p>
-                    <div className="flex gap-2">
+                    <div className="flex flex-wrap gap-2">
                       {variants!.map((variant) => (
                         <Button
                           key={variant.id}
                           variant={selectedVariant === variant.id ? "default" : "secondary"}
                           size="lg"
-                          className="w-[70px]"
+                          className="flex-1 min-w-[80px] sm:min-w-[100px] md:flex-none md:w-[70px]"
                           onClick={() => handleVariantChange(variant.id)}
                         >
                           {variant.value}