Cuatro páginas · un paquete · sin compilación
Cuatro páginas, un paquete
Cuatro páginas acabadas que comparten el framework y nada más: composición, densidad y tema por defecto distintos en cada una. Cada una es un único HTML que enlaza los archivos compilados de una carpeta hermana ivolt/. Abre una y llévate la carpeta.
Fotografía de Clark Street Mercantile en Unsplash.
Las recetas
Studio
Un estudio creativo: navbar transparente sobre una portada cinematográfica con parallax, marquesina, tarjetas de servicios apiladas, galería con visor, equipo con avatares, línea de tiempo y stepper de contacto.
- navbar
- hero
- marquee
- card
- lightbox
- avatar
- timeline
- stepper
Console
Un panel de producto: megamenú, cajón lateral, cifras con contador, tabla de datos con filtro y orden, pestañas, progreso, esqueletos, toasts, diálogos, paleta de comandos, selector de fecha y formulario validado.
- megamenu
- drawer
- countup
- datatable
- tabs
- command
- datepicker
- toast
Journal
Una revista editorial: la tipografía como protagonista, portada, masonry de artículos, efectos de texto, barra de lectura, visor, paginación, migas, tooltips y popovers para notas, y una impresión cuidada.
- typography
- text
- progress
- lightbox
- pagination
- breadcrumb
- popover
Store
Un catálogo y una compra que no compra nada: filtros con selector enriquecido y combobox, carrusel de producto, insignias, precios como stat, stepper de compra con fecha de entrega, cajón de carrito, diálogo de confirmación y toast.
- picker
- combobox
- carousel
- badge
- stat
- stepper
- drawer
- dialog
Descargas
Cada archivo sale de las mismas fuentes que las páginas de arriba, así que siempre corresponde a esta versión. Cada zip de receta lleva su propia copia de ivolt/: descomprime y abre index.html.
index.html, README.md y ivolt/.dist/ (CSS y JS), más LICENSE y README.md.Los tamaños y las listas de archivos están en manifest.json.
Copiar una receta a tu proyecto
Cada receta vive en examples/recipes/<nombre>/index.html dentro del repositorio. Copia esa carpeta junto con examples/recipes/ivolt/ y abre la página. La plantilla de examples/plain-html es la versión más pequeña posible del mismo montaje.