JEvents Calendar Plus

Używając modułu jevent calendar plus mamy do wyboru kilka przykładowych szablonów kalendarza. Chcąc przystosować szablon do własnych upodobań możemy bezpośrednio edytować plik .css którego używa nasz moduł. W tym celu w konfuiguracji modułu wybieramy szablon np. default.css, a następnie przechodzimy do pliku /public_html/modules/mod_jevents_calendarplus/assets/css/default.cs i edytujemy jego kod.

 

.jevcalendarplus_calendar_controls{background-color:#960020;background: linear-gradient(#960020, #CC012E); color: white} // pole z nazwą miesiąca
.jevcalendarplus_calendar_controls .jevcalendarplus-previous-button:hover,.jevcalendarplus-previousyear-button:hover{background-color:#f4f4f4} // podświetlenia przycisków do zmiany roku
.jevcalendarplus_calendar_controls .jevcalendarplus-next-button:hover,.jevcalendarplus-nextyear-button:hover{background-color:#f4f4f4} // podświetlenia przycisków do zmiany miesiąca

.jevcalendarplus_calendar .clndr .jevcalendarplus-grid .jevcalendarplus-header-day{background-color:#960020;background: linear-gradient(#960020, #CC012E); color: white} // pole z nazwą dni tygodnia
.jevcalendarplus_calendar .clndr .jevcalendarplus-grid .day.event{background-color:rgb(227,198,16);background: linear-gradient(rgb(227,198,16),rgb(219,177,13))} // pola z wydarzeniami
.jevcalendarplus_calendar .clndr .jevcalendarplus-grid .day.today{background-color:#960020;background: linear-gradient(#960020, #CC012E); color: white} // pole dzisiejszego dnia
.jevcalendarplus_calendar .clndr .jevcalendarplus-grid .empty,.jevcalendarplus_calendar .clndr .jevcalendarplus-grid .adjacent-month{background:#ddd} // pola bez dat (początek i koniec miesiąca)
.jevcalendarplus_calendar .clndr .clndr-today-button:hover{background-color:#ddd} // ???

#jevcalendarplus-list-header{background-color:#AAAAAA;} // pole z nagłówkiem gdy wejdziemy na wydażenie

.jevcalendarplus-row{background-color: #EEEEEE} // nieparzyste wydarzenia
.jevcalendarplus-row:nth-child(2n){background-color: #DDDDDD} // parzyste wydarzenia

 

JEvents

Ustawienie 24 godzinnego formatu czasu

konfiguracja -> edycja wydarzeń -> 12 godziiny format czasu -> nie

Wyrażenie formatującego dla prawidłowego wyświetlenia daty :

${startDate(%A %B %e)}[!a:, ${startDate(%H:%M)}]
${title}

Ustawienia dla modułu najlepiej ustawić w komponencie ( konfiguracja -> wkrótce... )

Początek strony