extern/egroupware_official
1
0
Fork 0
mirror of https://github.com/EGroupware/egroupware.git synced 2025-01-03 04:29:28 +01:00
Code Issues Packages Projects Releases Wiki Activity

change css classes:

Browse Source 
search field sidebar
mini calendar - color - sidebar
header: view week, day - arrow left and right , arranged
This commit is contained in:
Stefan Reinhardt 2014-03-05 10:53:28 +00:00
parent bb3eb717c1
commit 0d817332ff
2 changed files with 70 additions and 34 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

51
calendar/templates/pixelegg/app.css
View File

@ -727,11 +727,12 @@ div.calendar {
/* They are the navigation buttons */ /* They are the navigation buttons */
padding: 2px; padding: 2px;
/* Make the buttons seem like they're pressing */ /* Make the buttons seem like they're pressing */
background-color: #ffdd73;
} }
.calendar .nav { .calendar .nav {
/*background: url(../images/menuarrow.png) no-repeat 100% 100%;*/ /*background: url(../images/menuarrow.png) no-repeat 100% 100%;*/
background-image: none; background-image: none;
background-color: #ffc200; background-color: #ffdd73;
} }
.calendar thead .title { .calendar thead .title {
/* This holds the current "month, year" */ /* This holds the current "month, year" */
@ -747,7 +748,7 @@ div.calendar {
} }
.calendar thead .headrow { .calendar thead .headrow {
/* Row <TR> containing navigation buttons */ /* Row <TR> containing navigation buttons */
background-color: #ffc200; background-color: #ffdd73;
color: #fff; color: #fff;
} }
.calendar thead .daynames { .calendar thead .daynames {
@ -941,7 +942,7 @@ div.calendar {
} }
/*########################################### /*###########################################
# # # #
# dialog-header # # dialogHeader #
############################################# #############################################
# # # #
# # # #
@ -1216,7 +1217,7 @@ div#calendar-edit #calendar-edit_calendar-edit-history tbody {
display: table-row-group; display: table-row-group;
width: 100%; width: 100%;
} }
div#calendar-edit tr.dialog-footer-toolbar label.et2_label { div#calendar-edit tr.dialogFooterToolbar label.et2_label {
top: 0px !important; top: 0px !important;
} }
div#calendar-edit #calendar-edit_action { div#calendar-edit #calendar-edit_action {
@ -1274,29 +1275,30 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
/* marks a day in the colum-header as today /* marks a day in the colum-header as today
*/ */
.calendar_calToday { .calendar_calToday {
background-color: #ffc200; background-color: #ffdd73;
} }
.calendar_calWeek { .calendar_calWeek {
background-color: #ffc200; background-color: #ffffff;
width: auto; width: auto;
margin: 0 auto; margin: 0 auto;
text-align: center; text-align: center;
border: 1px solid silver; border: none;
} }
.calendar_calMonth { .calendar_calMonth {
background-color: #ffc200; /*.background_table_cal_head;*/
background-color: #ffffff;
width: auto; width: auto;
margin: 0 auto; margin: 0 auto;
text-align: center; text-align: center;
border: 1px solid silver; border: none;
} }
/* marks a day in the colum-header as holiday /* marks a day in the colum-header as holiday
*/ */
.calendar_calHoliday { .calendar_calHoliday {
background-color: #9b6ad6; background-color: #ffdd73;
} }
.calendar_calHoliday a { .calendar_calHoliday a {
color: #ffffff; color: #1e1e1e !important;
font-size: 0.9em; font-size: 0.9em;
} }
/* marks a day in the column-header additionaly as birthday of some contact, /* marks a day in the column-header additionaly as birthday of some contact,
@ -1403,25 +1405,34 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
line-height: 12px; line-height: 12px;
z-index: 30; z-index: 30;
} }
.calendar_calGridHeader {
border: none;
}
.calendar_calDayColHeader img { .calendar_calDayColHeader img {
vertical-align: middle; vertical-align: middle;
} }
.calendar_calWeekNavHeader, .calendar_calWeekNavHeader,
.calendar_calMonthNavHeader { .calendar_calMonthNavHeader {
top: 0px; top: 3px;
left: 0px; left: 0px;
width: 100%; width: auto;
right: 0px; right: 0px;
/* does not work in IE, but looks better in other browsers then width:100% */ /* does not work in IE, but looks better in other browsers then width:100% */
text-align: center; text-align: center;
font-size: 100%; font-size: 100%;
white-space: nowrap; white-space: nowrap;
border-bottom: 1px solid silver; border-bottom: 0px solid silver;
border-right: 1px solid silver; border-right: 0px solid silver;
height: 16px; height: 24px;
line-height: 12px; line-height: 21px;
/*height: 24px;*/
z-index: 30; z-index: 30;
} }
.calendar_calWeekNavHeader a img,
.calendar_calMonthNavHeader a img {
position: relative;
top: 3px;
}
.calendar_calWeekNavHeader, .calendar_calWeekNavHeader,
.calendar_calMonthNavHeader img { .calendar_calMonthNavHeader img {
vertical-align: middle; vertical-align: middle;
@ -2146,7 +2157,8 @@ select#calendar_view {
} }
/*searchfield*/ /*searchfield*/
input#calendar_keywords { input#calendar_keywords {
margin: 5px 0; margin: 10px 0 10px 2px;
font-size: 1.3em;
} }
div#calendar-container { div#calendar-container {
margin-left: 0px; margin-left: 0px;
@ -2173,6 +2185,9 @@ div#calendar-container div.calendar table thead .title {
-webkit-box-shadow: none; -webkit-box-shadow: none;
background-color: #ffc200; background-color: #ffc200;
} }
div#calendar-container div.calendar table thead .headrow {
color: #1e1e1e;
}
div#calendar-container div.calendar table thead .daynames { div#calendar-container div.calendar table thead .daynames {
background-color: #679fd2; background-color: #679fd2;
} }

53
calendar/templates/pixelegg/app.less
View File

@ -122,6 +122,7 @@ div.calendar { position: relative; }
.button { /* "<<", "<", ">", ">>" buttons have this class */ .button { /* "<<", "<", ">", ">>" buttons have this class */
text-align: center; /* They are the navigation buttons */ text-align: center; /* They are the navigation buttons */
padding: 2px; /* Make the buttons seem like they're pressing */ padding: 2px; /* Make the buttons seem like they're pressing */
.background_table_cal_head;
} }
.nav { .nav {
/*background: url(../images/menuarrow.png) no-repeat 100% 100%;*/ /*background: url(../images/menuarrow.png) no-repeat 100% 100%;*/
@ -391,7 +392,7 @@ div.calendar { position: relative; }
/*########################################### /*###########################################
# # # #
# dialog-header # # dialogHeader #
############################################# #############################################
# # # #
# # # #
@ -700,7 +701,7 @@ div#calendar-edit{
/*###########################################*/ /*###########################################*/
/*// Toolbar*/ /*// Toolbar*/
tr.dialog-footer-toolbar{ tr.dialogFooterToolbar{
label.et2_label {top: 0px !important;} label.et2_label {top: 0px !important;}
@ -777,26 +778,27 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
} }
.calendar_calWeek{ .calendar_calWeek{
// background: #ffffcc; // background: #ffffcc;
.background_table_cal_head; background-color : @gray_0;
width:auto; width:auto;
margin:0 auto; margin:0 auto;
text-align:center; text-align:center;
border: 1px solid silver; border: none;
} }
.calendar_calMonth{ .calendar_calMonth{
// background: #ffffcc; // background: #ffffcc;
.background_table_cal_head; /*.background_table_cal_head;*/
background-color : @gray_0;
width:auto; width:auto;
margin:0 auto; margin:0 auto;
text-align:center; text-align:center;
border: 1px solid silver; border: none;
} }
/* marks a day in the colum-header as holiday /* marks a day in the colum-header as holiday
*/ */
.calendar_calHoliday{ .calendar_calHoliday{
background-color: @egw_color_3_e; background-color: @egw_color_1_e;
a { a {
.color_0_gray; color: @gray_90 !important;
font-size: 0.9em; font-size: 0.9em;
} }
} }
@ -903,23 +905,38 @@ e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget
line-height: 12px; line-height: 12px;
z-index: 30; z-index: 30;
} }
.calendar_calGridHeader{ border: none; }
.calendar_calDayColHeader img { .calendar_calDayColHeader img {
vertical-align: middle; vertical-align: middle;
} }
.calendar_calWeekNavHeader,.calendar_calMonthNavHeader{ .calendar_calWeekNavHeader,.calendar_calMonthNavHeader{
top: 0px; top: 3px;
left: 0px; left: 0px;
width: 100%; width: auto;
right: 0px; /* does not work in IE, but looks better in other browsers then width:100% */ right: 0px; /* does not work in IE, but looks better in other browsers then width:100% */
text-align: center; text-align: center;
font-size: 100%; font-size: 100%;
white-space: nowrap; white-space: nowrap;
border-bottom: 1px solid silver; border-bottom: 0px solid silver; // cleaned
border-right: 1px solid silver; border-right: 0px solid silver; // cleaned
.dimension_height_s; .dimension_height_m;
line-height: 12px; line-height: 21px;
/*height: 24px;*/
z-index: 30; z-index: 30;
a {
img {
position: relative;
top: 3px;
}
}
} }
.calendar_calWeekNavHeader,.calendar_calMonthNavHeader img{ .calendar_calWeekNavHeader,.calendar_calMonthNavHeader img{
vertical-align: middle; vertical-align: middle;
} }
@ -1474,7 +1491,11 @@ button[id*="edit_button[add_alarm]"]{
select#calendar_view{margin-top: 8px;} select#calendar_view{margin-top: 8px;}
/*searchfield*/ /*searchfield*/
input#calendar_keywords{margin: 5px 0;} input#calendar_keywords{
margin: 10px 0 10px 2px;
font-size: 1.3em;
;
}
div#calendar-container { div#calendar-container {
margin-left: 0px; margin-left: 0px;
@ -1504,7 +1525,7 @@ div#calendar-container {
} }
// << today >> // << today >>
.headrow {} .headrow { color: @gray_90;}
// daynames // daynames
.daynames { .daynames {