Resaltar día de evento en bloque calendario


no_avatar
Chakal
 
Posts: 18
Joined: Wed Feb 26, 2014 6:13 pm
 Wed Feb 26, 2014 6:24 pm • via Web
Hola, este es mi primer mensaje en este sitio, y decir por adelantado que blockgets es un mod fantástico...

Ahora tengo un problema, y es que he visto que el bloque "calendario", cuando tengo activo el estilo prosilver, muestra con un background amarillo los días que tienen un evento.

Pero cuando activo el estilo Artodia ultra blue (descargado de aquí mismo y adaptado a blockgets según la guía ), los días señalados con evento simplemente se muestran con fuente de color negro. Como el resto de días tienen fuente de color azul oscuro, el problema está en que los días señalados con evento apenas se aprecian bien.

He intentado cambiar esto en el archivo stylesheet, dentro de la carpeta "Art_ultra_blue/theme/blockgets", pero no tengo éxito. No sé muy bien cómo interpretar ese código, así que voy a ciegas y los cambios que hago repercuten en otras cosas... vamos, un follón.

Así es como yo lo tengo ahora:

Image

Así es como quiero ver los días señalados con evento, resaltándolos con un background amarillo (sólo esos días, el resto quiero dejarlo como viene por defecto en Artodia ultra blue):

Image

POSDATA:
Blockgets es sin duda el mejor mod de portal que hay, facilita muchísimo las cosas y potencia los foros con infinidad de posibilidades.
no_avatar
Chakal
 
Posts: 18
Joined: Wed Feb 26, 2014 6:13 pm
 Wed Feb 26, 2014 7:02 pm • via Web
Bueno, pues creo que he dado con el asunto por mí mismo.

Por si a alguien le sirve, aquí lo que he hecho...

Primero copié este bloque entero del stylesheet del estilo prostyle:

Code: Select all
/* Interaction states
----------------------------------*/
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
   border: 1px solid #c5dbec;
   background: #dfeffc url(./images/ui-bg_glass_85_dfeffc_1x400.png) 50% 50% repeat-x;
   font-weight: bold;
   color: #2e6e9e;
}


Y lo copié en el stylesheet del estilo art_ultra_blue, que originalmente tenía esto:

Code: Select all
/* Interaction states
----------------------------------*/
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
   background: #F8F8F8 !important;   
   border: 1px solid #9CAEC0 !important;
   font-weight: bold;
   color: #1D4D7E;
}


Esto lo hice, intuitivamente... ya digo, probando cosas a ver cómo cambiaba el estilo del portal. Como me fijé que cambiando esto, los días señalados en el calendario efectivamente se volvían amarillos, creí que ahí estaba la clave.

Seguí probando cosas, porque yo quería todo originalmente tal cual está en el estilo art_ultra_blue. Así que primero cambié el fondo azul de prosilver por el fondo más claro de art_ultra_blue... luego la cuadrícula, etc.

¡¡Y ME HE DADO CUENTA DE QUE EL FALLO ESTABA EN EL ORDEN DE LAS LINEAS ORIGINALES!! Era sólo eso.

Vamos que lo que originalmente estaba como:

Code: Select all
/* Interaction states
----------------------------------*/
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
   [b]background: #F8F8F8 !important;[/b]   
   border: 1px solid #9CAEC0 !important;
   font-weight: bold;
   color: #1D4D7E;
}


Hay que dejarlo como:
Code: Select all
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
   border: 1px solid #9CAEC0;
   background: #F8F8F8;
   font-weight: bold;
   color: #1D4D7E;
}


Hay que subir una línea hacia arriba el trozo "background: #F8F8F8;". Y ya está...

Ahora lo que pido por favor, es cómo puedo documentarme para entender qué hace todo este código, porque me gustaría seguir probando cosas (sólo por curiosidad).

Ya luce PERFECTO:

Image
User avatar
IvanPF
Administrator
 
Posts: 2028
Joined: Fri Jun 17, 2011 12:15 am
Location: España (Spain)
 Wed Feb 26, 2014 7:10 pm • via Web
Hola

Que te funcione haciendo ese cambio no es debido a situarlo encima o debajo, es debido a que le quitas el "!important".
El problema es que, cuando yo se lo puse fue porque seguramente lo necesitaba (aunque ahora no recuerdo el motivo) y por lo tanto es posible que te aparezca algún error en otro sitio.
En caso de que te aparezca, puedes volver a poner eso original (como estaba) y buscar esto:
Code: Select all
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {
   border: 1px solid #fad42e;
   background: #fbec88 url(./images/ui-bg_flat_55_fbec88_40x100.png) 50% 50% repeat-x;
   color: #363636;
}


y cambiarlo por esto:
Code: Select all
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {
   border: 1px solid #fad42e !important;
   background: #fbec88 url(./images/ui-bg_flat_55_fbec88_40x100.png) 50% 50% repeat-x !important;
   color: #363636 !important;
}


Eso forzará el estado "highlight" (que es el color amarillo que aparece en el calendario) por encima del estado "default" (que es lo que aparece por defecto)

Explicarte todo lo que está en ese archivo es complicado porque el estilo final del mod lo hacen ese archivo "stylesheet.css" y otro archivo que está en "blockgets/src/" llamado "blockgets-common.css"

Lo que puedo hacer es, si me dices lo que quieres cambiar, explicarte donde buscar y que cambiar
no_avatar
Chakal
 
Posts: 18
Joined: Wed Feb 26, 2014 6:13 pm
 Wed Feb 26, 2014 7:16 pm • via Web
IvanPF wrote:Hola

Que te funcione haciendo ese cambio no es debido a situarlo encima o debajo, es debido a que le quitas el "!important".
El problema es que, cuando yo se lo puse fue porque seguramente lo necesitaba (aunque ahora no recuerdo el motivo) y por lo tanto es posible que te aparezca algún error en otro sitio.
En caso de que te aparezca, puedes volver a poner eso original (como estaba) y buscar esto:
Code: Select all
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {
   border: 1px solid #fad42e;
   background: #fbec88 url(./images/ui-bg_flat_55_fbec88_40x100.png) 50% 50% repeat-x;
   color: #363636;
}


y cambiarlo por esto:
Code: Select all
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {
   border: 1px solid #fad42e !important;
   background: #fbec88 url(./images/ui-bg_flat_55_fbec88_40x100.png) 50% 50% repeat-x !important;
   color: #363636 !important;
}


Eso forzará el estado "highlight"(que es el color amarillo que aparece en el calendario) por encima del estado "default" (que es lo que aparece por defecto)

Explicarte todo lo que está en ese archivo es complicado porque el estilo final del mod lo hacen ese archivo "stylesheet.css" y otro archivo que está en "blockgets/src/" llamado "blockgets-common.css"

Lo que puedo hacer es, si me dices lo que quieres cambiar, explicarte donde buscar y que cambiar


Pues muchas gracias, IvanPF. Me lo has dejado todo clarísimo.

Me estaba volviendo loco intentando entender esto, dentro de mi ignorancia, claro. Ahora sé que es por la directiva "!important", que yo interpretaba como si fuera un simple comentario.

Who is online

Users browsing this forum: No registered users and 0 guests