fix(ecommerce): saca la barra flotante de "Añadir al carrito" en mobile
Pedido del usuario con capturas reales: la barra fija seguía superponiéndose sobre contenido de abajo al scrollear (ej. sobre la tarjeta de "También te puede interesar"), incluso después de varias vueltas ajustando cuándo debía aparecer/ocultarse. En vez de seguir parchando esa lógica, se saca la barra flotante por completo -- queda un solo botón "Añadir al carrito", visible en su lugar normal dentro de la página también en mobile (sin duplicar), igual que la mayoría de tiendas reales. Se borra components/product/mobile-add-to-cart.tsx (ya sin uso) y el id="product-buy-button"/id="recommendations-section" que solo existían para el IntersectionObserver de ese componente. Co-Authored-By: Claude Sonnet 5 <[email protected]> Claude-Session: https://claude.ai/code/session_012Y4df3Z7odr9Cg8F2nw6uV
This commit is contained in:
1 parent
972b11772a
commit
5c79cc3345
3 files changed
+6
-105
No files matched your search
@@ -1,7 +1,6 @@
|
||||
import type { Metadata } from "next";
|
||||
import { notFound } from "next/navigation";
|
||||
import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from "@/components/ui/accordion";
|
||||
import { MobileAddToCart } from "@/components/product/mobile-add-to-cart";
|
||||
import { ProductCard } from "@/components/product/product-card";
|
||||
import { ProductCarousel } from "@/components/product/product-carousel";
|
||||
import { ProductGallery } from "@/components/product/product-gallery";
|
||||
@@ -49,8 +48,7 @@ export default async function ProductPage({ params }: ProductPageProps) {
|
||||
apretado contra el texto o cortado por el panel de zoom de al
|
||||
lado (ver ProductGallery). Por debajo de xl, el buy box cae al
|
||||
flujo normal en la 2da columna, sin duplicar el componente en
|
||||
el DOM (evita el id="product-buy-button" repetido que rompería
|
||||
el IntersectionObserver de MobileAddToCart).
|
||||
el DOM.
|
||||
El buy box ocupa las 2 filas (xl:row-span-2) para no quedar
|
||||
atado a la altura de galería+descripción -- "También te puede
|
||||
gustar" pasa a ser la 2da fila debajo de esas dos columnas
|
||||
@@ -107,13 +105,12 @@ export default async function ProductPage({ params }: ProductPageProps) {
|
||||
carrusel. Confirmado en vivo: sin min-w-0 el grid medía 783px
|
||||
en un viewport real de 380px; con min-w-0 vuelve a 380px. */}
|
||||
{recommended.length > 0 && (
|
||||
<div id="recommendations-section" className="min-w-0 pb-16 lg:col-span-2">
|
||||
<div className="min-w-0 pb-16 lg:col-span-2">
|
||||
<h2 className="mb-7 text-3xl font-black">También te puede gustar</h2>
|
||||
<ProductCarousel products={recommended} />
|
||||
</div>
|
||||
)}
|
||||
</section>
|
||||
<MobileAddToCart product={product} />
|
||||
</>
|
||||
);
|
||||
}
|
||||
Reference in new issue
Block a user