carlos/reformix-hackaton
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Hace responsive la tabla de precios en móvil

Browse Source 
Las filas del catálogo y la cabecera CSV se desbordaban horizontalmente
en móvil (botones Guardar/Borrar fuera de pantalla), y ese overflow
horizontal desestabilizaba la barra de navegación fija. Las filas ahora
hacen wrap y el bloque <code> rompe palabra.

Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
Carlos Narro
2026-05-31 00:49:28 +02:00
parent 2f13057e02
commit de798b00ce
1 changed files with 5 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
mvp/b2c/src/app/panel/precios/page.tsx
View File

@@ -120,10 +120,10 @@ export default async function PreciosPage() {
<div className="space-y-2">
{items.length === 0 && <p className="text-sm text-gray-400">Sin materiales.</p>}
{items.map((item) => (
<div key={item.id} className="flex items-center gap-3 text-sm border-b border-gray-100 pb-2">
<span className="w-48 font-medium text-black">{item.nombre}</span>
<div key={item.id} className="flex flex-wrap items-center gap-x-3 gap-y-2 text-sm border-b border-gray-100 pb-2">
<span className="w-full sm:w-48 font-medium text-black">{item.nombre}</span>
<span className="w-20 text-gray-500 capitalize">{item.calidad}</span>
<span className="w-16 text-gray-400">{item.unidad}</span>
<span className="w-12 text-gray-400">{item.unidad}</span>
{item.esDefault && (
<span className="text-xs bg-green-100 text-green-700 rounded px-1.5 py-0.5">default</span>
)}
@@ -134,7 +134,7 @@ export default async function PreciosPage() {
type="number"
step="0.01"
defaultValue={item.precioUnit / 100}
className="w-24 border border-gray-300 rounded-lg px-2 py-1 text-right"
className="w-20 border border-gray-300 rounded-lg px-2 py-1 text-right"
/>
<span className="text-gray-400">€</span>
<button className="text-xs text-blue-600 hover:underline">Guardar</button>
@@ -176,7 +176,7 @@ export default async function PreciosPage() {
<section className="bg-white rounded-xl border border-gray-200 p-6">
<h2 className="font-bold text-black mb-2">Importar catálogo (CSV)</h2>
<p className="text-xs text-gray-500 mb-3">
Cabecera: <code>categoria,nombre,calidad,precio,unidad,descriptor_render,sku</code>. El
Cabecera: <code className="break-all">categoria,nombre,calidad,precio,unidad,descriptor_render,sku</code>. El
precio en euros. Actualiza por SKU.
</p>
<form action={importarCatalogoCsv as unknown as (fd: FormData) => void}>