Framework creador de Sistemas Web

Cerrar Menu Inicio Librerías CSS Librerías JS

wrapz.css

Conjunto de elementos Web básicos, pre-diseñados para "estandarizar" el look and feel de nuestros sistemas.
Es la "librería general" de todo el diseño visual de Zyntax.

Puede ser revisada/descargada acá

Lista de componentes
Caja con título
Caja con título donde meter contenido.
Caja con título cerrable (el icono es opcional)
Caja con título donde meter contenido.
A diferencia de la anterior, esta se puede cerrar y volver a abrir, haciendo click en el título.
Encabezados y párrafos (Caja cerrada hasta hacer click en el título)

Encabezado (h1)

Párrafo principal de relleno mostrado como subtítulo al encabezado de la página que estás viendo.

Encabezado (h2)

Párrafo principal de relleno mostrado como subtítulo al encabezado de la página que estás viendo.

Encabezado (h3)

Párrafo principal de relleno mostrado como subtítulo al encabezado de la página que estás viendo.

Encabezado (h4)

Párrafo principal de relleno mostrado como subtítulo al encabezado de la página que estás viendo.

Encabezado (h5)

Párrafo principal de relleno mostrado como subtítulo al encabezado de la página que estás viendo.

Encabezado (h6)

Párrafo principal de relleno mostrado como subtítulo al encabezado de la página que estás viendo.

Enlaces básicos
Link simple Link simple activo Link con icono
Enlaces (mostrados como botones)
Botón Link "Light" Botón Link "Light" activo Botón Link "Light" con icono
Botón Link "Green" Botón Link "Green" activo Botón Link "Green" con icono
Botones básicos
Botones con iconos (centrados y con ancho fijo)
Mensajes (centrados)
Cargando lista de datos... La información ha sido guardada correctamente El tamaño del registro es más grande de lo permitido Ha ocurrido un error al enviar la información Mensaje informativo muy largo (Desplegado en bloque completo)
Pestañas
Pestaña 1
Pestaña 2
Pestaña 3
Contenido Pestaña 1
Contenido Pestaña 2
(Con alto diferente)
Contenido Pestaña 3
Tablas
Columna 1 Columna 2 Columna 3 Columna 4 Columna 5 Acciones
Dato 1 Dato 2 Dato 3 Dato 4 Enlace en tabla
Dato 1 Dato 2 Dato 3 Dato 4 Enlace en tabla
Dato 1 Dato 2 Dato 3 Dato 4 Enlace en tabla
Dato 1 Dato 2 Dato 3 Dato 4 Enlace en tabla
Dato 1 Dato 2 Dato 3 Dato 4 Enlace en tabla
Columna 1 Columna 2 Columna 3 Columna 4 Columna 5 Acciones
Dato 1 Dato 2 Dato 3 Dato 4 Enlace
Dato 1 Dato 2 Dato 3 Dato 4 Enlace
Dato 1 Dato 2 Dato 3 Dato 4 Enlace
Dato 1 Dato 2 Dato 3 Dato 4 Enlace
Dato 1 Dato 2 Dato 3 Dato 4 Enlace
Formularios