manuelcillero/suitedesk
manuelcillero/suitedesk
Archived
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Improved the view of week calendar

Browse source
This commit is contained in:
Manuel Cillero 2017-09-15 13:46:17 +02:00
parent 03b8c7f6df
commit e2d79c1bb4
3 changed files with 288 additions and 313 deletions
Download patch file Download diff file Expand all files Collapse all files

106
modules/calendar/calendar_multiday/calendar-overlap.css
View file

@ -1,6 +1,6 @@
/** Overlapping week items **/ /** Overlapping week items **/
.calendar-calendar tr.holder { .calendar-calendar tr.holder {
height : 0px; height: 0;
display: table-row !important; display: table-row !important;
display: none; display: none;
} }
@ -8,9 +8,9 @@
.calendar-calendar .week-view .full div.item-wrapper, .calendar-calendar .week-view .full div.item-wrapper,
.calendar-calendar .day-view .full div.item-wrapper { .calendar-calendar .day-view .full div.item-wrapper {
background-color: none; background-color: none;
border:0px; border: 0;
float: none; float: none;
margin:0px; margin: 0;
width: 100%; width: 100%;
margin-top: -24px; margin-top: -24px;
} }
@ -22,25 +22,24 @@
.calendar-calendar .week-view .full div.single-day div.weekview, .calendar-calendar .week-view .full div.single-day div.weekview,
.calendar-calendar .day-view .full div.single-day div.dayview { .calendar-calendar .day-view .full div.single-day div.dayview {
background : #FFD8C0; background: #ffd8c0;
width: auto; width: auto;
padding : 0px 3px; padding: 0 3px;
overflow: hidden; overflow: hidden;
} }
.calendar-calendar .week-view .full div.single-day div.weekview, .calendar-calendar .week-view .full div.single-day div.weekview,
.calendar-calendar .day-view .full div.single-day div.dayview { .calendar-calendar .day-view .full div.single-day div.dayview {
border : 1px solid #E39364; border: 1px solid #e39364;
} }
.calendar-calendar .week-view .header-body-divider, .calendar-calendar .week-view .header-body-divider,
.calendar-calendar .week-view .single-day-footer, .calendar-calendar .week-view .single-day-footer,
.calendar-calendar .day-view .single-day-footer, .calendar-calendar .day-view .single-day-footer,
.calendar-calendar .day-view .header-body-divider { .calendar-calendar .day-view .header-body-divider {
background : #eeeeee; background: #eee;
border-left : 1px solid #CCCCCC; border-left: 1px solid #ccc;
border-right : 1px solid #CCCCCC; border-right: 1px solid #ccc;
font-size: 1px; font-size: 1px;
height: 4px; height: 4px;
line-height: 1px; line-height: 1px;
@ -51,23 +50,23 @@
.calendar-calendar .day-view #multi-day-container, .calendar-calendar .day-view #multi-day-container,
.calendar-calendar .day-view #single-day-container { .calendar-calendar .day-view #single-day-container {
position: relative; position: relative;
background : #ffffff; background: #fff;
overflow-y: scroll; overflow-y: scroll;
overflow-x: hidden; overflow-x: hidden;
border-left : 1px solid #CCCCCC; border-left: 1px solid #ccc;
border-bottom : 1px solid #CCCCCC; border-bottom: 1px solid #ccc;
} }
.calendar-calendar .week-view #multi-day-container, .calendar-calendar .week-view #multi-day-container,
.calendar-calendar .day-view #multi-day-container { .calendar-calendar .day-view #multi-day-container {
border-top : 1px solid #CCCCCC; border-top: 1px solid #ccc;
} }
.calendar-calendar .week-view #week-header-container, .calendar-calendar .week-view #week-header-container,
.calendar-calendar .day-view #day-header-container { .calendar-calendar .day-view #day-header-container {
width: 100%; width: 100%;
background : #ffffff; background: #fff;
border-bottom : 1px solid #CCCCCC; border-bottom: 1px solid #ccc;
} }
.calendar-calendar .week-view #multi-day-container, .calendar-calendar .week-view #multi-day-container,
@ -86,54 +85,54 @@
.calendar-calendar .week-view #multi-day-container table td, .calendar-calendar .week-view #multi-day-container table td,
.calendar-calendar .day-view #multi-day-container table td { .calendar-calendar .day-view #multi-day-container table td {
border-top : 0px; border-top: 0;
border-bottom : 0px; border-bottom: 0;
vertical-align: top; vertical-align: top;
} }
.calendar-calendar .week-view #single-day-container, .calendar-calendar .week-view #single-day-container,
.calendar-calendar .day-view #single-day-container { .calendar-calendar .day-view #single-day-container {
border-top : 1px solid #CCCCCC; border-top: 1px solid #ccc;
height: 500px; height: 500px;
} }
.calendar-calendar .week-view #single-day-container table td, .calendar-calendar .week-view #single-day-container table td,
.calendar-calendar .day-view #single-day-container table td { .calendar-calendar .day-view #single-day-container table td {
padding : 0px; padding: 0;
border-top : 0px; border-top: 0;
border-bottom : 0px; border-bottom: 0;
} }
.calendar-calendar .week-view #single-day-container table td.first, .calendar-calendar .week-view #single-day-container table td.first,
.calendar-calendar .day-view #single-day-container table td.first { .calendar-calendar .day-view #single-day-container table td.first {
border-left : 0px; border-left: 0;
} }
.calendar-calendar .week-view #single-day-container table td.last, .calendar-calendar .week-view #single-day-container table td.last,
.calendar-calendar .day-view #single-day-container table td.last { .calendar-calendar .day-view #single-day-container table td.last {
border-right : 0px; border-right: 0;
} }
.calendar-calendar .week-view #single-day-container div.first, .calendar-calendar .week-view #single-day-container div.first,
.calendar-calendar .day-view #single-day-container div.first { .calendar-calendar .day-view #single-day-container div.first {
border-top : 0px; border-top: 0;
} }
.calendar-calendar .week-view #single-day-container div.last, .calendar-calendar .week-view #single-day-container div.last,
.calendar-calendar .day-view #single-day-container div.last { .calendar-calendar .day-view #single-day-container div.last {
border-bottom : 0px; border-bottom: 0;
} }
.calendar-calendar .week-view table.full { /* .calendar-calendar .week-view table.full { /*
table-layout: fixed; table-layout: fixed;
width: 925px; */ width: 925px; */
margin : 0px; margin: 0;
} }
.calendar-calendar .day-view table.full { .calendar-calendar .day-view table.full {
table-layout: fixed; table-layout: fixed;
width: 923px; width: 923px;
margin : 0px; margin: 0;
} }
.calendar-calendar td.calendar-agenda-hour .calendar-hour, .calendar-calendar td.calendar-agenda-hour .calendar-hour,
@ -142,7 +141,7 @@
.calendar-calendar .day-view .full div.calendar-agenda-hour span { .calendar-calendar .day-view .full div.calendar-agenda-hour span {
font-size: .8em; font-size: .8em;
font-weight: normal; font-weight: normal;
margin-right: 0px; margin-right: 0;
} }
.calendar-calendar .week-view .full div.calendar-agenda-hour, .calendar-calendar .week-view .full div.calendar-agenda-hour,
@ -151,7 +150,7 @@
.calendar-calendar .day-view .full div.calendar-agenda-items { .calendar-calendar .day-view .full div.calendar-agenda-items {
width: 100%; width: 100%;
height: 47px; height: 47px;
border-top : 1px solid #cccccc; border-top: 1px solid #ccc;
} }
.calendar-calendar .week-view .full .calendar-agenda-hour div, .calendar-calendar .week-view .full .calendar-agenda-hour div,
@ -162,25 +161,25 @@
.calendar-calendar .day-view .full td.calendar-time-holder, .calendar-calendar .day-view .full td.calendar-time-holder,
.calendar-calendar .week-view .full td.calendar-time-holder { .calendar-calendar .week-view .full td.calendar-time-holder {
width: 50px; width: 50px;
padding : 0px; padding: 0;
border : 0px; border: 0;
} }
.calendar-calendar .week-view .full td.calendar-day-holder { .calendar-calendar .week-view .full td.calendar-day-holder {
padding : 0px; padding: 0;
border : 0px; border: 0;
width: 125px; width: 125px;
} }
.calendar-calendar .day-view .full td.calendar-day-holder { .calendar-calendar .day-view .full td.calendar-day-holder {
padding : 0px; padding: 0;
border : 0px; border: 0;
width: 873px; width: 873px;
} }
.calendar-calendar .week-view .full div.single-day, .calendar-calendar .week-view .full div.single-day,
.calendar-calendar .day-view .full div.single-day { .calendar-calendar .day-view .full div.single-day {
padding : 0px; padding: 0;
} }
.calendar-calendar .week-view .full div.single-day .inner, .calendar-calendar .week-view .full div.single-day .inner,
@ -190,7 +189,7 @@
} }
.calendar-calendar .week-view .full td.multi-day { .calendar-calendar .week-view .full td.multi-day {
padding : 1px 2px 0px 2px; padding: 1px 2px 0 2px;
} }
.calendar-calendar .day-view .full td.multi-day div.dayview, .calendar-calendar .day-view .full td.multi-day div.dayview,
@ -205,7 +204,7 @@
.calendar-calendar .week-view .full td.multi-day .inner .weekview .continuation { .calendar-calendar .week-view .full td.multi-day .inner .weekview .continuation {
height: 22px; height: 22px;
padding-top: 0px; padding-top: 0;
margin-right: 3px; margin-right: 3px;
} }
@ -214,7 +213,7 @@
.calendar-calendar .day-view .full td.multi-day .inner .dayview .continues, .calendar-calendar .day-view .full td.multi-day .inner .dayview .continues,
.calendar-calendar .day-view .full td.multi-day .inner .dayview .cutoff { .calendar-calendar .day-view .full td.multi-day .inner .dayview .cutoff {
height: 22px; height: 22px;
padding-top: 0px; padding-top: 0;
} }
.calendar-calendar .week-view div.single-day .view-item, .calendar-calendar .week-view div.single-day .view-item,
@ -233,13 +232,13 @@
width: 100%; width: 100%;
position: relative; position: relative;
z-index: 0; z-index: 0;
top : 0px; top: 0;
border-bottom : 1px dotted #cccccc; border-bottom: 1px dotted #ccc;
} }
.calendar-calendar .week-view div.single-day .view-item .calendar, .calendar-calendar .week-view div.single-day .view-item .calendar,
.calendar-calendar .day-view div.single-day .view-item .calendar { .calendar-calendar .day-view div.single-day .view-item .calendar {
margin : 0px; margin: 0;
} }
.calendar-calendar .week-view div.single-day .view-item .contents, .calendar-calendar .week-view div.single-day .view-item .contents,
@ -248,7 +247,7 @@
} }
.calendar-calendar div.single-day .o_0 .view-item { .calendar-calendar div.single-day .o_0 .view-item {
top : 0px; top: 0;
} }
.calendar-calendar div.single-day .o_1 .view-item { .calendar-calendar div.single-day .o_1 .view-item {
@ -271,83 +270,66 @@
height: 10px; height: 10px;
} }
.calendar-calendar div.single-day .d_2 .view-item .calendar { .calendar-calendar div.single-day .d_2 .view-item .calendar {
height: 22px; height: 22px;
} }
.calendar-calendar div.single-day .d_3 .view-item .calendar { .calendar-calendar div.single-day .d_3 .view-item .calendar {
height: 34px; height: 34px;
} }
.calendar-calendar div.single-day .d_4 .view-item .calendar { .calendar-calendar div.single-day .d_4 .view-item .calendar {
height: 46px; height: 46px;
} }
.calendar-calendar div.single-day .d_5 .view-item .calendar { .calendar-calendar div.single-day .d_5 .view-item .calendar {
height: 58px; height: 58px;
} }
.calendar-calendar div.single-day .d_6 .view-item .calendar { .calendar-calendar div.single-day .d_6 .view-item .calendar {
height: 70px; height: 70px;
} }
.calendar-calendar div.single-day .d_7 .view-item .calendar { .calendar-calendar div.single-day .d_7 .view-item .calendar {
height: 82px; height: 82px;
} }
.calendar-calendar div.single-day .d_8 .view-item .calendar { .calendar-calendar div.single-day .d_8 .view-item .calendar {
height: 94px; height: 94px;
} }
.calendar-calendar div.single-day .d_9 .view-item .calendar { .calendar-calendar div.single-day .d_9 .view-item .calendar {
height: 106px; height: 106px;
} }
.calendar-calendar div.single-day .d_10 .view-item .calendar { .calendar-calendar div.single-day .d_10 .view-item .calendar {
height: 118px; height: 118px;
} }
.calendar-calendar div.single-day .d_11 .view-item .calendar { .calendar-calendar div.single-day .d_11 .view-item .calendar {
height: 130px; height: 130px;
} }
.calendar-calendar div.single-day .d_12 .view-item .calendar { .calendar-calendar div.single-day .d_12 .view-item .calendar {
height: 142px; height: 142px;
} }
.calendar-calendar div.single-day .d_13 .view-item .calendar { .calendar-calendar div.single-day .d_13 .view-item .calendar {
height: 154px; height: 154px;
} }
.calendar-calendar div.single-day .d_14 .view-item .calendar { .calendar-calendar div.single-day .d_14 .view-item .calendar {
height: 166px; height: 166px;
} }
.calendar-calendar div.single-day .d_15 .view-item .calendar { .calendar-calendar div.single-day .d_15 .view-item .calendar {
height: 178px; height: 178px;
} }
.calendar-calendar div.single-day .d_16 .view-item .calendar { .calendar-calendar div.single-day .d_16 .view-item .calendar {
height: 190px; height: 190px;
} }
.calendar-calendar div.single-day .d_17 .view-item .calendar { .calendar-calendar div.single-day .d_17 .view-item .calendar {
height: 202px; height: 202px;
} }
@ -669,7 +651,7 @@
} }
.calendar-calendar .week-view div.single-day .i_0 .view-item .calendar { .calendar-calendar .week-view div.single-day .i_0 .view-item .calendar {
margin-left : 0px; margin-left: 0;
width: 55px; width: 55px;
} }

11
modules/calendar/calendar_multiday/calendar_multiday.css
View file

@ -301,7 +301,7 @@ table.calendar-legend tr.even .stripe {
border:1px solid #ccc; border:1px solid #ccc;
} }
.calendar-calendar td.empty { .calendar-calendar td.empty {
background:#ccc; background:#999;
border-color:#ccc; border-color:#ccc;
} }
.calendar-calendar table.mini td.empty { .calendar-calendar table.mini td.empty {
@ -313,6 +313,7 @@ table.calendar-legend tr.even .stripe {
border-top:none; border-top:none;
border-right:none; border-right:none;
margin-bottom:2px; margin-bottom:2px;
color: #ccc;
} }
.calendar-calendar td .inner div, .calendar-calendar td .inner div,
.calendar-calendar td .inner div a { .calendar-calendar td .inner div a {
@ -382,13 +383,13 @@ table.calendar-legend tr.even .stripe {
} }
.calendar-calendar .week-view .full .calendar-agenda-hour { .calendar-calendar .week-view .full .calendar-agenda-hour {
width : 6%; width : 12%;
min-width : 0px; min-width : 12%;
padding-right : 2px; padding-right : 2px;
} }
.calendar-calendar .week-view .full .days { .calendar-calendar .week-view #multi-day-container table tr {
width : 13%; border-right: 1px solid currentcolor;
} }
.calendar-calendar .month-view .full div.calendar, .calendar-calendar .month-view .full div.calendar,

12
themes/zuitedesk/css/suitedesk.css
View file

@ -976,10 +976,7 @@ table#stormevents td .event-title {
width: 14.2857%; width: 14.2857%;
min-width: 90px; min-width: 90px;
} }
.calendar-calendar .week-view .full th,
.calendar-calendar .week-view .full tr.all-day td.calendar-agenda-hour {
width: 12% !important;
}
.calendar-calendar .week-view .full th.today { .calendar-calendar .week-view .full th.today {
background-color: #556372; background-color: #556372;
color: #eee; color: #eee;
@ -987,12 +984,7 @@ table#stormevents td .event-title {
.calendar-calendar .month-view .full td .day { .calendar-calendar .month-view .full td .day {
width: 2em; width: 2em;
} }
.calendar-calendar .month-view .full td.empty {
background: #999 !important;
}
.calendar-calendar .month-view .full td.empty .day {
color: #ccc;
}
.calendar-calendar .day-view .full td .inner div.calendar div a { .calendar-calendar .day-view .full td .inner div.calendar div a {
margin: 0; margin: 0;
} }