LOGIN LATERAL. Campos en una sola línea.

0 comentarios

Por defecto la plantilla de gesio muestra los campos de texto del módulo de login de usuarios registrados en la columna lateral en dos líneas.

Puede darse el caso de que, bien por reducir espacio, bien por cuestiones estéticas, queramos hacer que estos campos se alineen en una sola línea. Para ello hemos eleborado el siguiente código CSS. En las anotaciones del código indicaremos las zonas susceptibles de ser modificadas por el usuario para adaptarlo a diferentes dimensiones o colores.

 
/*//////// LOGIN EN UNA SOLA LINEA ///////*/ 

div#cajaNoLogeado.cajasIzda, div#cajaLogeado.cajasIzda{ 
height:auto !important; /* Resetea la altura de las cajas, por defecto fija */ 
padding-bottom: 5px; 
} 

div#cajaNoLogeado.cajasIzda form { 
margin: 5px 5px 0 10px; 
} 

div#cajaNoLogeado.cajasIzda p { /* los p contienen los input visibles */
float:left; 
display:block; 
width:50% 
}

div#cajaNoLogeado.cajasIzda label { 
font-size: 9px; 
display:block; 
text-transform:uppercase; 
padding-left: 0; 
} 

div#cajaNoLogeado.cajasIzda input.camposformHome{ 
width:85%; 
padding:3px; 
margin-right:5px; 
margin-left: 0; 
border-color:#c8c8c8; /* borde gris, modificar por el color de la plantilla */ 
} 

div#cajaNoLogeado.cajasIzda input.camposformHome:focus{ 
border-color:#2aabce; /* borde azul, modificar por el color de la plantilla */ 
} 

div#cajaNoLogeado.cajasIzda input.botonform { 
width:185px; /* ancho por defecto, modificar para adaptarlo a la plantilla */ 
background-color:#97bf0d; /* fondo verde, modificar por el color de la plantilla */ 
text-transform:uppercase; margin-left: 0; 
} 

div#cajaNoLogeado.cajasIzda input.botonform:hover { 
background-color:#698702; /* fondo verde, modificar por el color de la plantilla */ 
} 

div#cajaNoLogeado.cajasIzda a { 
display:block; 
clear:both; 
margin:0; 
padding-left:5px; 
font-size:10px; 
} 

div#cajaNoLogeado.cajasIzda br { 
margin:0; 
padding:0; 
display:none; 
} 

/*/////// FIN LOGIN EN UNA SOLA LINEA ///////*/