Guía de Estilos

Átomos

---

Fondos

.bg_primary .bg_primary-light .bg_primary_dark .bg_alternative .bg_white .bg_light .bg_dark .bg_gray .bg_success .bg_danger .bg_info .bg_warning

Textos

.text_primary .text_primary-light .text_primary_dark .text_alternative .text_white .text_light .text_dark .text_gray .text_success .text_danger .text_info .text_warning

Bordes

Todos los bordes

.border .border_primary .border .border_primary-light .border .border_primary_dark .border .border_alternative .border .border_white .border .border_light .border .border_dark .border .border_gray .border .border_success .border .border_danger .border .border_info .border .border_warning

Un único borde

.border .border_top .border .border_right .border .border_bottom .border .border_left

Sin un borde

.border .border_top_0 .border .border_right_0 .border .border_bottom_0 .border .border_left_0

---

Títulos

H1 - Título

H2 - Título

H3 - Título

H4 - Título

H5 - Título

H6 - Título

---

Párrafos

Mei eu mollis albucius, ex nisl contentiones vix. Duo persius volutpat at, cu iuvaret epicuri mei. Duo posse pertinacia no, ex dolor contentiones mea. Nec omnium utamur dignissim ne. Mundi lucilius salutandi an sea, ne sea aeque iudico comprehensam. Populo delicatissimi ad pri. Ex vitae accusam vivendum pro.

---

Lista ordenada

1. Lorem ipsum dolor sit amet consectetuer.
2. Aenean commodo ligula eget dolor.
3. Aenean massa cum sociis natoque penatibus.

Lista desordenada

• Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa.
• Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem.
• Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu.
• In enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam dictum felis eu pede mollis pretium. Integer tincidunt.

Blockquote

Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa esto es un strong. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. In esto es un em enim justo, rhoncus ut, imperdiet a, venenatis vitae, justo. Nullam esto es un link dictum felis eu pede mollis pretium.

Botones

.btn .btn_primary .btn .btn_primary-light .btn .btn_primary_dark .btn .btn_alternative .btn .btn_white .btn .btn_light .btn .btn_dark .btn .btn_gray .btn .btn_success .btn .btn_danger .btn .btn_info .btn .btn_warning

---

Organismos

---

Formularios

Responsabilidad

el usuario puede completar y enviar al sitio web.

Estados

Formularios de contacto, ingreso de usarios, registro de usuarios

Nombre: Email: Mensaje:

---

Tablas

Responsabilidad

Estos elementos son usados para crear y manejar datos tabulados.

Estados

Por defecto las tablas cambian su estado al hacer hover sobre una fila, cambiando su color de fondo, para ayudar a la lectura.

Entry Header 1	Entry Header 2	Entry Header 3	Entry Header 4
Entry First Line 1	Entry First Line 2	Entry First Line 3	Entry First Line 4
Entry Line 1	Entry Line 2	Entry Line 3	Entry Line 4
Entry Last Line 1	Entry Last Line 2	Entry Last Line 3	Entry Last Line 4

Modal

Responsabilidad

Es una capa que se superpone a las demás quedando en primer plano de nuestra web y dejando en un segundo plano el resto de la página. Podemos incluir cualquier tipo de contenido en ella.

Estados

Activo e inactivo, no se visualiza hasta que se encuentre en estado activo.

Ejemplo de modal

Navbar

Responsabilidad

Representa el encabezado del sitio proporcionando enlaces de navegación, ya sea dentro del documento actual o a otros documentos.

Estados

Cambia de estado en mobile, y menú desplegado.

Estado default