Manual de JuncoCMS (Css)

Este es el manual de las hojas de estilo de JuncoCMS.

Tabla de contenidos

Introducción

JuncoCMS tiene su propio framework de hojas de estilos. Esta decisión de diseño no tiene un motivo en particular, sino que ha sido consecuencia de varios años de desarrollo.

Extensiones

Elementos de formulario

Posee todo lo referido a elementos de formularios para: personalizarlos con las hojas de estilos, crear nuevos elementos y construirlos de forma sencilla con php.

Elementos básicos

Option 1

<p><input class="input-field" type="email" placeholder="Enter email" /></p>
<p><select class="input-field"><option value="">Option 1</option></select></p>

<div class="input-group">
<input class="input-field" type="text" placeholder=".input-group-input" />
<span class="btn"><i class="fa">@</i></span>
</div>

<div class="input-icon-group">
<input class="input-field" placeholder="Search...">
<button class="input-icon" type="submit"><i class="fa fa-search"></i></button>
</div>

Tamaños

<p><input class="input-field input-large" type="input" placeholder=".input-large" /></p>
<p><input class="input-field input-small" type="input" placeholder=".input-small" /></p>

Color primario

<p><input class="input-field input-primary" type="input" placeholder=".input-primary" /></p>

Botones

Button .btn-primary .btn-small .btn-large

<button class="btn">Button</button>
<button class="btn btn-primary">.btn-primary</button>
<button class="btn btn-small">.btn-small</button>
<button class="btn btn-large">.btn-large</button>

<div class="btn-group">
<a class="btn">Button 1</a>
<a class="btn">Button 2</a>
<a class="btn">Button 3</a>
</div>