vs. ayer
Inter en toda la app, botones full rounded con iconos negros en bold, y todo pensado para dedos: ninguna superficie táctil baja de 44 px y la acción principal del POS mide 88 px.
El número indica claridad, no oscuridad: neutral-000 es negro puro y neutral-1000 blanco puro. Es el inverso a la convención de Tailwind, así que el tema borra la escala neutral de Tailwind para que no convivan dos grises con el mismo nombre.
El azul es el único color de marca: marca el estado activo y lo que está en curso. No hay ámbar en la paleta, así que 'sin conexión' no usa advertencia: el POS sigue vendiendo, va en neutral oscuro.
La interfaz usa estos roles, no la escala cruda. Cambiar un rol (por ejemplo que los botones pasen de neutral-800 a neutral-900) es cambiar una línea del tema y no tocar ningún componente.
Inter, autoalojada con next/font: no se pide a Google en tiempo de ejecución. Los precios usan numerales tabulares para que no bailen al cambiar de dígito.
Los botones son full rounded. Los tiles de producto y las tarjetas conservan radio propio: no son botones, son superficies.
Gris por defecto, negro para la acción principal. Los iconos van a 18-26 px y siempre en bold.
Regla del sistema: el fondo NO cambia al seleccionar, sigue siendo gris. Lo que cambia es el borde, que se vuelve azul. Así el cajero reconoce la categoría activa de un vistazo, sin tener que leerla.
aria-pressedy el mismo tamaño de control. Ninguna depende del relleno.Set curado de Reicon en regular. Crece sólo agregando entradas a POS_ICONS.
Superficies con radio propio, no pill. El área entera es clickeable: el nombre va centrado a la izquierda y la cuadrada suma abajo el contador de variantes. El precio vive en el pedido y en el selector.
Sumar tres unidades son tres toques. Nunca se abre un teclado para eso.
Cuatro familias y un significado por familia: neutral es informativo, azul es en curso, verde salió bien y rojo hay que resolverlo.
Instalados por shadcn desde los registries @uiarc y @amicro. Son los únicos de su tipo en la app: no hay alternativas genéricas. No se reescriben — se pintan con el puente de tokens (packages/ui/src/shadcn.css), que apunta sus variables CSS a la paleta de WebPOS. Si algo no encaja, se cambia el token, no el componente.
Amicro Classic Spinner. Es el único indicador de carga de la app: el original traía bg-zinc-400, un color que no existe en la paleta cerrada, así que se reescribió con currentColor — el tono lo decide quien lo usa.
Los campos de terceros heredan Inter, la altura táctil mínima de 44 px y los bordes de la paleta.
Chips, tarjetas, casillas, interruptores y deslizador. El estado encendido usa el azul de marca.
Select y combobox. Se abren con el estilo de las tarjetas del sistema, no con el look por defecto.
Tarjetas, métricas, progreso y medidores. Los contadores animados de las métricas vienen incluidos.
vs. ayer
vs. ayer
vs. ayer
138.0 productos of 200 productos used
1 principal · 2 guarniciones · 1 bebida
Contenido expandido de la tarjeta.Migas, paginación y menús desplegables.
Diálogo, hoja inferior, aviso y notificación. Todos toman el fondo y los bordes del sistema.
Las ventas se guardan en este dispositivo y se suben solas al reconectar.
Abrí el agente de impresión y vinculá esta estación para imprimir comandas.
Para separar contenido sin sacar al cajero de la pantalla.
Ventas del turno: 47 tickets · $ 184.500,00.
El menú de usuario agrupa estado, preferencias y cierre de sesión. Las filas deslizables son para acciones destructivas en listas.
Grupo de radios para elecciones excluyentes y menú contextual para acciones sobre un elemento de una lista.
Para reportes: rango de fechas del cierre y color de un tile de producto.
Foto de un producto, y firma en el cierre de caja o la entrega de un pedido.
Press Control or Command Z to undo, add Shift to redo, and Delete to clear.
Es la tabla del admin: ordena por columna, selecciona filas y filtra con chips. Reemplaza cualquier lista armada a mano.
| Empanada de carne | Empanadas | $ 2.100,00 | 316 |
| Pizza muzzarella | Pizzas | $ 9.800,00 | 142 |
| Combo familiar | Combos | $ 18.500,00 | 87 |
| Cerveza artesanal IPA | Bebidas | $ 5.200,00 | 64 |
| Flan casero | Postres | $ 3.100,00 | 41 |
Seis casillas para el código que llega por correo. Es el mismo patrón que usa el onboarding para verificar la cuenta.
El mismo bloque sirve para iniciar sesión y para crear la cuenta (cambia el modo). Arriba de esto va el alta de la organización y después el onboarding. Es un bloque: entra como una pieza entera, no se arma por partes.
No account?
Popover para un detalle sin salir de la pantalla.