2013-11-18 20:57:38 +01:00
/* $Id$ */
2014-11-04 16:34:51 +01:00
/*Media print classes*/
@ media print {
2016-04-27 00:58:35 +02:00
# calendar-view . et2_container , # calendar-planner . et2_container , # calendar-list . et2_container {
2016-03-31 22:55:41 +02:00
position : static ;
height : auto ! important ;
2014-11-04 16:34:51 +01:00
}
2016-04-27 00:58:35 +02:00
# calendar-todo . et2_container {
2016-05-10 18:03:26 +02:00
display : none ! important ;
2016-04-27 00:58:35 +02:00
}
. calendar_calDayTodos . calendar_calDayTodosTable {
position : relative ;
}
2016-03-31 22:55:41 +02:00
. calendar_plannerWidget
{
height : auto ! important ;
2014-11-04 16:34:51 +01:00
}
2016-03-31 22:55:41 +02:00
. calendar_plannerWidget . calendar_plannerHeader {
margin-right : 2px ! important ;
}
. calendar_plannerWidget . calendar_plannerRows {
height : auto ! important ;
}
. calendar_plannerWidget . verticalBar {
display : none ;
}
/* Don't split a calendar week across pages */
# calendar-view_view > tbody > tr . view_row {
page-break-inside : avoid ;
}
2016-04-27 00:58:35 +02:00
/* Try to keep it on the page */
2016-04-20 00:45:43 +02:00
. calendar_calTimeGrid {
max-height : 18cm ;
2016-04-27 00:58:35 +02:00
max-width : 90vw ;
2016-04-20 00:45:43 +02:00
}
2016-03-31 22:55:41 +02:00
. calendar_calTimeGrid . calendar_calTimeGridScroll {
2016-03-31 23:55:47 +02:00
overflow-y : hidden ! important ;
2016-03-31 22:55:41 +02:00
}
/* Let hidden user names be visible */
2016-07-06 21:18:36 +02:00
# calendar-view_view . hideDayColHeader tr : not ( : first-of-type ) . calendar_calGridHeader > span . et2_label {
2016-03-31 22:55:41 +02:00
position : static ;
}
2016-07-06 21:18:36 +02:00
# calendar-view_view . hideDayColHeader tr : not ( : first-of-type ) . calendar_calGridHeader > span . et2_label {
2016-03-31 22:55:41 +02:00
overflow : visible ! important ;
2014-11-04 16:34:51 +01:00
}
2016-07-28 11:21:09 +02:00
2016-07-28 14:10:48 +02:00
div . calendar_calEvent {
opacity : 1 ;
filter : opacity ( 0 . 85 ) ;
-webkit-filter : opacity ( 0 . 85 ) ;
}
2014-11-04 16:34:51 +01:00
}
2015-06-10 23:51:28 +02:00
/ * *
* Sidebox
* /
2016-01-28 23:08:15 +01:00
# calendar-et2_target {
position : relative ;
}
2015-06-10 23:51:28 +02:00
# calendar-sidebox_owner {
2015-10-14 16:32:33 +02:00
width : 90 % ;
2015-06-10 23:51:28 +02:00
}
2015-11-23 23:44:16 +01:00
# calendar-sidebox_owner ~ * {
vertical-align : top ;
display : inline-block ;
}
2015-06-10 23:51:28 +02:00
# calendar-sidebox_cat_id {
2015-10-14 16:32:33 +02:00
width : 90 % ;
2015-06-10 23:51:28 +02:00
}
2015-11-23 23:44:16 +01:00
# calendar-sidebox_cat_id ~ * {
vertical-align : top ;
display : inline-block ;
}
2015-06-10 23:51:28 +02:00
# calendar-sidebox_buttons tbody {
width : 100 % ;
}
2015-12-02 00:49:14 +01:00
# calendar-sidebox_date_header > button {
width : 45 % ;
}
2016-02-01 21:52:53 +01:00
2016-02-02 23:59:13 +01:00
# calendar-sidebox_header_go ,
# calendar-sidebox_header_today {
2016-02-01 21:52:53 +01:00
position : absolute ;
2016-02-02 23:59:13 +01:00
width : 12 . 0px ;
height : 12 . 0px ;
top : 28px ;
2016-02-01 21:52:53 +01:00
z-index : 1 ;
overflow : hidden ;
2016-02-02 23:59:13 +01:00
margin : 0 . 5em ;
2016-02-01 21:52:53 +01:00
font-size : 10px ;
line-height : 50 % ;
color : white ;
2016-02-09 22:45:51 +01:00
background-color : # 217bc0 ;
background-image : none ;
2016-02-01 21:52:53 +01:00
border : none ;
border-radius : 100 % ;
}
2016-02-02 23:59:13 +01:00
# calendar-sidebox_header_today {
right : 35px ;
}
# calendar-sidebox_header_go {
right : 80px ;
text-indent : -1px ;
}
# calendar-sidebox_header_go : hover , # calendar-sidebox_header_today : hover {
2016-02-01 21:52:53 +01:00
background-color : # 0c5da5 ;
2016-02-02 23:59:13 +01:00
box-shadow : none ;
}
# calendar-sidebox_date . ui-datepicker-header a {
top : 3px ;
2016-02-01 21:52:53 +01:00
}
# calendar-sidebox_date . ui-datepicker-prev {
2016-02-02 23:59:13 +01:00
right : 3em ;
2016-02-01 21:52:53 +01:00
}
2015-11-06 01:37:23 +01:00
# calendar-sidebox_weekend {
/* Special css styling goes here */
}
2016-02-01 21:52:53 +01:00
# calendar-sidebox_date . ui-datepicker . ui-datepicker-header . ui-datepicker-title {
max-width : 10em ;
}
2015-08-24 19:28:19 +02:00
# calendar-sidebox_date td . ui-datepicker-week-col {
cursor : pointer ;
}
# calendar-sidebox_date . calendar_calHoliday {
background : inherit ;
}
# calendar-sidebox_date . calendar_calHoliday a {
2016-01-21 19:37:31 +01:00
background-color : rgba ( 103 , 159 , 210 , 0 . 5 ) ;
2015-08-24 19:28:19 +02:00
}
2016-02-16 22:37:19 +01:00
# calendar-sidebox_owner . ms-helper {
padding : 2px ;
background-color : white ;
}
2015-06-10 23:51:28 +02:00
2016-07-06 16:44:06 +02:00
/* Conflict display */
div . calendar_conflicts {
max-height : 540px ;
overflow-y : auto ;
}
2016-04-19 19:31:24 +02:00
/* Loader - hide sizing behind overlay*/
# egw-loadin-prompt_calendar :: before {
opacity : 1 ;
background-color : # e6e6e6 ;
}
2016-01-06 19:24:45 +01:00
/* Toolbar */
# calendar-toolbar {
height : 30px ;
}
# calendar-toolbar . egw_fw_ui_app_header_container {
border : none ;
2016-04-01 00:58:04 +02:00
display : flex ;
align-items : center ;
min-height : 26px ;
2016-01-06 19:24:45 +01:00
}
/* Space for toolbar */
2016-01-26 23:17:51 +01:00
# calendar-view , # calendar-todo , # calendar-planner , # calendar-list {
position : absolute ;
left : 0px ;
right : 0px ;
2016-01-06 19:24:45 +01:00
}
2015-06-10 23:51:28 +02:00
# calendar-todo {
2015-10-21 21:53:19 +02:00
position : absolute ;
2015-06-10 23:51:28 +02:00
width : 30 % ;
2016-02-04 22:05:31 +01:00
margin-top : 0px ;
2016-01-26 23:17:51 +01:00
z-index : 10 ;
2015-10-21 21:53:19 +02:00
}
# calendar-view {
width : 100 % ;
2015-06-10 23:51:28 +02:00
}
2016-01-05 21:43:19 +01:00
# calendar-view_view td {
padding : 0px ;
}
2016-04-06 18:43:51 +02:00
2013-11-18 20:57:38 +01:00
. calendar_inputFullWidth input { width : 100 % ; }
2005-11-09 00:15:14 +01:00
/ * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* CSS settings for the day , week and month view ( timeGridWidget ) *
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * /
2013-11-18 20:57:38 +01:00
2006-05-31 02:33:27 +02:00
/ *
Names used in the "graphic" are the css classes from this file .
The function names in class uiviews have the leading cal removed and a trailing Widget added :
2013-11-11 15:02:08 +01:00
e . g . the div with class calendar_calTimeGrid is generated by the timeGridWidget method of uiviews .
2006-05-31 02:33:27 +02:00
2013-11-11 15:02:08 +01:00
+ + + calendar_calTimeGrid + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ # # # # calendar_calDayCols [ 12h | NoGrip ] # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # # #
+ # . . . calendar_calDayCol . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . calendar_calDayCol . . . . . . . . . . . . . . . . . . . . . . . . . .
+ # . + - calendar_calDayColHeader --------------------- + . . + - calendar_calDayColHeader ------------------ + .
2006-05-31 02:33:27 +02:00
+ # . | | . . | | .
+ # . + --------------------------------------- + . . + ------------------------------------ + .
2013-11-11 15:02:08 +01:00
+ . calendar_calTimeRowTime . # . * * calendar_calEventCol * * * * * * * calendar_calEventCol * * * * * . . * * calendar_calEventCol * * * * * * * * * * * * * * * * * * * * * * * .
2006-05-31 02:33:27 +02:00
+ . . # . * * * * . . * * .
+ . . # . * * * * . . * * .
2013-11-11 15:02:08 +01:00
+ . . . . . . . . . . . . . . . . # . * + - calendar_calEvent ----- + * * * . . * * .
+ . calendar_calTimeRowTime . # . * | | * * * . . * + - calendar_calEvent [ Private ] -------------- + * .
+ . . # . * | | * * + - calendar_calEvent ----- + * . . * | | * .
2006-05-31 02:33:27 +02:00
+ . . # . * + ---------------- + * * | | * . . * | | * .
+ . . . . . . . . . . . . . . . . # . * * * | | * . . * | | * .
2013-11-11 15:02:08 +01:00
+ . calendar_calTimeRowTime . # . * * * + ---------------- + * . . * | | * .
2006-05-31 02:33:27 +02:00
+ . . # . * * * * . . * + ---------------------------------- + * .
* /
2013-11-18 20:57:38 +01:00
2014-01-07 11:34:11 +01:00
/ * custom ui-tooltip style for calendar
* /
. calendar_uitooltip {
padding : 0px ;
position : absolute ;
border : none ;
max-height : 400px ;
z-index : 9999 ;
max-width : 300px ;
-webkit-box-shadow : 0 0 5px ;
-moz-box-shadow : 0 0 5px ;
box-shadow : 0 0 5px ;
}
2013-11-18 20:57:38 +01:00
. calendar_size120b { font-size : 120 % ; font-weight : bold ; }
2005-11-09 00:15:14 +01:00
/ * marks a day in the colum-header as today
* /
2013-11-18 20:57:38 +01:00
. calendar_calToday {
background : # ffffcc ;
2005-11-09 00:15:14 +01:00
}
2014-02-25 15:20:27 +01:00
. calendar_calWeek {
background : # ffffcc ;
width : auto ;
margin : 0 auto ;
text-align : center ;
}
. calendar_calMonth {
background : # ffffcc ;
width : auto ;
margin : 0 auto ;
text-align : center ;
}
2005-11-09 00:15:14 +01:00
/ * marks a day in the colum-header as holiday
* /
2013-11-18 20:57:38 +01:00
. calendar_calHoliday {
2016-01-21 19:37:31 +01:00
background-color : rgba ( 103 , 159 , 210 , 0 . 5 ) ;
2005-11-09 00:15:14 +01:00
}
/ * marks a day in the column-header additionaly as birthday of some contact ,
2013-11-11 15:02:08 +01:00
* it should work together with the backgrounds of calendar_calToday , calendar_calHoliday , th , row_on and row_off
2005-11-09 00:15:14 +01:00
* /
2013-11-18 20:57:38 +01:00
. calendar_calBirthday , . calendar_calBirthday a {
2016-01-19 23:09:09 +01:00
color : # 626161 ;
2005-11-09 00:15:14 +01:00
}
2016-07-29 17:35:24 +02:00
# calendar-view . calendar_calBirthday {
background-image : url ( images / cake . png ) ;
background-repeat : no-repeat ;
background-size : 16px ;
background-position : 10px center ;
}
2016-06-15 17:17:12 +02:00
/* Supress tooltips on holidays shown as events */
. calendar_calEventTooltip . calendar_calBirthday , . calendar_calEventTooltip . calendar_calHoliday {
display : none ;
}
2013-11-18 20:57:38 +01:00
2004-08-01 17:36:04 +02:00
/ * timeGridWidget , contains timeRow 's and dayCol' s
* /
2013-11-18 20:57:38 +01:00
. calendar_calTimeGrid {
position : relative ;
top : 0px ;
left : 0px ;
2015-07-02 21:31:52 +02:00
-webkit-touch-callout : none ;
-webkit-user-select : none ;
-khtml-user-select : none ;
-moz-user-select : none ;
-ms-user-select : none ;
user-select : none ;
2015-10-06 01:45:51 +02:00
overflow : hidden ;
2015-11-12 02:01:21 +01:00
display : flex ;
flex-direction : column ;
2016-03-31 22:55:41 +02:00
page-break-inside : avoid ;
2004-08-01 17:36:04 +02:00
}
2013-11-18 20:57:38 +01:00
2015-10-06 01:45:51 +02:00
. calendar_calTimeGrid . calendar_calTimeGridScroll {
2015-10-28 16:55:10 +01:00
position : relative ;
2015-10-06 01:45:51 +02:00
bottom : 0px ;
width : 100 % ;
2016-01-15 23:43:59 +01:00
height : 100 % ;
2015-10-06 01:45:51 +02:00
overflow-y : auto ;
overflow-x : hidden ;
2016-01-13 00:55:59 +01:00
cursor : default ;
2016-04-01 00:44:00 +02:00
background-color : white ;
2015-10-06 01:45:51 +02:00
}
2016-01-15 23:43:59 +01:00
. calendar_calTimeGrid . calendar_calTimeLabels {
height : 100 % ;
}
2015-08-25 02:00:45 +02:00
2016-01-05 21:43:19 +01:00
. calendar_calTimeGrid . loading , . calendar_plannerWidget . loading {
top : 0px ;
bottom : 0px ;
left : 0px ;
right : 0px ;
position : absolute ;
}
2016-04-26 00:09:57 +02:00
. calendar_calTimeGrid . loading :: before , . calendar_plannerWidget . loading :: before {
opacity : 1 ;
background-color : # E6E6E6 ;
}
2016-02-05 19:17:47 +01:00
/* Timegrid that has hit a minimum size */
. calendar_calTimeGridFixed . calendar_calTimeGridScroll {
overflow : hidden ;
}
2016-01-22 01:22:08 +01:00
/ *
Show the day headers for single week view only once .
Hide subsequent headers in week view with non-consolidated owners
* /
# calendar-view_view . hideDayColHeader tr : not ( : first-of-type ) . calendar_calGridHeader . calendar_calDayColHeader
{
min-height : 0 . 5em ;
}
# calendar-view_view . hideDayColHeader tr : not ( : first-of-type ) . calendar_calGridHeader . calendar_calDayColHeader > div [ data-date ] {
display : none ;
}
2016-09-06 17:44:52 +02:00
# calendar-view_view . hideDayColHeader tr : first-of-type . calendar_calGridHeader > span . et2_label
{
position : absolute ;
top : 2em ;
}
# calendar-view_view . hideDayColHeader tr : first-of-type . calendar_calGridHeader . calendar_calDayColHeader_spacer
{
height : ~ "calc(1.5em + 5px)" ;
}
2016-07-06 21:18:36 +02:00
# calendar-view_view . hideDayColHeader tr . calendar_calGridHeader > span . et2_label {
2016-01-22 01:22:08 +01:00
white-space : nowrap ;
2016-09-06 17:44:52 +02:00
display : block ;
position : static ;
width : ~ "calc(100% - 58px)" ;
margin-left : 58px ;
color : white ;
background-color : # 0C5DA5 ;
text-align : center ;
line-height : 1 . 5em ;
font-size : 14px ;
z-index : 35 ;
2016-01-22 01:22:08 +01:00
}
2015-10-06 01:45:51 +02:00
/ * single row in the time-line you dont need to set a bgcolor , but you can
2004-08-01 17:36:04 +02:00
* /
2015-05-06 21:03:45 +02:00
. calendar_calTimeRow {
2013-11-18 20:57:38 +01:00
width : 100 % ;
/ * set via inline style on runtime :
2004-08-01 17:36:04 +02:00
* height :
2005-11-09 00:15:14 +01:00
* top :
2004-08-01 17:36:04 +02:00
* /
}
2016-03-22 16:09:39 +01:00
. calendar_calTimeRow : not ( . calendar_calWorkHours )
{
background-color : rgba ( 120 , 120 , 120 , 0 . 1 ) ;
}
2013-11-18 20:57:38 +01:00
2004-08-01 17:36:04 +02:00
/ * time in a timeRow
* /
2016-01-19 23:09:09 +01:00
. calendar_calTimeRowTime {
2013-11-18 20:57:38 +01:00
padding-left : 5px ;
height : 100 % ;
line-height : 14px ;
font-size : 8pt ;
text-align : left ;
2004-08-01 17:36:04 +02:00
}
2016-01-19 23:09:09 +01:00
. calendar_calTimeRowTime [ data-minute = '0' ] {
border-top : 1px solid silver ;
background-image : none ;
}
2004-08-01 17:36:04 +02:00
/ * contains ( multiple ) dayCol ' s
* /
2013-11-18 20:57:38 +01:00
. calendar_calDayCols , . calendar_calDayCols12h , . calendar_calDayColsNoGrid {
position : absolute ;
2015-10-06 01:45:51 +02:00
top : 0px ;
/* bottom: 0px; does NOT work in IE, IE needs height: 100%! */
2013-11-18 20:57:38 +01:00
height : 100 % ;
2015-11-17 21:19:47 +01:00
left : 58px ;
2013-11-18 20:57:38 +01:00
right : 0px ;
2015-10-21 21:53:19 +02:00
white-space : nowrap ;
2006-03-07 09:42:06 +01:00
}
/ * 12h timeformat with am / pm
2004-08-01 17:36:04 +02:00
* /
2013-11-18 20:57:38 +01:00
. calendar_calDayCols12h {
left : 65px ;
2004-08-01 17:36:04 +02:00
}
2006-05-31 02:33:27 +02:00
/ * no time grid -- > no time column
* /
2013-11-18 20:57:38 +01:00
. calendar_calDayColsNoTime {
left : 0px ;
2006-05-31 02:33:27 +02:00
}
2013-11-18 20:57:38 +01:00
2004-08-01 17:36:04 +02:00
/ * contains ( multiple ) eventCol ' s
* /
2013-11-18 20:57:38 +01:00
. calendar_calDayCol {
position : absolute ;
top : 0px ;
2015-10-06 01:45:51 +02:00
height : 100 % ; / * set via inline style on runtime :
2004-08-01 17:36:04 +02:00
* left :
* width :
* /
2016-02-04 22:05:31 +01:00
border-left : 1px solid silver ;
transition : none ;
2004-08-01 17:36:04 +02:00
}
2013-11-11 15:02:08 +01:00
/ * Calendar Id #
* /
2014-02-06 18:36:03 +01:00
. calendar_calId : before { }
# calendar-edit_id : before { content : "#" }
2013-11-18 20:57:38 +01:00
2004-08-01 17:36:04 +02:00
/ * header for the dayCol
* /
2015-10-06 01:45:51 +02:00
. calendar_calDayColHeader , . calendar_calGridHeader , . calendar_calGridHeader > div {
2013-11-18 20:57:38 +01:00
font-size : 100 % ;
line-height : 16px ;
2015-09-03 00:40:38 +02:00
}
. calendar_calDayColHeader {
2015-11-12 17:27:39 +01:00
display : inline-block ;
2015-10-28 16:55:10 +01:00
position : relative ;
2015-10-21 21:53:19 +02:00
vertical-align : top ;
2015-10-28 16:55:10 +01:00
border-right : 1px solid silver ;
height : initial ;
2015-11-16 19:31:09 +01:00
min-height : 2em ;
2016-04-14 16:58:21 +02:00
2016-02-04 22:05:31 +01:00
transition : none ;
2015-09-03 00:40:38 +02:00
z-index : 30 ;
2015-10-28 16:55:10 +01:00
white-space : initial ;
2015-11-13 00:10:16 +01:00
padding-bottom : 2ex ;
2006-06-24 19:11:35 +02:00
}
2015-10-21 21:53:19 +02:00
. calendar_calDayColHeader > div [ data-date ] {
2016-01-19 23:09:09 +01:00
font-size : 14px ;
line-height : 27px ;
2015-10-28 16:55:10 +01:00
text-align : center ;
border-bottom : 1px solid silver ;
2016-01-26 00:47:58 +01:00
white-space : nowrap ;
overflow : hidden ;
2015-10-28 16:55:10 +01:00
}
2015-11-04 22:47:52 +01:00
2016-04-04 19:55:49 +02:00
/* Seperate long and short day names */
. calendar_calDayColHeader > div [ data-date ] . short_date ,
. calendar_calDayColHeader > div [ data-date ] . long_date {
padding-right : 1ex ;
}
. calendar_calDayColHeader > div [ data-date ] . short_date {
display : none ;
}
2015-11-04 22:47:52 +01:00
/* Indicators for offscreen events */
. calendar_calDayColHeader . hiddenEventBefore , . calendar_calDayCol . hiddenEventAfter {
width : 80 % ;
left : 10 % ;
position : absolute ;
border-radius : 5px ;
2015-11-05 23:31:47 +01:00
border : 6px solid ;
border-left : 0px ;
border-right : 0px ;
overflow : hidden ;
2015-11-04 22:47:52 +01:00
z-index : 40 ;
2016-01-13 00:55:59 +01:00
cursor : pointer ;
2015-11-04 22:47:52 +01:00
}
. calendar_calDayColHeader . hiddenEventBefore {
2015-12-17 21:12:10 +01:00
height : 2px ;
bottom : -6px ;
2015-11-04 22:47:52 +01:00
border-top : none ;
}
2015-11-05 00:05:22 +01:00
. calendar_calDayColHeader . hiddenEventBefore : hover {
2015-11-05 23:31:47 +01:00
bottom : -20px ;
height : 16px ;
border-left : 1px ;
border-right : 1px ;
border-top-left-radius : 0px ;
2015-12-16 19:39:05 +01:00
border-top-right-radius : 0px ;
2015-11-05 23:31:47 +01:00
background-color : white ;
2015-11-05 00:05:22 +01:00
}
2015-11-04 22:47:52 +01:00
. calendar_calDayCol . hiddenEventAfter {
border-bottom : none ;
2015-11-05 23:31:47 +01:00
height : 6px ;
2015-11-04 22:47:52 +01:00
}
2015-11-05 00:05:22 +01:00
. calendar_calDayCol . hiddenEventAfter : hover {
2015-11-05 23:31:47 +01:00
margin-top : -20px ;
height : 20px ;
background-color : white ;
2015-11-05 00:05:22 +01:00
}
2016-02-05 19:17:47 +01:00
. calendar_calTimeGridFixed . calendar_calDayCol . hiddenEventAfter : hover . calendar_calEvent {
position : relative ;
}
2015-11-04 22:47:52 +01:00
2016-02-05 00:14:54 +01:00
/* Days in a different month, but shown to fill out the week */
. calendar_calDayColHeader . calendar_differentMonth > * {
color : rgb ( 106 , 106 , 106 ) ;
}
. calendar_calDayCol . calendar_differentMonth {
background-color : rgba ( 200 , 200 , 200 , 0 . 1 ) ;
}
2016-01-08 23:38:11 +01:00
/* Daily sortable */
. calendar_calDayColHeader . ui-sortable-handle {
cursor : ew-resize ;
}
2015-11-04 22:47:52 +01:00
2015-10-28 16:55:10 +01:00
. calendar_calDayColAllDay {
display : flex ;
flex-wrap : wrap ;
2015-11-12 02:01:21 +01:00
flex-direction : row ;
align-items : flex-start ;
2015-10-28 16:55:10 +01:00
width : 100 % ;
2015-11-12 02:01:21 +01:00
2016-02-04 23:35:34 +01:00
/* Set max height of all day section */
max-height : 4 . 2em ;
overflow : hidden ;
}
/* If more all day events than shown, show ellipsis & show all on hover */
. calendar_calDayColHeader . calendar_calDayColAllDay . overflown : hover {
max-height : none ;
overflow : visible ;
position : absolute ;
background-color : # f0f0f0 ;
z-index : 50 ;
padding-bottom : 2ex ;
}
. calendar_calDayColHeader . calendar_calDayColAllDay . overflown : not ( : hover ) :: after {
content : "\02026" ;
line-height : 0 . 5em ;
height : 1em ;
position : absolute ;
bottom : 0px ;
left : 0px ;
right : 0px ;
text-align : center ;
}
2016-04-21 22:30:48 +02:00
. calendar_calDayColAllDay . calendar_calEventHeader {
display : none ;
}
2015-11-12 02:01:21 +01:00
. calendar_calDayColAllDay > . calendar_calEventBodySmall {
white-space : nowrap ;
2015-10-21 21:53:19 +02:00
}
2015-10-06 01:45:51 +02:00
. calendar_calGridHeader > div {
2015-10-28 16:55:10 +01:00
position : relative ;
height : 100 % ;
2016-01-19 23:09:09 +01:00
margin-left : 58px ;
2015-10-06 01:45:51 +02:00
width : initial ;
2015-10-21 21:53:19 +02:00
white-space : nowrap ;
2015-11-06 01:41:08 +01:00
border-left : 1px solid silver ;
2015-11-12 17:27:39 +01:00
display : flex ;
align-items : stretch ;
2015-10-06 01:45:51 +02:00
}
2015-10-28 16:55:10 +01:00
. calendar_calGridHeader > label {
float : left ;
2016-01-19 23:09:09 +01:00
font-size : 14px ;
line-height : 27px ;
width : 58px ;
text-align : center ;
2016-09-06 17:44:52 +02:00
position : absolute ;
top : 0px ;
2015-10-28 16:55:10 +01:00
}
2016-01-22 01:22:08 +01:00
2016-07-06 21:18:36 +02:00
. calendar_calGridHeader > span . et2_label {
2016-01-22 01:22:08 +01:00
position : absolute ;
width : 55px ;
}
2015-10-28 16:55:10 +01:00
. calendar_TimeGridNoLabel > . calendar_calGridHeader > ul {
display : none ;
}
2013-11-11 15:02:08 +01:00
. calendar_calDayColHeader img {
2013-11-18 20:57:38 +01:00
vertical-align : middle ;
2004-08-01 17:36:04 +02:00
}
2014-02-25 15:50:35 +01:00
. calendar_calWeekNavHeader , . calendar_calMonthNavHeader {
top : 0px ;
left : 0px ;
width : 100 % ;
right : 0px ;
}
. calendar_calWeekNavHeader , . calendar_calMonthNavHeader img {
vertical-align : middle ;
}
2013-11-11 15:02:08 +01:00
. calendar_calViewUserNameBox {
2013-11-18 20:57:38 +01:00
position : absolute ;
top : -1px ;
width : 95 % ;
text-align : left ;
font-size : 120 % ;
white-space : nowrap ;
border : 1px solid gray ;
height : 17px ;
left : -1px ;
padding-top : 0px ;
padding-left : 10px ;
background : # dac0c0 ;
2004-08-01 17:36:04 +02:00
}
2013-11-11 15:02:08 +01:00
. calendar_calViewUserName {
2013-11-18 20:57:38 +01:00
font-weight : normal ;
2004-08-01 17:36:04 +02:00
}
2013-11-11 15:02:08 +01:00
. calendar_calViewUserName : first-letter {
2013-11-18 20:57:38 +01:00
text-transform : uppercase ;
}
. calendar_calViewUserNameFirst {
2004-08-01 17:36:04 +02:00
}
2013-11-11 15:02:08 +01:00
. calendar_calViewUserNameFirst : after {
2013-11-18 20:57:38 +01:00
content : ", " ;
2004-08-01 17:36:04 +02:00
}
2014-05-27 17:02:56 +02:00
/ * alarm_date widget disabled class
* /
. calendar_alarm_date_display {
2016-09-12 18:58:15 +02:00
display : none ! important ;
2014-05-27 17:02:56 +02:00
}
2014-06-04 09:32:17 +02:00
/*overwirte margin applied by egwGridView*/
. calendar_alarm_grid {
margin-left : 0 ! important ;
}
2004-08-01 17:36:04 +02:00
/ * header of the time-grid , eg . for the weeks in the month-view ( leftmost of the day-col-headers )
* /
2013-11-18 20:57:38 +01:00
. calendar_calGridHeader {
text-align : left ;
2015-09-03 00:40:38 +02:00
z-index : 29 ;
2015-10-28 16:55:10 +01:00
border-bottom : 1px solid silver ;
2016-01-13 19:14:27 +01:00
border-top : 1px solid silver ;
2016-01-22 01:22:08 +01:00
min-height : 1ex ;
2015-11-12 02:01:21 +01:00
flex : 0 0 auto ;
2015-09-03 00:40:38 +02:00
}
# calendar-view_view tbody . ui-sortable {
cursor : default ;
}
# calendar-view_view tbody . ui-sortable . calendar_calGridHeader {
cursor : ns-resize ;
}
2016-04-05 23:38:49 +02:00
# calendar-view_view tbody . ui-sortable-disabled . calendar_calGridHeader ,
# calendar-view_view tbody . ui-sortable-disabled . calendar_calGridHeader label {
2015-09-03 00:40:38 +02:00
cursor : pointer ;
2004-08-01 17:36:04 +02:00
}
2013-11-18 20:57:38 +01:00
2004-08-01 17:36:04 +02:00
/ * contains ( multiple ) events ' s
* /
2013-11-18 20:57:38 +01:00
. calendar_calEventCol {
position : absolute ;
top : 0px ;
/* bottom: 0px; does NOT work in IE, IE needs height: 100%! */
height : 100 % ;
/ * set via inline style on runtime :
2004-08-01 17:36:04 +02:00
* left :
* width :
* /
}
2013-11-18 20:57:38 +01:00
2004-08-01 17:36:04 +02:00
/ * contains one event : header-row & -body
* /
2016-01-18 21:02:35 +01:00
. calendar_calEvent {
2013-11-18 20:57:38 +01:00
position : absolute ;
left : 0px ;
right : 0px ;
overflow : hidden ;
z-index : 20 ;
2016-01-18 21:02:35 +01:00
padding-left : 6px ;
2015-09-14 17:31:58 +02:00
min-height : 1 . 2em ;
min-width : 5px ;
2015-06-10 23:51:28 +02:00
/* It is important there are no CSS transitions, it breaks resize */
-webkit-transition : none ;
-moz-transition : none ! important ;
-o-transition : none ! important ;
-ms-transition : none ! important ;
transition : none ! important ;
2016-01-12 11:22:40 +01:00
2016-01-20 23:27:41 +01:00
opacity : 0 . 85 ;
2016-07-28 14:10:48 +02:00
-moz-opacity : 0 . 85 ;
2016-01-26 00:47:58 +01:00
2013-11-18 20:57:38 +01:00
/ * set via inline style on runtime :
2004-08-01 17:36:04 +02:00
* top : depending on startime
2005-11-09 00:15:14 +01:00
* height : depending on length
2006-06-02 21:38:08 +02:00
* border-color : depending on category
* background : depending on category ( shade )
2015-05-06 21:03:45 +02:00
*
2004-08-01 17:36:04 +02:00
* /
2015-10-09 18:33:34 +02:00
border-color : # 808080 ;
2016-01-18 21:02:35 +01:00
background-color : # 808080 ;
2015-10-07 00:47:45 +02:00
}
2015-11-12 19:22:48 +01:00
2016-02-23 23:23:01 +01:00
. calendar_calEvent : not ( . rowNoView ) : hover {
2013-11-18 20:57:38 +01:00
cursor : pointer ;
2004-08-01 17:36:04 +02:00
}
2013-11-18 20:57:38 +01:00
2016-02-02 22:12:44 +01:00
/** Multi-line ellipsis */
. calendar_calEvent . calendar_calEventBody {
overflow : hidden ;
}
. calendar_calTimeGrid : not ( . calendar_calTimeGridList ) * : not ( . calendar_calDayColAllDay ) > . calendar_calEvent :: after {
width : 100 % ;
background-color : rgba ( 255 , 255 , 255 , 0 . 9 ) ;
2016-02-03 17:52:28 +01:00
height : 5px ;
2016-02-02 22:12:44 +01:00
content : "\02026" ;
left : 0px ;
float : right ;
padding-bottom : 5em ;
text-indent : 5px ;
2016-02-03 17:52:28 +01:00
line-height : 5px ;
2016-02-02 22:12:44 +01:00
}
2015-05-06 21:03:45 +02:00
/ * *
* User has not accepted the invitation
* /
. calendar_calEventUnknown {
2015-11-13 16:51:41 +01:00
border-color : white ;
}
. calendar_calEventUnknown . calendar_calEventBody ,
. calendar_calEventUnknown . calendar_calEventBodySmall {
2015-05-06 21:03:45 +02:00
background-color : white ! important ;
}
2009-11-18 14:58:01 +01:00
/ * *
* All participants accepted the invitation
* /
2013-11-11 15:02:08 +01:00
. calendar_calEventAllAccepted {
2009-11-18 14:58:01 +01:00
}
2013-11-18 20:57:38 +01:00
2009-11-18 14:58:01 +01:00
/ * *
* All participants answered the invitation , but not all accepted
* /
2013-11-11 15:02:08 +01:00
. calendar_calEventAllAnswered {
2016-01-19 23:09:09 +01:00
background-image : linear-gradient ( transparent 50 % , rgba ( 255 , 255 , 255 , . 8 ) 50 % ) ;
background-repeat : repeat-y ;
background-size : 6px 2px ;
2009-11-18 14:58:01 +01:00
}
2013-11-18 20:57:38 +01:00
2009-11-18 14:58:01 +01:00
/ * *
* Some participants did NOT answer the invitation
* /
2015-11-12 19:22:48 +01:00
. calendar_calEventSomeUnknown : not ( . calendar_calEventUnknown ) {
2016-01-19 23:09:09 +01:00
background-image : linear-gradient ( transparent 50 % , rgba ( 255 , 255 , 255 , . 5 ) 50 % ) ;
background-repeat : repeat-y ;
background-size : 6px 5px ;
2015-11-12 19:22:48 +01:00
}
2016-01-19 23:09:09 +01:00
. calendar_calEvent : not ( [ class * = " cat_" ] ) {
2015-11-12 19:22:48 +01:00
/* Defaults for no category, so we don't override it */
background-color : # 808080 ;
2013-11-18 20:57:38 +01:00
}
2015-10-21 21:53:19 +02:00
/ * *
* Events in the header ( all day )
* /
. calendar_calDayColHeader . calendar_calEvent {
position : static ;
display : inline-block ;
2015-10-28 16:55:10 +01:00
white-space : nowrap ;
/* This determines how many per line */
2015-11-12 22:02:24 +01:00
flex : 1 1 auto ;
2015-10-21 21:53:19 +02:00
}
2015-11-12 02:01:21 +01:00
. calendar_calDayColHeader . calendar_calEvent . calendar_calEventBody {
white-space : nowrap ;
}
2013-11-18 20:57:38 +01:00
. calendar_calEventTooltip {
2016-01-18 21:02:35 +01:00
padding-left : 6px ;
2013-11-18 20:57:38 +01:00
max-height : 400px ;
2015-11-24 21:05:45 +01:00
min-width : 25ex ;
2013-11-18 20:57:38 +01:00
overflow : auto ;
}
2016-01-19 23:09:09 +01:00
/* Do not show icons in header, only tooltip */
. calendar_calEventTooltip . calendar_calEventIcons {
display : inline-block ;
}
. calendar_calEventTooltip . calendar_calEventBody ,
2015-10-15 23:34:07 +02:00
. calendar_calEventTooltip . calendar_calEventBodySmall {
padding-bottom : 1em ;
}
2016-01-18 21:02:35 +01:00
. calendar_calEventTooltip img {
max-width : 1 . 5em ;
}
2013-11-18 20:57:38 +01:00
. calendar_calAddEvent {
width : 100 % ;
z-index : 10 ;
2006-06-02 21:38:08 +02:00
}
2013-11-18 20:57:38 +01:00
. calendar_calAddEvent : hover {
background-color : # D2D7FF ;
cursor : pointer ;
}
2004-08-01 17:36:04 +02:00
/ * header-row of the event
* /
2013-11-18 20:57:38 +01:00
. calendar_calEventHeader , . calendar_calEventHeaderSmall {
position : relative ; /* as the calendar_calEventIcons use postion: absolute! */
text-align : left ;
left : 0px ;
right : 0px ;
padding-left : 2px ;
2015-09-14 17:31:58 +02:00
min-height : 1em ;
2015-11-12 02:01:21 +01:00
overflow : hidden ;
2016-01-19 23:09:09 +01:00
white-space : nowrap ;
2016-01-20 23:27:41 +01:00
text-overflow : ellipsis ;
2013-11-18 20:57:38 +01:00
/ * set via inline style on runtime
2006-06-02 21:38:08 +02:00
* background-color : depending on category
2008-09-13 14:43:14 +02:00
* color : white | | black depending on cat ;
2006-06-02 21:38:08 +02:00
* /
2016-01-18 21:02:35 +01:00
background-color : rgba ( 255 , 255 , 255 , 0 . 9 ) ;
2004-08-01 17:36:04 +02:00
}
2016-01-28 22:35:22 +01:00
. calendar_calEventHeader . calendar_calEventTitle {
display : none ;
}
2013-11-18 20:57:38 +01:00
. calendar_calEventHeaderSmall {
font-size : 8pt ;
line-height : 10pt ;
2004-08-01 17:36:04 +02:00
}
2013-11-18 20:57:38 +01:00
. calendar_calEventIcons {
position : absolute ;
right : 0px ;
top : 0px ;
2016-01-19 23:09:09 +01:00
/* Do not show icons in header, only tooltip */
display : none ;
2006-06-02 21:38:08 +02:00
}
2013-11-18 20:57:38 +01:00
. calendar_calEventIcons img {
2015-11-24 21:05:45 +01:00
height : 13px ;
2010-01-21 04:00:53 +01:00
}
2013-11-18 20:57:38 +01:00
. calendar_calEventHeaderSmall . calendar_calEventIcons img {
height : 13px ;
2006-06-24 19:11:35 +02:00
}
2013-11-18 20:57:38 +01:00
2004-08-01 17:36:04 +02:00
/ * body of the event
* /
2013-11-18 20:57:38 +01:00
. calendar_calEventBody , . calendar_calEventBodySmall {
padding : 0px 3px 0px ;
left : 2px ;
right : 2px ;
height : 99 % ;
2015-11-11 19:48:41 +01:00
white-space : normal ;
2016-01-18 21:02:35 +01:00
background-color : rgba ( 255 , 255 , 255 , 0 . 9 ) ;
2004-08-01 17:36:04 +02:00
}
2015-11-11 19:48:41 +01:00
. calendar_calEventBody > p , . calendar_calEventBodySmall > p {
white-space : pre-wrap ;
}
2016-01-13 00:55:59 +01:00
. calendar_calEventBody . calendar_calTimespan {
display : none ;
}
2016-04-21 22:30:48 +02:00
. calendar_calTimeGrid . calendar_calEventBodySmall {
2013-11-18 20:57:38 +01:00
font-size : 95 % ;
2004-08-01 17:36:04 +02:00
}
2013-11-18 20:57:38 +01:00
. calendar_calEventLabel {
font-weight : bold ;
font-size : 90 % ;
2004-08-01 17:36:04 +02:00
}
2013-11-18 20:57:38 +01:00
. calendar_calEventTitle {
font-weight : bold ;
2004-08-01 17:36:04 +02:00
}
2013-11-18 20:57:38 +01:00
2016-01-28 22:35:22 +01:00
/* Event is too small for full display */
. calendar_calTimeGrid : not ( . calendar_calTimeGridList )
. calendar_calEventSmall [ data-visible_lines = '1' ] . calendar_calTimespan {
display : none ;
}
. calendar_calTimeGrid : not ( . calendar_calTimeGridList )
. calendar_calEventSmall [ data-visible_lines = '2' ] . calendar_calTimespan ,
. calendar_calTimeGrid : not ( . calendar_calTimeGridList )
. calendar_calEventSmall [ data-visible_lines = '3' ] . calendar_calTimespan {
display : inline ;
}
. calendar_calTimeGrid : not ( . calendar_calTimeGridList )
. calendar_calEventSmall [ data-visible_lines = '1' ] . calendar_calEventTitle ,
. calendar_calTimeGrid : not ( . calendar_calTimeGridList )
. calendar_calEventSmall [ data-visible_lines = '2' ] . calendar_calEventTitle ,
. calendar_calTimeGrid : not ( . calendar_calTimeGridList )
. calendar_calEventSmall [ data-visible_lines = '3' ] . calendar_calEventTitle {
display : inline ;
}
. calendar_calTimeGrid : not ( . calendar_calTimeGridList )
. calendar_calEventSmall . calendar_calEventBody {
2016-02-02 22:12:44 +01:00
padding-top : 4em ;
2016-01-28 22:35:22 +01:00
}
2016-04-18 21:03:35 +02:00
. calendar_plannerRowWidget . calendar_calEvent : not ( . calendar_calEventSmall ) . calendar_calTimespan {
display : none ;
}
. calendar_plannerRowWidget . calendar_calEvent : not ( . calendar_calEventSmall ) . calendar_calEventHeader . calendar_calEventTitle {
display : inline ;
2016-04-20 17:07:01 +02:00
font-weight : normal ;
2016-04-18 21:03:35 +02:00
}
2016-01-28 22:35:22 +01:00
2016-01-13 00:55:59 +01:00
/* Events as displayed in a list, not sized by time */
. calendar_calTimeGridList . calendar_calTimeGridScroll {
overflow-y : hidden ;
}
. calendar_calTimeGridList . calendar_calGridHeader {
min-height : 1em ;
}
. calendar_calTimeGridList . calendar_calDayColAllDay {
display : none ;
}
. calendar_calTimeGridList . calendar_calDayColHeader {
min-height : initial ;
padding-bottom : 0px ;
}
2016-01-13 19:14:27 +01:00
. calendar_calTimeGridList . calendar_calDayColHeader > div [ data-date ] {
border : none ;
}
2016-02-02 22:12:44 +01:00
. calendar_calTimeGridList . calendar_calDayCol > div . event_wrapper
2016-01-15 21:22:55 +01:00
{
position : absolute ;
top : 0px ;
bottom : 3em ;
width : 100 % ;
}
2016-01-13 00:55:59 +01:00
. calendar_calTimeGridList . calendar_calEvent {
2016-01-14 22:24:01 +01:00
height : 1 . 1em ;
2016-01-13 00:55:59 +01:00
position : relative ;
2016-01-14 22:24:01 +01:00
border : none ;
border-bottom : none ;
border-right : none ;
border-radius : 0px ;
padding-left : 6px ;
2016-01-13 00:55:59 +01:00
}
. calendar_calTimeGridList . calendar_calEvent : not ( [ data-full_day ] ) {
}
. calendar_calTimeGridList . calendar_calEventHeader {
display : none ! important ;
}
. calendar_calTimeGridList . calendar_calEventTitle {
font-weight : normal ;
display : inline-block ;
white-space : nowrap ;
2016-01-14 22:24:01 +01:00
flex : 1 1 ;
overflow : hidden ;
text-overflow : ellipsis ;
2016-01-13 00:55:59 +01:00
}
2016-01-14 22:24:01 +01:00
. calendar_calTimeGridList . calendar_calEventBody {
2016-01-13 00:55:59 +01:00
overflow : hidden ;
2016-01-14 22:24:01 +01:00
border : none ;
2016-01-14 22:52:40 +01:00
background : white ! important ;
2016-01-14 22:24:01 +01:00
height : 100 % ;
padding-left : 6px ;
display : flex ;
2016-01-13 00:55:59 +01:00
}
. calendar_calTimeGridList . calendar_calEventBody . calendar_calTimespan {
display : inline-block ;
2016-01-14 22:24:01 +01:00
text-align : right ;
padding-right : 1px ;
2016-01-13 00:55:59 +01:00
opacity : 0 . 8 ;
2016-01-14 22:24:01 +01:00
font-size : 90 % ;
flex : 0 0 auto ;
2016-01-13 00:55:59 +01:00
}
. calendar_calTimeGridList . calendar_calEventBody > p {
display : none ;
}
2016-01-14 22:24:01 +01:00
. calendar_calTimeGridList . calendar_calDayCol . hiddenEventAfter {
left : 0px ;
width : 100 % ;
margin-top : -1 . 5ex ;
height : 2 . 1ex ;
border-bottom-left-radius : 0px ;
overflow : visible ;
}
. calendar_calTimeGridList . calendar_calDayCol . hiddenEventAfter : before {
content : attr ( data-hidden_label ) ;
display : block ;
height : 100 % ;
min-height : 3ex ;
2016-01-14 22:52:40 +01:00
background : white ;
2016-01-14 22:24:01 +01:00
z-index : 21 ;
2016-01-15 21:22:55 +01:00
padding-left : 12px ;
2016-01-14 22:24:01 +01:00
}
2016-01-13 00:55:59 +01:00
. calendar_calTimeGridList . calendar_calDayCol . hiddenEventAfter : hover {
/* Need !important to override calculated height*/
top : initial ! important ;
bottom : 0px ;
white-space : pre ;
2016-01-14 22:52:40 +01:00
background : white ;
2016-01-13 00:55:59 +01:00
height : 100 % ;
2016-01-14 22:24:01 +01:00
overflow : auto ;
}
. calendar_calTimeGridList . calendar_calDayCol . hiddenEventAfter : hover : before {
display : none ;
2016-01-13 00:55:59 +01:00
}
2005-11-09 00:15:14 +01:00
/ * table of the dayView containing 2 cols : 1 ) day-view , 2 ) todos
2004-08-01 17:36:04 +02:00
* /
2013-11-18 20:57:38 +01:00
. calendar_calDayView {
width : 100 % ;
2005-11-09 00:15:14 +01:00
}
/ * calDayTods is the day-view ' s todo column , containing the calDayTodoHeader and the calDayTodoTable
* /
2013-11-11 15:02:08 +01:00
. calendar_calDayTodos . calendar_calDayTodosHeader {
2013-11-18 20:57:38 +01:00
margin : 0px ;
padding : 2px ;
font-weight : bold ;
2016-07-12 18:24:03 +02:00
height : 23px ;
line-height : 23px ;
2004-08-01 17:36:04 +02:00
}
2013-11-11 15:02:08 +01:00
. calendar_calDayTodos . calendar_calDayTodosTable {
2013-11-18 20:57:38 +01:00
overflow : auto ;
2015-12-02 17:17:04 +01:00
position : absolute ;
2016-07-12 18:24:03 +02:00
top : 3em ;
2015-12-02 17:17:04 +01:00
bottom : 8px ;
2015-12-28 18:59:47 +01:00
width : 100 % ;
2004-08-01 17:36:04 +02:00
}
2013-11-11 15:02:08 +01:00
. calendar_calDayTodos {
2014-08-21 14:20:44 +02:00
width : 98 % ;
2013-11-18 20:57:38 +01:00
margin-left : 10px ;
border : 1px solid silver ;
2004-03-13 00:43:25 +01:00
}
2013-11-11 15:02:08 +01:00
. calendar_calDayTodosHeader {
2013-11-18 20:57:38 +01:00
text-align : center ;
2005-11-19 20:07:53 +01:00
}
2016-04-27 00:58:35 +02:00
. calendar_calDayTodosTable tr {
page-break-inside : avoid ;
}
2015-12-28 18:59:47 +01:00
. calendar_calDayTodosTable tr td span : first-child {
white-space : nowrap ;
}
2013-11-18 20:57:38 +01:00
2016-07-12 18:24:03 +02:00
. calendar_calDayTodosHeader button {
width : 24px ;
height : 24px ;
padding-left : 0px ;
margin : 0px 4px 1px 0 ;
border-radius : 3px ;
border : 1px solid silver ;
background-color : # fafafa ;
position : absolute ;
left : 12px ;
}
2005-11-09 00:15:14 +01:00
/ * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
2013-11-11 15:02:08 +01:00
* CSS settings for the planner views ( calendar_plannerWidget ) *
2005-11-09 00:15:14 +01:00
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * /
2013-11-18 20:57:38 +01:00
2013-11-11 15:02:08 +01:00
/ * calendar_plannerWidget represents the whole planner , consiting of the calendar_plannerHeader and multiple plannerRowWidgets
2005-11-09 00:15:14 +01:00
* /
2013-11-11 15:02:08 +01:00
. calendar_plannerWidget {
2013-11-18 20:57:38 +01:00
position : relative ;
top : 0px ;
left : 0px ;
width : 99 . 5 % ;
2004-03-14 23:30:50 +01:00
}
2015-10-27 20:08:33 +01:00
. calendar_plannerWidget > div : not ( . calendar_plannerHeader ) {
overflow-y : auto ;
overflow-x : hidden ;
2015-06-25 19:44:28 +02:00
}
2013-11-11 15:02:08 +01:00
/ * calendar_plannerHeader contains a calendar_plannerHeaderTitle and multiple calendar_plannerHeaderRows
2005-11-09 00:15:14 +01:00
* /
2013-11-11 15:02:08 +01:00
. calendar_plannerHeader {
2013-11-18 20:57:38 +01:00
position : relative ;
top : 0px ;
left : 0px ;
2004-03-14 23:30:50 +01:00
}
2016-01-22 00:07:29 +01:00
. calendar_plannerRows {
position : relative ;
}
. calendar_plannerGrid {
position : absolute ;
top : 0px ;
bottom : 0px ;
left : 172px ;
right : 0px ;
overflow : hidden ;
height : 100 % ;
border-left : 1px solid silver ;
margin-left : -1px ;
}
. calendar_plannerGrid > . calendar_plannerScale ,
. calendar_plannerGrid > . calendar_plannerScaleDay {
height : 100 % ;
position : absolute ;
}
. calendar_plannerGrid . calendar_calToday , . calendar_plannerGrid . calendar_calHoliday {
background-color : initial ;
}
. calendar_plannerGrid > div : nth-last-child ( 2 ) > div {
border : none ;
border-right : 1px solid silver ;
}
. calendar_plannerGrid > div : last-child > div {
border : none ;
}
. calendar_plannerGrid > div : last-child > div : not ( : first-child ) {
background-image : linear-gradient ( 0deg , rgba ( 192 , 192 , 192 , 0 . 75 ) 4px , transparent 0 % ) ;
background-position : top left ;
background-size : 1px 10px ;
background-repeat : repeat-y ;
}
2013-11-11 15:02:08 +01:00
/ * calendar_plannerRowWidget contains a calendar_plannerRowHeader and multiple eventRowWidgets in an calendar_eventRows
2005-11-09 00:15:14 +01:00
* /
2013-11-11 15:02:08 +01:00
. calendar_plannerRowWidget {
2013-11-18 20:57:38 +01:00
position : relative ;
top : 0px ;
left : 0px ;
width : 100 % ;
2015-06-25 19:44:28 +02:00
min-height : 20px ;
2004-03-14 23:30:50 +01:00
}
2016-01-20 23:27:41 +01:00
. calendar_plannerRowWidget : not ( : first-child ) {
border-top : 1px solid silver ;
2015-10-27 20:08:33 +01:00
}
2015-12-29 17:01:27 +01:00
. calendar_plannerRowWidget [ data-has_children ] : before {
padding-right : 20px ;
position : absolute ;
2016-01-05 22:34:49 +01:00
content : " \25B6" ;
2015-12-29 17:01:27 +01:00
background-repeat : no-repeat ;
left : 10px ;
top : 2px ;
}
2015-11-05 23:31:47 +01:00
. calendar_plannerRowWidget : hover {
background-color : rgba ( 103 , 159 , 210 , 0 . 2 ) ;
}
2013-11-18 20:57:38 +01:00
2013-11-11 15:02:08 +01:00
/ * calendar_plannerScale represents a scale-row of the calendar_plannerHeader , containing multiple planner { D a y | W e e k | M o n t h } Scales
2005-11-09 00:15:14 +01:00
* /
2013-11-18 20:57:38 +01:00
. calendar_plannerScale , . calendar_plannerScaleDay {
position : relative ;
top : 0px ;
left : 0 % ;
width : 100 % ;
height : 20px ;
line-height : 20px ;
2016-04-19 22:27:09 +02:00
display : flex ;
flex-wrap : nowrap ;
align-content : stretch ;
2004-03-14 23:30:50 +01:00
}
2013-11-18 20:57:38 +01:00
. calendar_plannerDayScale , . calendar_plannerMonthScale , . calendar_plannerWeekScale , . calendar_plannerHourScale , . calendar_plannerDayOfMonthScale {
position : absolute ;
top : 0px ;
/* left+width: is set by the code on runtime */
text-align : center ;
height : 100 % ;
2016-01-20 23:27:41 +01:00
border-right : 1px solid silver ;
border-bottom : 1px solid silver ;
min-height : 2ex ;
2013-11-18 20:57:38 +01:00
/ * set via inline style on runtime :
2008-09-13 14:43:14 +02:00
* left :
* width :
2005-11-09 00:15:14 +01:00
* /
2004-03-10 01:15:12 +01:00
}
2016-04-19 22:27:09 +02:00
. calendar_plannerDayScale , . calendar_plannerWeekScale , . calendar_plannerHourScale {
position : static ;
flex : 1 1 14 % ;
}
2013-11-11 15:02:08 +01:00
. calendar_plannerHourScale {
2013-11-18 20:57:38 +01:00
font-size : 90 % ;
2004-03-13 00:43:25 +01:00
}
2013-11-11 15:02:08 +01:00
. calendar_plannerDayScale {
2013-11-18 20:57:38 +01:00
font-size : 90 % ;
2004-03-13 00:43:25 +01:00
}
2013-11-11 15:02:08 +01:00
. calendar_plannerWeekScale {
2013-11-18 20:57:38 +01:00
line-height : 20px ;
2004-03-13 00:43:25 +01:00
}
2013-11-11 15:02:08 +01:00
. calendar_plannerMonthScale {
2013-11-18 20:57:38 +01:00
font-weight : bold ;
2004-03-13 00:43:25 +01:00
}
2013-11-18 20:57:38 +01:00
. calendar_plannerDayScale img , . calendar_plannerWeekScale img , . calendar_plannerMonthScale img , . calendar_plannerDayOfMonthScale img {
vertical-align : middle ;
2004-03-13 00:43:25 +01:00
}
2013-11-18 20:57:38 +01:00
2013-11-11 15:02:08 +01:00
/ * calendar_plannerRowHeader contains the user or category name of the calendar_plannerRowWidget
2005-11-09 00:15:14 +01:00
* /
2013-11-18 20:57:38 +01:00
. calendar_plannerRowHeader , . calendar_plannerHeaderTitle {
position : absolute ;
top : 0px ;
left : 0 % ;
2015-12-29 17:01:27 +01:00
width : 150px ;
2013-11-18 20:57:38 +01:00
height : 100 % ;
line-height : 20px ;
2015-11-23 21:51:07 +01:00
text-overflow : ellipsis ;
white-space : nowrap ;
overflow : hidden ;
2016-01-05 21:43:19 +01:00
padding-left : 20px ;
2016-01-22 00:07:29 +01:00
padding-right : 1px ;
2015-11-23 21:51:07 +01:00
}
. calendar_plannerRowHeader : hover {
overflow : visible ;
z-index : 30 ;
2016-01-05 21:43:19 +01:00
cursor : pointer ;
2004-03-13 00:43:25 +01:00
}
2016-01-22 00:07:29 +01:00
. calendar_plannerHeaderTitle {
border-right : 1px solid silver ;
}
2016-01-12 11:22:40 +01:00
2013-11-11 15:02:08 +01:00
/ * calendar_eventRows contain multiple eventRowWidgets
2005-11-09 00:15:14 +01:00
* /
2013-11-18 20:57:38 +01:00
. calendar_eventRows , . calendar_plannerHeaderRows {
position : relative ;
top : 0px ;
2016-01-15 21:51:12 +01:00
left : 0px ;
right : 0px ;
margin-left : 172px ; /* need to be identical for calendar_eventRows and calendar_plannerHeaderRows and match width of calendar_plannerRowHeader/calendar_plannerHeaderTitle */
2015-06-25 19:44:28 +02:00
min-height : 20px ;
height : 100 % ;
2004-03-13 00:43:25 +01:00
}
2015-11-05 23:31:47 +01:00
. calendar_plannerWidget . verticalBar {
2015-11-06 23:57:27 +01:00
width : 8ex ;
2015-11-05 23:31:47 +01:00
height : 100 % ;
position : absolute ;
top : 0px ;
border-right : 1px dotted ;
pointer-events : none ;
z-index : 40 ;
2015-12-16 23:58:26 +01:00
display : none ;
2015-11-05 23:31:47 +01:00
}
2015-11-06 23:57:27 +01:00
. calendar_plannerWidget . verticalBar > span {
position : absolute ;
bottom : 0px ;
right : 0px ;
background-color : rgba ( 255 , 255 , 255 , . 8 ) ;
}
2013-11-18 20:57:38 +01:00
2010-01-17 03:03:11 +01:00
/ * *
* Filler for month with less then 31 days in yearly planner
* /
2013-11-11 15:02:08 +01:00
. calendar_eventRowsFiller {
2013-11-18 20:57:38 +01:00
position : absolute ;
top : 0px ;
2016-05-25 23:30:30 +02:00
right : 0px ;
2013-11-18 20:57:38 +01:00
height : 93 % ;
background-color : white ;
border : 1px dashed gray ;
border-right : none ;
2010-01-17 03:03:11 +01:00
}
2013-11-18 20:57:38 +01:00
2010-01-17 03:03:11 +01:00
/ * *
* Weekend or other special days in yearly planner
* /
2013-11-11 15:02:08 +01:00
. calendar_eventRowsMarkedDay {
2013-11-18 20:57:38 +01:00
position : absolute ;
top : 0px ;
height : 100 % ;
z-index : 10 ;
2010-01-17 03:03:11 +01:00
}
2015-06-25 19:44:28 +02:00
. calendar_eventRowsMarkedDay . calendar_weekend {
background-color : # e0e0e0 ;
}
2013-11-18 20:57:38 +01:00
2013-11-11 15:02:08 +01:00
/ * calendar_eventRowWidget contains non-overlapping events
2005-11-09 00:15:14 +01:00
* /
2013-11-11 15:02:08 +01:00
. calendar_eventRowWidget {
2013-11-18 20:57:38 +01:00
position : relative ;
top : 0px ;
left : 0px ;
width : 100 % ;
height : 20px ;
border : 1px solid white ;
}
2016-01-19 23:09:09 +01:00
. calendar_plannerWidget . calendar_calEventHeader , . calendar_calEventHeaderSmall {
2013-11-18 20:57:38 +01:00
height : 100 % ;
padding-top : 2px ;
2004-03-14 23:30:50 +01:00
}
2016-04-04 18:38:23 +02:00
. calendar_plannerWidget . calendar_calEventSmall [ data-full_day = 'true' ] . calendar_calTimespan {
display : none ;
}
. calendar_plannerWidget . calendar_calEventSmall . calendar_calEventTitle {
display : inline ;
}
2013-11-18 20:57:38 +01:00
2010-07-31 09:51:52 +02:00
/* Special colors for the year view */
2013-11-11 15:02:08 +01:00
. calendar_cal_year_legend_weekend {
2013-11-18 20:57:38 +01:00
background-color : # CCCCCC ;
2010-07-31 09:51:52 +02:00
}
2013-11-11 15:02:08 +01:00
. calendar_cal_year_legend {
2013-11-18 20:57:38 +01:00
background-color : # EFEFEF ;
2010-07-31 09:51:52 +02:00
}
2013-11-11 15:02:08 +01:00
. calendar_cal_year_legend {
2013-11-18 20:57:38 +01:00
background-color : # FFFFCC ;
z-index : 0 ;
2010-07-31 09:51:52 +02:00
}
2013-11-11 15:02:08 +01:00
. calendar_cal_year_weekend {
2013-11-18 20:57:38 +01:00
background-color : # F9F9CC ;
z-index : 0 ;
2010-07-31 09:51:52 +02:00
}
2013-11-11 15:02:08 +01:00
. calendar_cal_year_today {
2013-11-18 20:57:38 +01:00
border-color : # EE0000 ;
border-width : 2px ;
2010-07-31 09:51:52 +02:00
}
2013-11-18 20:57:38 +01:00
2010-05-20 11:19:15 +02:00
/ * *
* edit series or exception popup used in eventWidget and
* delete series and exceptions popup used in edit event
* /
2014-06-16 18:49:45 +02:00
2010-05-20 11:19:15 +02:00
# dialog-content {
2013-11-18 20:57:38 +01:00
display : block ;
height : 100px ;
padding : 6px ;
color : # 666666 ;
font-size : 13px ;
margin : -2px -1px 0px -2px ;
width : 410px ;
2010-05-20 11:19:15 +02:00
}
2014-01-24 17:04:11 +01:00
/ * *
* Calendar Drag and Drop
2014-03-12 14:42:34 +01:00
* Class for div to show forbiden drop
2014-01-24 17:04:11 +01:00
* /
2014-02-10 09:53:42 +01:00
. calendar_d-n-d_timeCounter > span {
position : absolute ;
background-color : # 808080 ;
color : white ;
left : 0 ;
width : 100 % ! important ;
align : center ;
border : dashed white 1px ;
border-radius : 1px ;
}
2015-08-11 17:35:54 +02:00
2014-02-10 09:53:42 +01:00
. calendar_timeDemo {
position : absolute ;
bottom : 0 ;
left : 0 ;
background-color : # 808080 ;
color : white ;
width : 100 % ;
2015-08-11 17:35:54 +02:00
min-width : 5em ;
2014-02-10 09:53:42 +01:00
align : center ;
border : dashed white 1px ;
border-radius : 1px ;
}
2014-01-24 17:04:11 +01:00
. calendar_d-n-d_forbiden
{
background-color : red ;
height : 100 % ;
width : 100 % ;
text-align : center ;
}
2014-03-12 14:42:34 +01:00
/*Class for div to demonstrate dragging time*/
2014-01-24 17:04:11 +01:00
. calendar_d-n-d_timeCounter
{
font-size : 1 . 1em ;
font-weight : bold ;
text-align : center ;
}
2015-08-06 19:14:20 +02:00
. calendar_d-n-d_timeCounter . loading
{
width : 16px ;
height : 16px ;
position : absolute ;
bottom : 0px ;
right : 0px ;
}
2014-02-05 11:04:13 +01:00
# calendar-edit_action {
width : 10em ;
padding-left : 10px ;
margin-left : 5px ;
}
2014-07-01 14:03:39 +02:00
# calendar-list_undelete_popup , # calendar-list_delete_popup {
display : none ;
2014-09-04 15:37:46 +02:00
}
. calendar_freetime_header { font-size : 120 % ; font-weight : bold ; }
. calendar_freetime_timeframe { position : relative ; }
. calendar_freetime_dow { position : absolute ; }
2014-11-04 16:34:51 +01:00
img . calendar_print_button , img . calendar_print_appicon {
height : 24px ;
width : 24px ;
2014-11-05 17:13:26 +01:00
}
/*Sortable views*/
. srotable_cal_wk_ph {
border : 2px dashed gray ;
height : 230px ;
width : 99 % ;
background-color : # ece2f7 ;
}
. srotable_cal_day_ph {
position : relative ;
width : 33 . 333333 % ;
height : 99 % ;
border : 2px dashed gray ;
background-color : # ece2f7 ;
display : inline-block ;
2014-12-03 01:20:57 +01:00
}
2015-10-21 21:53:19 +02:00
/ * *
* View animation stuff
* /
. calendar_slide {
2015-10-27 17:45:37 +01:00
/* There is a cleanup timeout in calendar app.js line 563 that must match */
2016-02-04 22:05:31 +01:00
transition-duration : 0s ; /* was 2s */
2015-10-27 17:45:37 +01:00
transition-delay : 50ms ;
2015-10-21 21:53:19 +02:00
}
2014-12-03 01:20:57 +01:00
/ * *
* Home page portlets
* /
2014-12-09 18:55:00 +01:00
. calendar_favorite_portlet . calendar_calMonthNavHeader a img ,
2014-12-03 01:33:35 +01:00
. calendar_favorite_portlet . calendar_calWeekNavHeader a img ,
. calendar_favorite_portlet . calendar_calDayColHeader a img ,
. calendar_favorite_portlet . calendar_plannerScale a img {
2014-12-03 01:20:57 +01:00
display : none ;
2015-04-07 15:15:33 +02:00
}
2015-12-15 19:58:52 +01:00
# calendar-edit_account + . chzn-container . chzn-results {
max-height : 195px ;
}
2016-04-06 18:43:51 +02:00
input # calendar-edit_location { padding-left : 0 ; }
2015-09-07 19:13:20 +02:00
# calendar_sidebox_content . ui-datepicker div . ui-datepicker-buttonpane {
border-top : 0 ;
margin : 0 ;
padding-right : 3px ;
2015-10-21 21:53:19 +02:00
}
2015-11-19 11:53:46 +01:00
2016-01-11 10:27:04 +01:00
/*weekend slideSwitch in toolbar*/
2016-01-11 20:38:03 +01:00
# calendar-toolbar_app_header {
font-weight : bold ;
color : # 616161 ;
2015-11-19 11:53:46 +01:00
}
2016-01-11 20:38:03 +01:00
# calendar-toolbar_toolbar . et2_toolbar_more {
margin-top : 0 ;
2016-01-12 11:22:40 +01:00
}
2016-01-26 16:02:12 +01:00
# calendar-toolbar button # toolbar-today {
color : # 616161 ;
font-weight : 500 ;
}
2016-04-14 16:58:21 +02:00
2016-04-18 10:34:53 +02:00
# calendar-edit . dialogFooterToolbar { min-width : 800 px ; }
2016-04-15 13:12:08 +02:00
2016-04-27 00:58:35 +02:00
# calendar_edit_recur_data_chzn { width : 99 % !important ; max-width : 99 % !important ; }
/ * Use media queries and day counts to toggle full days & abbreviations in day labels
Width breakpoints in media queries chosen somewhat arbitrarily , looking at 'Wednesday'
to see if it still fits .
* /
@ media all and ( max-width : 1000px ) and ( min-width : 481px ) {
/ / styles assigned when width is smaller than 1000px
. calendar_calDayColHeader > div [ data-date ] . long_date
{
display : inline ;
}
. calendar_calDayColHeader > div [ data-date ] . short_date
{
display : none ;
}
/ / 7 day needs short day labels
. calendar_calDayColHeader : first-child : nth-last-child ( 7 ) > div [ data-date ] . short_date ,
. calendar_calDayColHeader : first-child : nth-last-child ( 7 ) ~ . calendar_calDayColHeader > div [ data-date ] . short_date ,
{
display : inline ;
}
. calendar_calDayColHeader : first-child : nth-last-child ( 7 ) > div [ data-date ] . long_date ,
. calendar_calDayColHeader : first-child : nth-last-child ( 7 ) ~ . calendar_calDayColHeader > div [ data-date ] . long_date ,
{
display : none ;
}
}
@ media all and ( max-width : 580px ) {
. calendar_calDayColHeader : first-child : nth-last-child ( 5 ) > div [ data-date ] . long_date ,
. calendar_calDayColHeader : first-child : nth-last-child ( 5 ) ~ . calendar_calDayColHeader > div [ data-date ] . long_date ,
{
display : none ;
}
. calendar_calDayColHeader : first-child : nth-last-child ( 5 ) > div [ data-date ] . short_date ,
. calendar_calDayColHeader : first-child : nth-last-child ( 5 ) ~ . calendar_calDayColHeader > div [ data-date ] . short_date ,
{
display : inline ;
}
}
@ media all and ( max-width : 480px ) {
/ / styles assigned when width is smaller than 480px ;
. calendar_calDayColHeader > div [ data-date ] . long_date ,
. calendar_calDayColHeader > div [ data-date ] . short_date
{
display : none ;
}
/ / 5 day and less fits short day labels
. calendar_calDayColHeader : first-child : nth-last-child ( 3 ) > div [ data-date ] . short_date ,
. calendar_calDayColHeader : first-child : nth-last-child ( 3 ) ~ . calendar_calDayColHeader > div [ data-date ] . short_date ,
. calendar_calDayColHeader : first-child : nth-last-child ( 4 ) > div [ data-date ] . short_date ,
. calendar_calDayColHeader : first-child : nth-last-child ( 4 ) ~ . calendar_calDayColHeader > div [ data-date ] . short_date ,
. calendar_calDayColHeader : first-child : nth-last-child ( 5 ) > div [ data-date ] . short_date ,
2016-05-25 18:18:31 +02:00
. calendar_calDayColHeader : first-child : nth-last-child ( 5 ) ~ . calendar_calDayColHeader > div [ data-date ] . short_date
2016-04-27 00:58:35 +02:00
{
display : inline ;
}
/ / 2 day view and less has enough room for full label
. calendar_calDayColHeader : first-child : nth-last-child ( 1 ) > div [ data-date ] . long_date ,
. calendar_calDayColHeader : first-child : nth-last-child ( 1 ) ~ . calendar_calDayColHeader > div [ data-date ] . long_date ,
. calendar_calDayColHeader : first-child : nth-last-child ( 2 ) > div [ data-date ] . long_date ,
2016-05-25 18:18:31 +02:00
. calendar_calDayColHeader : first-child : nth-last-child ( 2 ) ~ . calendar_calDayColHeader > div [ data-date ] . long_date
2016-04-27 00:58:35 +02:00
{
display : inline ;
}
2016-04-29 10:40:55 +02:00
}
2016-05-06 11:32:17 +02:00
# calendar-edit_quantity . et2_textbox_ro { opacity : 0.5 ; }
# calendar-edit_quantity , # calendar-edit_role { float : left ; }