Aqui unos detalles de como poder personalizar el aspecto de jevents tanto en el calendario por defecto como en el mini calendario.
Yo he usado la plantilla de calendario ext que es la que mas me gustaba por eso los ficheros de estilos a tocar seran dentro de esta carpeta.
components\com_jevents\views\ext\assets\css\events_css.css
#jevents_body a {
color: #FFF;
text-decoration: none;
/* cambiamos color de los numeros del mes que estamos*/
}
#jevents_body .tablev1 {
background-color: #900 ;
border-top: 1px solid #95A5AD;
border-left: 1px solid #95A5AD;
border-right: 0px solid #62727A;
border-bottom: 0px solid #62727A;
margin: 0px;
color : #E0E4E4;
padding-top: 12px;
padding-right: 2px;
padding-bottom: 12px;
padding-left: 2px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 9px;
text-decoration: none;
text-transform: uppercase;
vertical-align: middle;
/*Configura la tabla lateral*/
}
#jevents_body .tableh1 {
/*quita lo de encima del calendario*/
}
#jevents_body .tablec {
/*color : black;
background-color: #900;
padding-top: 3px;
padding-right: 10px;
padding-bottom: 3px;
padding-left: 10px;
border-left: 1px solid #FFFFFF;
border-top: 1px solid #FFFFFF;
/*Quital la linea debajo dle calendario*/
}
#jevents_body .maintable {
border: 1px solid #99a0aa;
margin: 20px 0px 10px 10px ;
/*Para centrar el calendario*/
}
#jevents_body .weekdaytopclr, #jevents_body .sundaytopclr {
background-image: url(../images/title.png);
background-color: #900 ;
border-left: 1px solid #95A5AD;
border-right: 0px solid #62727A;
margin: 0px;
color : #FFFFFF;
padding-top: 6px;
padding-right: 12px;
padding-bottom: 6px;
padding-left: 12px;
font-size: 10px;
font-weight: bold;
/*cambia color de los dia de la semana*/
}
#jevents_body .weekdayclr {
background-color: #CBCBCB;
color: #000;
font-size: 10px;
border-left: 1px solid #FFFFFF;
border-top: 1px solid #FFFFFF;
/*Celdas del mes que estamos*/
}
#jevents_body .todayclr {
background-color: #093;
color: #FFF;
font-size: 14px;
border-left: 1px solid #FFFFFF;
border-top: 1px solid #FFFFFF;
/*MARCA EL DIA DE HOY*/
}
#jevents_body .weekdayemptyclr {
background-color: #E4E8E8;
color: #C0C4C8;
font-size: 10px;
border-left: 1px solid #FFFFFF;
border-top: 1px solid #FFFFFF;
/*otros meses*/
}
#jevents_body .eventfull {
margin-left: 3px;
margin-right: 3px;
border-top: 1px solid #D0D4D4;
border-left: 1px solid #D0D4D4;
border-bottom: 1px solid #FFFFFF;
border-right: 1px solid #FFFFFF;
background-color: #900;
cursor: pointer;
/*Cambiar los eventos*/
}
Este archivo y configuracion es para el minicalendario
components\com_jevents\views\ext\assets\css\modstyle.css
#extcal_minical TABLE.extcal_weekdays {
background-image: url(../images/minicalendartop.png);
/* background-color:#09F; Pinta de color todo el mes*/
background-repeat: repeat-x;
border-top: 1px solid #FFFFFF;
width:239px;
/*ancho del calendario*/
border-collapse:collapse;
border-spacing:0px;
border-width:0px;
text-align:center;
/*Redondeo marcando el dia*/
}
#extcal_minical .extcal_busylink {
font-family: «Trebuchet MS», Verdana, Arial, «Microsoft Sans Serif»;
font-size: 11px;
font-weight: bold;
font-style: normal;
text-decoration: none;
/*tamaño de los numeros*/
}
#extcal_minical .extcal_busylink:link,#extcal_minical .extcal_busylink:visited {
color:#FFF;
background-image: url(../images/minievent.png);
text-decoration: none;
/*dia con evento*/
}
