forked from extern/egroupware
662ea62790
Now using regular calendar header. "Go" button and custom header styles removed. Changing the date in sidebox calendar immediately updates state.
2887 lines
80 KiB
CSS
2887 lines
80 KiB
CSS
/**
|
|
*
|
|
* Calendar - Mobile
|
|
*
|
|
* Please do NOT change app.css directly, instead change app.less and compile it!
|
|
* Pixleegg Template app.css
|
|
* @link http://www.egroupware.org
|
|
* @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
|
|
* @author Hadi Nategh <hn@stylite.de>
|
|
* @package calendar
|
|
* @version $Id: app.less 55033 2016-02-16 18:49:17Z hnategh $
|
|
*/
|
|
/**
|
|
* EGroupware: CSS with less preprocessor
|
|
*
|
|
* CALENDAR
|
|
*
|
|
* Please do NOT change app.css directly, instead change app.less and compile it!
|
|
*
|
|
* @link http://www.egroupware.org
|
|
* @license http://opensource.org/licenses/gpl-license.php GPL - GNU General Public License
|
|
* @author Stefan Reinhardt <stefan.reinhardt@pixelegg.de>
|
|
* @package calendar
|
|
*/
|
|
/* $Id$ */
|
|
/*Media print classes*/
|
|
@media print {
|
|
#calendar-view.et2_container,
|
|
#calendar-planner.et2_container,
|
|
#calendar-list.et2_container {
|
|
position: static;
|
|
height: auto !important;
|
|
}
|
|
#calendar-todo.et2_container {
|
|
display: none !important;
|
|
}
|
|
.calendar_calDayTodos .calendar_calDayTodosTable {
|
|
position: relative;
|
|
}
|
|
.calendar_plannerWidget {
|
|
height: auto !important;
|
|
}
|
|
.calendar_plannerWidget .calendar_plannerHeader {
|
|
margin-right: 2px !important;
|
|
}
|
|
.calendar_plannerWidget .calendar_plannerRows {
|
|
height: auto !important;
|
|
overflow: visible !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;
|
|
}
|
|
/* Try to keep it on the page */
|
|
.calendar_calTimeGrid {
|
|
max-height: 18cm;
|
|
max-width: 90vw;
|
|
}
|
|
.calendar_calTimeGrid .calendar_calTimeGridScroll {
|
|
overflow-y: hidden !important;
|
|
}
|
|
/* Let hidden user names be visible */
|
|
#calendar-view_view.hideDayColHeader tr:not(:first-of-type) .calendar_calGridHeader > span.et2_label {
|
|
position: static;
|
|
}
|
|
#calendar-view_view.hideDayColHeader tr:not(:first-of-type) .calendar_calGridHeader > span.et2_label {
|
|
overflow: visible !important;
|
|
}
|
|
div.calendar_calEvent {
|
|
opacity: 1;
|
|
filter: opacity(0.85);
|
|
-webkit-filter: opacity(0.85);
|
|
border: 1px solid;
|
|
}
|
|
/* Make times & all day description bold for better visibility */
|
|
div.calendar_calDayColAllDay div.calendar_calEventBodySmall,
|
|
div.calendar_calEventHeader,
|
|
div.calendar_calEventHeaderSmall {
|
|
font-weight: bold;
|
|
}
|
|
}
|
|
/**
|
|
* Sidebox
|
|
*/
|
|
#calendar-et2_target {
|
|
position: relative;
|
|
}
|
|
#calendar-et2_target > div {
|
|
position: relative;
|
|
}
|
|
#calendar-sidebox_cat_id {
|
|
margin-bottom: 10px;
|
|
}
|
|
#calendar-sidebox_cat_id ~ * {
|
|
vertical-align: top;
|
|
display: inline-block;
|
|
border: none;
|
|
box-shadow: none;
|
|
}
|
|
#calendar-sidebox_weekend {
|
|
/* Special css styling goes here */
|
|
}
|
|
#calendar-sidebox_date .calendar_calHoliday {
|
|
background-color: rgba(103, 159, 210, 0.5);
|
|
}
|
|
#calendar-sidebox_date .flatpickr-months {
|
|
gap: 0;
|
|
background-color: initial;
|
|
}
|
|
#calendar-sidebox_date .flatpickr-months > * {
|
|
background-repeat: no-repeat;
|
|
}
|
|
#calendar-sidebox_date .flatpickr-months > *:hover {
|
|
background-color: initial !important;
|
|
box-shadow: none;
|
|
}
|
|
#calendar-sidebox_date .flatpickr-months .flatpickr-month {
|
|
min-width: 16ch;
|
|
height: initial;
|
|
background-color: initial;
|
|
}
|
|
#calendar-sidebox_date .flatpickr-current-month {
|
|
height: 25px;
|
|
font-size: 100%;
|
|
width: 100%;
|
|
min-width: 7ch;
|
|
left: 0;
|
|
display: flex;
|
|
align-items: stretch;
|
|
padding: 0px;
|
|
}
|
|
#calendar-sidebox_date .flatpickr-current-month select {
|
|
padding: 0 !important;
|
|
background-color: initial;
|
|
}
|
|
#calendar-sidebox_date .flatpickr-current-month .numInputWrapper {
|
|
width: 7ch;
|
|
min-width: 7ch;
|
|
flex: 0;
|
|
}
|
|
#calendar-sidebox_date .flatpickr-current-month .numInputWrapper:hover {
|
|
background-color: initial;
|
|
}
|
|
#calendar-sidebox_date .flatpickr-current-month input.cur-year {
|
|
padding-top: 3px;
|
|
}
|
|
#calendar-sidebox_date div.flatpickr-calendar.inline .flatpickr-current-month .flatpickr-monthDropdown-months {
|
|
width: 100%;
|
|
padding: 0;
|
|
flex: 1 1 auto;
|
|
}
|
|
#calendar-sidebox_date div.flatpickr-calendar.inline {
|
|
width: 100% !important;
|
|
}
|
|
#calendar-sidebox_date .flatpickr-day {
|
|
font-size: 11px;
|
|
}
|
|
#calendar-sidebox_date .inRange {
|
|
background-color: var(--row_hover);
|
|
box-shadow: none;
|
|
}
|
|
/* Conflict display */
|
|
div.calendar_conflicts {
|
|
max-height: 540px;
|
|
overflow-y: auto;
|
|
}
|
|
.calendar_conflicts img {
|
|
width: 22px;
|
|
height: 22px;
|
|
}
|
|
.calendar_conflicts table[id*="conflicting_participants"] > tbody > tr.r .et2_label {
|
|
/* Color for resources */
|
|
color: blue;
|
|
}
|
|
/* Loader - hide sizing behind overlay*/
|
|
#egw-loadin-prompt_calendar::before {
|
|
opacity: 1;
|
|
background-color: #e6e6e6;
|
|
}
|
|
/* Toolbar */
|
|
#calendar-toolbar {
|
|
height: 3.6em;
|
|
margin-top: 0.3em;
|
|
}
|
|
#calendar-toolbar > div {
|
|
display: flex;
|
|
}
|
|
#calendar-toolbar .et2_toolbar {
|
|
background: inherit;
|
|
}
|
|
#calendar-toolbar .egw_fw_ui_app_header_container {
|
|
border: none;
|
|
display: flex;
|
|
align-items: center;
|
|
min-height: 26px;
|
|
justify-content: flex-end;
|
|
}
|
|
#calendar-toolbar .et2_searchbox input {
|
|
height: 14px;
|
|
}
|
|
#calendar-toolbar #calendar-toolbar_favorite_wrapper {
|
|
float: right;
|
|
white-space: nowrap;
|
|
margin-right: 5px;
|
|
margin-top: -4px;
|
|
}
|
|
#calendar-toolbar #calendar-toolbar_favorite_wrapper #calendar-toolbar_favorite_menu {
|
|
z-index: 40;
|
|
font-weight: normal;
|
|
}
|
|
#calendar-toolbar .et2_dropdown button.ui-state-default {
|
|
background: #ffffff;
|
|
}
|
|
/* Space for toolbar */
|
|
#calendar-view,
|
|
#calendar-todo,
|
|
#calendar-planner,
|
|
#calendar-list {
|
|
position: absolute;
|
|
left: 0px;
|
|
right: 0px;
|
|
}
|
|
form#calendar-toolbar > div {
|
|
column-gap: 1ex;
|
|
}
|
|
#calendar-todo {
|
|
position: absolute;
|
|
width: 30%;
|
|
margin-top: 0px;
|
|
z-index: 10;
|
|
bottom: -10px;
|
|
height: calc(100% - 92px);
|
|
}
|
|
#calendar-view {
|
|
width: 100%;
|
|
}
|
|
#calendar-view_view td {
|
|
padding: 0px;
|
|
}
|
|
.calendar_inputFullWidth input {
|
|
width: 100%;
|
|
}
|
|
/******************************************************************
|
|
* CSS settings for the day, week and month view (timeGridWidget) *
|
|
******************************************************************/
|
|
/*
|
|
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:
|
|
e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget method of uiviews.
|
|
|
|
+++ calendar_calTimeGrid +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
|
|
+ #### calendar_calDayCols[12h|NoGrip] ###########################################################
|
|
+ #... calendar_calDayCol ............................. ... calendar_calDayCol ..........................
|
|
+ #.+- calendar_calDayColHeader ---------------------+. .+- calendar_calDayColHeader ------------------+.
|
|
+ #.| |. .| |.
|
|
+ #.+---------------------------------------+. .+------------------------------------+.
|
|
+.calendar_calTimeRowTime.#.** calendar_calEventCol ***** ** calendar_calEventCol *****. .** calendar_calEventCol ***********************.
|
|
+. .#.* * * *. .* *.
|
|
+. .#.* * * *. .* *.
|
|
+................#.*+- calendar_calEvent -----+* * *. .* *.
|
|
+.calendar_calTimeRowTime.#.*| |* * *. .*+- calendar_calEvent[Private] --------------+*.
|
|
+. .#.*| |* *+- calendar_calEvent -----+*. .*| |*.
|
|
+. .#.*+----------------+* *| |*. .*| |*.
|
|
+................#.* * *| |*. .*| |*.
|
|
+.calendar_calTimeRowTime.#.* * *+----------------+*. .*| |*.
|
|
+. .#.* * * *. .*+----------------------------------+*.
|
|
|
|
*/
|
|
/* 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;
|
|
}
|
|
/* Current time indicator */
|
|
.calendar_now {
|
|
position: absolute;
|
|
background: red;
|
|
}
|
|
.calendar_calTimeGrid .calendar_now {
|
|
height: 2px;
|
|
width: 100%;
|
|
left: 0px;
|
|
}
|
|
.calendar_calTimeGridList .calendar_now {
|
|
display: none;
|
|
}
|
|
.calendar_plannerWidget .calendar_now {
|
|
height: 100%;
|
|
width: 2px;
|
|
top: 0px;
|
|
}
|
|
.calendar_size120b {
|
|
font-size: 120%;
|
|
font-weight: bold;
|
|
}
|
|
/* marks a day in the colum-header as today
|
|
*/
|
|
.calendar_calToday,
|
|
.calendar_calTimeGrid .calendar_calDayColHeader .calendar_calToday,
|
|
.calendar_calTimeGrid .calendar_calDayColHeader .calendar_calToday.et2_link.et2_clickable {
|
|
background: #ffffcc;
|
|
color: #0C5DA5;
|
|
}
|
|
.calendar_calWeek {
|
|
background: #ffffcc;
|
|
width: auto;
|
|
margin: 0 auto;
|
|
text-align: center;
|
|
}
|
|
.calendar_calMonth {
|
|
background: #ffffcc;
|
|
width: auto;
|
|
margin: 0 auto;
|
|
text-align: center;
|
|
}
|
|
/* marks a day in the colum-header as holiday
|
|
*/
|
|
.calendar_calHoliday,
|
|
.calendar_calTimeGrid .calendar_calDayColHeader .calendar_calHoliday.et2_link.et2_clickable {
|
|
background-color: rgba(103, 159, 210, 0.5);
|
|
}
|
|
/* marks a day in the column-header additionaly as birthday of some contact,
|
|
* it should work together with the backgrounds of calendar_calToday, calendar_calHoliday, th, row_on and row_off
|
|
*/
|
|
.calendar_calBirthday,
|
|
.calendar_calBirthday a {
|
|
color: #626161;
|
|
}
|
|
#calendar-view .calendar_calBirthday,
|
|
#calendar-planner .calendar_plannerHeader .calendar_calBirthdayIcon {
|
|
background-image: url(../default/images/cake.svg);
|
|
background-repeat: no-repeat;
|
|
background-size: 16px;
|
|
background-position: 10px center;
|
|
}
|
|
/* Supress tooltips on holidays shown as events */
|
|
.calendar_calEventTooltip.calendar_calBirthday,
|
|
.calendar_calEventTooltip.calendar_calHoliday {
|
|
display: none;
|
|
}
|
|
/* timeGridWidget, contains timeRow's and dayCol's
|
|
*/
|
|
.calendar_calTimeGrid {
|
|
position: relative;
|
|
top: 0px;
|
|
left: 0px;
|
|
-webkit-touch-callout: none;
|
|
-webkit-user-select: none;
|
|
-khtml-user-select: none;
|
|
-moz-user-select: none;
|
|
-ms-user-select: none;
|
|
user-select: none;
|
|
overflow: hidden;
|
|
display: flex;
|
|
flex-direction: column;
|
|
page-break-inside: avoid;
|
|
}
|
|
.calendar_calTimeGrid .calendar_calTimeGridScroll {
|
|
position: relative;
|
|
bottom: 0px;
|
|
width: 100%;
|
|
height: 100%;
|
|
overflow-y: auto;
|
|
overflow-x: hidden;
|
|
cursor: default;
|
|
background-color: white;
|
|
}
|
|
.calendar_calTimeGrid .calendar_calTimeLabels {
|
|
height: 100%;
|
|
}
|
|
.calendar_calTimeGrid .loading,
|
|
.calendar_plannerWidget .loading {
|
|
top: 0px;
|
|
bottom: 0px;
|
|
left: 0px;
|
|
right: 0px;
|
|
position: absolute;
|
|
}
|
|
.calendar_calTimeGrid .loading::before,
|
|
.calendar_plannerWidget .loading::before {
|
|
opacity: 1;
|
|
background-color: #E6E6E6;
|
|
}
|
|
/* Timegrid that has hit a minimum size */
|
|
.calendar_calTimeGridFixed .calendar_calTimeGridScroll {
|
|
overflow: hidden;
|
|
}
|
|
/*
|
|
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;
|
|
}
|
|
#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 + 32px);
|
|
}
|
|
#calendar-view_view.hideDayColHeader tr .calendar_calGridHeader > span.et2_label {
|
|
white-space: nowrap;
|
|
display: block;
|
|
position: static;
|
|
width: calc(100% - 58px);
|
|
margin-left: 58px;
|
|
color: white;
|
|
background-color: #2D6393;
|
|
text-align: center;
|
|
line-height: 1.5em;
|
|
font-size: 14px;
|
|
z-index: 35;
|
|
}
|
|
/* single row in the time-line you dont need to set a bgcolor, but you can
|
|
*/
|
|
.calendar_calTimeRow {
|
|
width: 100%;
|
|
/* set via inline style on runtime:
|
|
* height:
|
|
* top:
|
|
*/
|
|
}
|
|
.calendar_calTimeRow:not(.calendar_calWorkHours) {
|
|
background-color: rgba(120, 120, 120, 0.1);
|
|
}
|
|
/* time in a timeRow
|
|
*/
|
|
.calendar_calTimeRowTime {
|
|
padding-left: 5px;
|
|
height: 100%;
|
|
line-height: 14px;
|
|
font-size: 8pt;
|
|
text-align: left;
|
|
}
|
|
.calendar_calTimeRowTime[data-minute='0'] {
|
|
border-top: 1px solid silver;
|
|
background-image: none;
|
|
}
|
|
/* contains (multiple) dayCol's
|
|
*/
|
|
.calendar_calDayCols,
|
|
.calendar_calDayCols12h,
|
|
.calendar_calDayColsNoGrid {
|
|
position: absolute;
|
|
top: 0px;
|
|
/* bottom: 0px; does NOT work in IE, IE needs height: 100%! */
|
|
height: 100%;
|
|
left: 58px;
|
|
right: 0px;
|
|
white-space: nowrap;
|
|
}
|
|
/* 12h timeformat with am/pm
|
|
*/
|
|
.calendar_calDayCols12h {
|
|
left: 65px;
|
|
}
|
|
/* no time grid --> no time column
|
|
*/
|
|
.calendar_calDayColsNoTime {
|
|
left: 0px;
|
|
}
|
|
/* contains (multiple) eventCol's
|
|
*/
|
|
.calendar_calDayCol {
|
|
position: absolute;
|
|
top: 0px;
|
|
height: 100%;
|
|
/* set via inline style on runtime:
|
|
* left:
|
|
* width:
|
|
*/
|
|
border-left: 1px solid silver;
|
|
transition: none;
|
|
}
|
|
/* Calendar Id #
|
|
*/
|
|
#calendar-edit_id:before {
|
|
content: "#";
|
|
}
|
|
/* header for the dayCol
|
|
*/
|
|
.calendar_calDayColHeader,
|
|
.calendar_calGridHeader,
|
|
.calendar_calGridHeader > div {
|
|
font-size: 100%;
|
|
line-height: 16px;
|
|
}
|
|
.calendar_calDayColHeader {
|
|
display: inline-block;
|
|
position: relative;
|
|
vertical-align: top;
|
|
border-right: 1px solid silver;
|
|
height: initial;
|
|
min-height: 2em;
|
|
transition: none;
|
|
z-index: 30;
|
|
white-space: initial;
|
|
padding-bottom: 2ex;
|
|
}
|
|
.calendar_calDayColHeader > div[data-date] {
|
|
font-size: 14px;
|
|
line-height: 27px;
|
|
text-align: center;
|
|
border-bottom: 1px solid silver;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
background-color: white;
|
|
}
|
|
.hideDayColHeader .calendar_calDayColHeader > div[data-date] {
|
|
position: fixed;
|
|
width: inherit;
|
|
z-index: 100;
|
|
}
|
|
.blue_title {
|
|
color: white !important;
|
|
background: #2D6393 !important;
|
|
}
|
|
/* 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;
|
|
}
|
|
/* Keep header dates when showing one week, multiple users */
|
|
.calendar_calTimeGridFixed:not(.calendar_TimeGridNoLabel) .calendar_calDayColHeader > div.et2_clickable.et2_link {
|
|
position: fixed;
|
|
width: inherit;
|
|
margin-top: -1px;
|
|
}
|
|
/* Indicators for offscreen events */
|
|
.calendar_calDayColHeader .hiddenEventBefore,
|
|
.calendar_calDayCol .hiddenEventAfter {
|
|
width: 80%;
|
|
left: 10%;
|
|
position: absolute;
|
|
border-radius: 5px;
|
|
border: 6px solid;
|
|
border-left: 0px;
|
|
border-right: 0px;
|
|
overflow: hidden;
|
|
z-index: 40;
|
|
cursor: pointer;
|
|
}
|
|
.calendar_calDayColHeader .hiddenEventBefore {
|
|
height: 2px;
|
|
bottom: -6px;
|
|
border-top: none;
|
|
}
|
|
.calendar_calDayColHeader .hiddenEventBefore:hover {
|
|
bottom: -20px;
|
|
height: 16px;
|
|
border-left: 1px;
|
|
border-right: 1px;
|
|
border-top-left-radius: 0px;
|
|
border-top-right-radius: 0px;
|
|
background-color: white;
|
|
}
|
|
.calendar_calDayCol .hiddenEventAfter {
|
|
border-bottom: none;
|
|
height: 6px;
|
|
}
|
|
.calendar_calDayCol .hiddenEventAfter:hover {
|
|
margin-top: -20px;
|
|
height: 20px;
|
|
background-color: white;
|
|
}
|
|
.calendar_calTimeGridFixed .calendar_calDayCol .hiddenEventAfter:hover .calendar_calEvent {
|
|
position: relative;
|
|
}
|
|
/* Days in a different month, but shown to fill out the week */
|
|
.calendar_calDayColHeader.calendar_differentMonth > * {
|
|
color: #6a6a6a;
|
|
}
|
|
.calendar_calDayCol.calendar_differentMonth {
|
|
background-color: rgba(200, 200, 200, 0.1);
|
|
}
|
|
/* Daily sortable */
|
|
.calendar_calDayColHeader .ui-sortable-handle {
|
|
cursor: ew-resize;
|
|
}
|
|
.calendar_calDayColAllDay {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
flex-direction: row;
|
|
align-items: flex-start;
|
|
width: 100%;
|
|
/* 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;
|
|
}
|
|
.calendar_calDayColAllDay .calendar_calEventHeader {
|
|
display: none;
|
|
}
|
|
.calendar_calDayColAllDay > .calendar_calEventBodySmall {
|
|
white-space: nowrap;
|
|
}
|
|
.calendar_calGridHeader > div {
|
|
position: relative;
|
|
height: 100%;
|
|
margin-left: 58px;
|
|
width: initial;
|
|
white-space: nowrap;
|
|
border-left: 1px solid silver;
|
|
display: flex;
|
|
align-items: stretch;
|
|
}
|
|
#calendar-view_view.hideDayColHeader .calendar_calGridHeader > div {
|
|
height: auto;
|
|
}
|
|
.calendar_calGridHeader > label {
|
|
float: left;
|
|
font-size: 14px;
|
|
line-height: 27px;
|
|
width: 58px;
|
|
text-align: center;
|
|
position: absolute;
|
|
top: 0px;
|
|
}
|
|
.calendar_calGridHeader > span.et2_label {
|
|
position: absolute;
|
|
width: 55px;
|
|
}
|
|
.calendar_TimeGridNoLabel > .calendar_calGridHeader > span.et2_label {
|
|
display: none;
|
|
}
|
|
.calendar_calDayColHeader img {
|
|
vertical-align: middle;
|
|
}
|
|
.calendar_calWeekNavHeader,
|
|
.calendar_calMonthNavHeader {
|
|
top: 0px;
|
|
left: 0px;
|
|
width: 100%;
|
|
right: 0px;
|
|
}
|
|
.calendar_calWeekNavHeader,
|
|
.calendar_calMonthNavHeader img {
|
|
vertical-align: middle;
|
|
}
|
|
.calendar_calViewUserNameBox {
|
|
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;
|
|
}
|
|
.calendar_calViewUserName {
|
|
font-weight: normal;
|
|
}
|
|
.calendar_calViewUserName:first-letter {
|
|
text-transform: uppercase;
|
|
}
|
|
.calendar_calViewUserNameFirst:after {
|
|
content: ", ";
|
|
}
|
|
/* alarm_date widget disabled class
|
|
*/
|
|
.calendar_alarm_date_display {
|
|
display: none !important;
|
|
}
|
|
/*overwirte margin applied by egwGridView*/
|
|
.calendar_alarm_grid {
|
|
margin-left: 0 !important;
|
|
}
|
|
/* header of the time-grid, eg. for the weeks in the month-view (leftmost of the day-col-headers)
|
|
*/
|
|
.calendar_calGridHeader {
|
|
text-align: left;
|
|
z-index: 29;
|
|
border-bottom: 1px solid silver;
|
|
border-top: 1px solid silver;
|
|
min-height: 1ex;
|
|
flex: 0 0 auto;
|
|
}
|
|
#calendar-view_view tbody.ui-sortable {
|
|
cursor: default;
|
|
}
|
|
#calendar-view_view tbody.ui-sortable .calendar_calGridHeader {
|
|
cursor: ns-resize;
|
|
}
|
|
#calendar-view_view tbody.ui-sortable-disabled .calendar_calGridHeader,
|
|
#calendar-view_view tbody.ui-sortable-disabled .calendar_calGridHeader label {
|
|
cursor: pointer;
|
|
}
|
|
/* contains (multiple) events's
|
|
*/
|
|
.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:
|
|
* left:
|
|
* width:
|
|
*/
|
|
}
|
|
/* contains one event: header-row & -body
|
|
*/
|
|
.calendar_calEvent {
|
|
position: absolute;
|
|
left: 0px;
|
|
right: 0px;
|
|
overflow: hidden;
|
|
z-index: 20;
|
|
padding-left: 6px;
|
|
min-height: 1.2em;
|
|
min-width: 5px;
|
|
/* 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;
|
|
opacity: 0.85;
|
|
-moz-opacity: 0.85;
|
|
box-sizing: border-box;
|
|
touch-action: none;
|
|
/* set via inline style on runtime:
|
|
* top: depending on startime
|
|
* height: depending on length
|
|
* border-color: depending on category
|
|
* background: depending on category (shade)
|
|
*
|
|
*/
|
|
border-color: #808080;
|
|
background-color: #808080;
|
|
}
|
|
.calendar_calEvent:not(.rowNoView):hover {
|
|
cursor: pointer;
|
|
}
|
|
/** 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.8);
|
|
height: 5px;
|
|
content: "\02026";
|
|
left: 0px;
|
|
float: right;
|
|
padding-bottom: 5em;
|
|
text-indent: 5px;
|
|
line-height: 5px;
|
|
}
|
|
/**
|
|
* User has not accepted the invitation
|
|
*/
|
|
.calendar_calEventUnknown {
|
|
border-color: white;
|
|
}
|
|
.calendar_calEventUnknown .calendar_calEventBody,
|
|
.calendar_calEventUnknown .calendar_calEventBodySmall {
|
|
background-color: white !important;
|
|
}
|
|
/**
|
|
* All participants accepted the invitation
|
|
*/
|
|
/**
|
|
* All participants answered the invitation, but not all accepted
|
|
*/
|
|
.calendar_calEventAllAnswered {
|
|
background-image: linear-gradient(transparent 50%, rgba(255, 255, 255, 0.8) 50%);
|
|
background-repeat: repeat-y;
|
|
background-size: 6px 2px;
|
|
}
|
|
/**
|
|
* Some participants did NOT answer the invitation
|
|
*/
|
|
.calendar_calEventSomeUnknown:not(.calendar_calEventUnknown) {
|
|
background-image: linear-gradient(transparent 50%, rgba(255, 255, 255, 0.5) 50%);
|
|
background-repeat: repeat-y;
|
|
background-size: 6px 5px;
|
|
}
|
|
.calendar_calEvent:not([class*=" cat_"]) {
|
|
/* Defaults for no category, so we don't override it */
|
|
background-color: #808080;
|
|
}
|
|
/**
|
|
* Events in the header (all day)
|
|
*/
|
|
.calendar_calDayColHeader .calendar_calEvent {
|
|
position: static;
|
|
display: inline-block;
|
|
white-space: nowrap;
|
|
/* This determines how many per line */
|
|
flex: 1 1 auto;
|
|
}
|
|
.calendar_calDayColHeader .calendar_calEvent .calendar_calEventBody {
|
|
white-space: nowrap;
|
|
}
|
|
.calendar_calEventTooltip {
|
|
padding-left: 6px;
|
|
max-height: 400px;
|
|
min-width: 25ex;
|
|
overflow: auto;
|
|
}
|
|
/* Do not show icons in header, only tooltip */
|
|
.calendar_calEventTooltip .calendar_calEventIcons {
|
|
display: inline-block;
|
|
}
|
|
.calendar_calEventTooltip .calendar_calEventBody,
|
|
.calendar_calEventTooltip .calendar_calEventBodySmall {
|
|
padding-bottom: 1em;
|
|
}
|
|
.calendar_calEventTooltip img {
|
|
max-width: 1.5em;
|
|
vertical-align: middle;
|
|
padding-left: 5px;
|
|
}
|
|
.calendar_calEventTooltip [data-videoconference] {
|
|
cursor: pointer;
|
|
}
|
|
.calendar_calAddEvent {
|
|
width: 100%;
|
|
z-index: 10;
|
|
}
|
|
.calendar_calDayColHeader .calendar_calAddEvent:hover {
|
|
background-color: #D2D7FF;
|
|
cursor: pointer;
|
|
}
|
|
/* header-row of the event
|
|
*/
|
|
.calendar_calEventHeader,
|
|
.calendar_calEventHeaderSmall {
|
|
position: relative;
|
|
/* as the calendar_calEventIcons use postion: absolute! */
|
|
text-align: left;
|
|
left: 0px;
|
|
right: 0px;
|
|
padding-left: 2px;
|
|
min-height: 1em;
|
|
overflow: hidden;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
/* set via inline style on runtime
|
|
* background-color: depending on category
|
|
* color: white || black depending on cat;
|
|
*/
|
|
background-color: rgba(255, 255, 255, 0.8);
|
|
}
|
|
.calendar_calEventHeader .calendar_calEventTitle {
|
|
display: none;
|
|
}
|
|
.calendar_calEventHeaderSmall {
|
|
font-size: 8pt;
|
|
line-height: 10pt;
|
|
}
|
|
.calendar_calEvent[data-priority='3'] .calendar_calEventTitle {
|
|
color: red;
|
|
}
|
|
.calendar_calEventIcons {
|
|
position: absolute;
|
|
right: 0px;
|
|
top: 0px;
|
|
/* Do not show icons in header, only tooltip */
|
|
display: none;
|
|
}
|
|
.calendar_calEventIcons img {
|
|
height: 13px;
|
|
}
|
|
.calendar_calEventHeaderSmall .calendar_calEventIcons img {
|
|
height: 13px;
|
|
}
|
|
/* body of the event
|
|
*/
|
|
.calendar_calEventBody,
|
|
.calendar_calEventBodySmall {
|
|
padding: 0px 3px 0px;
|
|
left: 2px;
|
|
right: 2px;
|
|
height: 99%;
|
|
white-space: normal;
|
|
background-color: rgba(255, 255, 255, 0.8);
|
|
}
|
|
.calendar_calEventBody > p,
|
|
.calendar_calEventBodySmall > p {
|
|
white-space: pre-wrap;
|
|
}
|
|
.calendar_calEventBody .calendar_calTimespan {
|
|
display: none;
|
|
}
|
|
.calendar_calTimeGrid .calendar_calEventBodySmall {
|
|
font-size: 95%;
|
|
}
|
|
.calendar_calEventLabel {
|
|
font-weight: bold;
|
|
font-size: 90%;
|
|
display: inline;
|
|
}
|
|
.calendar_calEventTitle {
|
|
font-weight: bold;
|
|
font-size: 100%;
|
|
display: inline;
|
|
}
|
|
/* 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 {
|
|
padding-top: 4em;
|
|
}
|
|
.calendar_plannerRowWidget .calendar_calEvent:not(.calendar_calEventSmall) .calendar_calTimespan {
|
|
display: none;
|
|
}
|
|
.calendar_plannerRowWidget .calendar_calEvent:not(.calendar_calEventSmall) .calendar_calEventHeader .calendar_calEventTitle {
|
|
display: inline;
|
|
font-weight: normal;
|
|
}
|
|
/* 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;
|
|
}
|
|
.calendar_calTimeGridList .calendar_calDayColHeader > div[data-date] {
|
|
border: none;
|
|
}
|
|
.calendar_calTimeGridList .calendar_calDayCol > div.event_wrapper {
|
|
position: absolute;
|
|
top: 0px;
|
|
bottom: 3em;
|
|
width: 100%;
|
|
}
|
|
.calendar_calTimeGridList .calendar_calEvent {
|
|
height: 1.1em;
|
|
position: relative;
|
|
border: none;
|
|
border-bottom: none;
|
|
border-right: none;
|
|
border-radius: 0px;
|
|
padding-left: 6px;
|
|
}
|
|
.calendar_calTimeGridList .calendar_calEventHeader {
|
|
display: none !important;
|
|
}
|
|
.calendar_calTimeGridList .calendar_calEventTitle {
|
|
font-weight: normal;
|
|
display: inline-block;
|
|
white-space: nowrap;
|
|
flex: 1 1;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
.calendar_calTimeGridList .calendar_calEventBody {
|
|
overflow: hidden;
|
|
border: none;
|
|
background: white !important;
|
|
height: 100%;
|
|
padding-left: 6px;
|
|
display: flex;
|
|
}
|
|
.calendar_calTimeGridList .calendar_calEventBody .calendar_calTimespan {
|
|
display: inline-block;
|
|
text-align: right;
|
|
padding-right: 1px;
|
|
opacity: 0.8;
|
|
font-size: 90%;
|
|
flex: 0 0 auto;
|
|
}
|
|
.calendar_calTimeGridList .calendar_calEventBody > p {
|
|
display: none;
|
|
}
|
|
.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;
|
|
background: white;
|
|
z-index: 21;
|
|
padding-left: 12px;
|
|
}
|
|
.calendar_calTimeGridList .calendar_calDayCol .hiddenEventAfter:hover {
|
|
/* Need !important to override calculated height*/
|
|
top: initial !important;
|
|
bottom: 0px;
|
|
white-space: pre;
|
|
background: white;
|
|
height: 100%;
|
|
overflow: auto;
|
|
}
|
|
.calendar_calTimeGridList .calendar_calDayCol .hiddenEventAfter:hover:before {
|
|
display: none;
|
|
}
|
|
/* table of the dayView containing 2 cols: 1) day-view, 2) todos
|
|
*/
|
|
.calendar_calDayView {
|
|
width: 100%;
|
|
}
|
|
/* calDayTods is the day-view's todo column, containing the calDayTodoHeader and the calDayTodoTable
|
|
*/
|
|
.calendar_calDayTodos .calendar_calDayTodosHeader {
|
|
margin: 0px;
|
|
padding: 2px;
|
|
font-weight: bold;
|
|
height: 23px;
|
|
line-height: 23px;
|
|
}
|
|
.calendar_calDayTodos .calendar_calDayTodosTable {
|
|
overflow: auto;
|
|
position: absolute;
|
|
top: 3em;
|
|
bottom: 8px;
|
|
width: 100%;
|
|
}
|
|
.calendar_calDayTodos {
|
|
width: 98%;
|
|
border: 1px solid silver;
|
|
}
|
|
.calendar_calDayTodosHeader {
|
|
text-align: center;
|
|
}
|
|
.calendar_calDayTodosTable tr {
|
|
page-break-inside: avoid;
|
|
}
|
|
.calendar_calDayTodosTable tr td span:first-child {
|
|
white-space: nowrap;
|
|
}
|
|
.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: 2px;
|
|
}
|
|
/******************************************************
|
|
* CSS settings for the planner views (calendar_plannerWidget) *
|
|
******************************************************/
|
|
/* calendar_plannerWidget represents the whole planner, consiting of the calendar_plannerHeader and multiple plannerRowWidgets
|
|
*/
|
|
.calendar_plannerWidget {
|
|
position: relative;
|
|
top: 0px;
|
|
left: 0px;
|
|
width: 99.5%;
|
|
}
|
|
.calendar_plannerWidget > div:not(.calendar_plannerHeader) {
|
|
overflow-y: auto;
|
|
overflow-x: hidden;
|
|
}
|
|
/* calendar_plannerHeader contains a calendar_plannerHeaderTitle and multiple calendar_plannerHeaderRows
|
|
*/
|
|
.calendar_plannerHeader {
|
|
position: relative;
|
|
top: 0px;
|
|
left: 0px;
|
|
}
|
|
.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;
|
|
z-index: 1;
|
|
}
|
|
.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;
|
|
}
|
|
/* calendar_plannerRowWidget contains a calendar_plannerRowHeader and multiple eventRowWidgets in an calendar_eventRows
|
|
*/
|
|
.calendar_plannerRowWidget {
|
|
position: relative;
|
|
top: 0px;
|
|
left: 0px;
|
|
width: 100%;
|
|
min-height: 20px;
|
|
z-index: 2;
|
|
}
|
|
.calendar_plannerRowWidget:not(:first-child) {
|
|
border-top: 1px solid silver;
|
|
}
|
|
.calendar_plannerRowWidget[data-has_children]:before {
|
|
padding-right: 20px;
|
|
position: absolute;
|
|
content: " \25B6";
|
|
background-repeat: no-repeat;
|
|
left: 10px;
|
|
top: 2px;
|
|
}
|
|
.calendar_plannerRowWidget.current_user {
|
|
background-color: rgba(0, 0, 0, 0.05);
|
|
}
|
|
.calendar_plannerRowWidget:hover {
|
|
background-color: rgba(103, 159, 210, 0.2);
|
|
}
|
|
/* calendar_plannerScale represents a scale-row of the calendar_plannerHeader, containing multiple planner{Day|Week|Month}Scales
|
|
*/
|
|
.calendar_plannerScale,
|
|
.calendar_plannerScaleDay {
|
|
position: relative;
|
|
top: 0px;
|
|
left: 0%;
|
|
width: 100%;
|
|
height: 20px;
|
|
line-height: 20px;
|
|
display: flex;
|
|
flex-wrap: nowrap;
|
|
align-content: stretch;
|
|
}
|
|
.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%;
|
|
border-right: 1px solid silver;
|
|
border-bottom: 1px solid silver;
|
|
min-height: 2ex;
|
|
/* set via inline style on runtime:
|
|
* left:
|
|
* width:
|
|
*/
|
|
}
|
|
.calendar_plannerDayScale,
|
|
.calendar_plannerWeekScale,
|
|
.calendar_plannerHourScale {
|
|
position: static;
|
|
flex: 1 1 14%;
|
|
}
|
|
.calendar_plannerHourScale {
|
|
font-size: 90%;
|
|
}
|
|
.calendar_plannerDayScale {
|
|
font-size: 90%;
|
|
}
|
|
.calendar_plannerWeekScale {
|
|
line-height: 20px;
|
|
}
|
|
.calendar_plannerMonthScale {
|
|
font-weight: bold;
|
|
}
|
|
.calendar_plannerDayScale img,
|
|
.calendar_plannerWeekScale img,
|
|
.calendar_plannerMonthScale img,
|
|
.calendar_plannerDayOfMonthScale img {
|
|
vertical-align: middle;
|
|
}
|
|
/* calendar_plannerRowHeader contains the user or category name of the calendar_plannerRowWidget
|
|
*/
|
|
.calendar_plannerRowHeader,
|
|
.calendar_plannerHeaderTitle {
|
|
position: absolute;
|
|
top: 0px;
|
|
left: 0%;
|
|
width: 150px;
|
|
height: 100%;
|
|
line-height: 20px;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
padding-left: 20px;
|
|
padding-right: 1px;
|
|
}
|
|
.calendar_plannerRowHeader:hover {
|
|
overflow: visible;
|
|
z-index: 30;
|
|
cursor: pointer;
|
|
}
|
|
.calendar_plannerHeaderTitle {
|
|
border-right: 1px solid silver;
|
|
}
|
|
/* calendar_eventRows contain multiple eventRowWidgets
|
|
*/
|
|
.calendar_eventRows,
|
|
.calendar_plannerHeaderRows {
|
|
position: relative;
|
|
top: 0px;
|
|
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 */
|
|
min-height: 20px;
|
|
height: 100%;
|
|
}
|
|
.calendar_plannerWidget .verticalBar {
|
|
width: 8ex;
|
|
height: 100%;
|
|
position: absolute;
|
|
top: 0px;
|
|
border-right: 1px dotted;
|
|
pointer-events: none;
|
|
z-index: 40;
|
|
display: none;
|
|
}
|
|
.calendar_plannerWidget .verticalBar > span {
|
|
position: absolute;
|
|
bottom: 0px;
|
|
right: 0px;
|
|
background-color: rgba(255, 255, 255, 0.8);
|
|
}
|
|
/**
|
|
* Filler for month with less then 31 days in yearly planner
|
|
*/
|
|
.calendar_eventRowsFiller {
|
|
position: absolute;
|
|
top: 0px;
|
|
right: 0px;
|
|
height: 93%;
|
|
background-color: white;
|
|
border: 1px dashed gray;
|
|
border-right: none;
|
|
}
|
|
/**
|
|
* Weekend or other special days in yearly planner
|
|
*/
|
|
.calendar_eventRowsMarkedDay {
|
|
position: absolute;
|
|
top: 0px;
|
|
height: 100%;
|
|
z-index: 10;
|
|
}
|
|
.calendar_eventRowsMarkedDay.calendar_weekend {
|
|
background-color: #e0e0e0;
|
|
}
|
|
/* calendar_eventRowWidget contains non-overlapping events
|
|
*/
|
|
.calendar_eventRowWidget {
|
|
position: relative;
|
|
top: 0px;
|
|
left: 0px;
|
|
width: 100%;
|
|
height: 20px;
|
|
border: 1px solid white;
|
|
}
|
|
.calendar_plannerWidget .calendar_calEventHeader,
|
|
.calendar_calEventHeaderSmall {
|
|
height: 100%;
|
|
padding-top: 2px;
|
|
}
|
|
.calendar_plannerWidget .calendar_calEventSmall[data-full_day='true'] .calendar_calTimespan {
|
|
display: none;
|
|
}
|
|
.calendar_plannerWidget .calendar_calEventSmall .calendar_calEventTitle {
|
|
display: inline;
|
|
}
|
|
/* Special colors for the year view */
|
|
.calendar_cal_year_legend_weekend {
|
|
background-color: #CCCCCC;
|
|
}
|
|
.calendar_cal_year_legend {
|
|
background-color: #EFEFEF;
|
|
}
|
|
.calendar_cal_year_legend {
|
|
background-color: #FFFFCC;
|
|
z-index: 0;
|
|
}
|
|
.calendar_cal_year_weekend {
|
|
background-color: #F9F9CC;
|
|
z-index: 0;
|
|
}
|
|
.calendar_cal_year_today {
|
|
border-color: #EE0000;
|
|
border-width: 2px;
|
|
}
|
|
/**
|
|
* edit series or exception popup used in eventWidget and
|
|
* delete series and exceptions popup used in edit event
|
|
*/
|
|
#dialog-content {
|
|
display: block;
|
|
height: 100px;
|
|
padding: 6px;
|
|
color: #666666;
|
|
font-size: 13px;
|
|
margin: -2px -1px 0px -2px;
|
|
width: 410px;
|
|
}
|
|
/**
|
|
* Calendar Drag and Drop
|
|
* Class for div to show forbiden drop
|
|
*/
|
|
.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;
|
|
}
|
|
.calendar_timeDemo {
|
|
position: absolute;
|
|
bottom: 0;
|
|
left: 0;
|
|
background-color: #808080;
|
|
color: white;
|
|
width: 100%;
|
|
min-width: 5em;
|
|
align: center;
|
|
border: dashed white 1px;
|
|
border-radius: 1px;
|
|
}
|
|
.calendar_d-n-d_forbiden {
|
|
background-color: red;
|
|
height: 100%;
|
|
width: 100%;
|
|
text-align: center;
|
|
}
|
|
/*Class for div to demonstrate dragging time*/
|
|
.calendar_d-n-d_timeCounter {
|
|
font-size: 1.1em;
|
|
font-weight: bold;
|
|
text-align: center;
|
|
}
|
|
.calendar_d-n-d_timeCounter .loading {
|
|
width: 16px;
|
|
height: 16px;
|
|
position: absolute;
|
|
bottom: 0px;
|
|
right: 0px;
|
|
}
|
|
#calendar-list_undelete_popup,
|
|
#calendar-list_delete_popup {
|
|
display: none;
|
|
}
|
|
.calendar_freetime_header {
|
|
font-size: 120%;
|
|
font-weight: bold;
|
|
}
|
|
.calendar_freetime_timeframe {
|
|
position: relative;
|
|
}
|
|
img.calendar_print_button,
|
|
img.calendar_print_appicon {
|
|
height: 24px;
|
|
width: 24px;
|
|
}
|
|
/*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;
|
|
}
|
|
/**
|
|
* View animation stuff
|
|
*/
|
|
.calendar_slide {
|
|
/* There is a cleanup timeout in calendar app.js line 563 that must match */
|
|
transition-duration: 0s;
|
|
/* was 2s */
|
|
transition-delay: 50ms;
|
|
}
|
|
/**
|
|
* Home page portlets
|
|
*/
|
|
.calendar_favorite_portlet .calendar_calMonthNavHeader a img,
|
|
.calendar_favorite_portlet .calendar_calWeekNavHeader a img,
|
|
.calendar_favorite_portlet .calendar_calDayColHeader a img,
|
|
.calendar_favorite_portlet .calendar_plannerScale a img {
|
|
display: none;
|
|
}
|
|
#calendar-edit_account + .chzn-container .chzn-results {
|
|
max-height: 195px;
|
|
}
|
|
#calendar_sidebox_content .ui-datepicker div.ui-datepicker-buttonpane {
|
|
border-top: 0;
|
|
margin: 0;
|
|
padding-right: 3px;
|
|
}
|
|
/*weekend slideSwitch in toolbar*/
|
|
#calendar-toolbar_app_header {
|
|
color: #000;
|
|
font-size: 14px;
|
|
height: 1.7em;
|
|
padding: 4px 3px 3px;
|
|
background: #b4cee773;
|
|
border-radius: 3px;
|
|
min-width: 19em;
|
|
border: 1px solid #d4d4d8;
|
|
text-align: center;
|
|
}
|
|
/* Integration slide switches in toolbar */
|
|
#calendar-toolbar_toolbar et2-switch {
|
|
height: var(--height);
|
|
display: inline-flex;
|
|
}
|
|
#calendar-toolbar_toolbar span[data-group="integration"] > et2-switch,
|
|
#toolbar-menulist et2-switch[id^="calendar-toolbar_toolbar-integration"],
|
|
#toolbar-menulist et2-switch[id^="calendar-toolbar_toolbar-video_toggle"] {
|
|
background-size: 20px;
|
|
background-repeat: no-repeat;
|
|
background-position: center;
|
|
filter: grayscale(1) contrast(0.9999) opacity(0.7);
|
|
}
|
|
et2-switch#calendar-toolbar_toolbar-weekend {
|
|
background-image: none !important;
|
|
}
|
|
#calendar-toolbar_toolbar span[data-group="integration"] > et2-switch[checked],
|
|
#toolbar-menulist et2-switch[id^="calendar-toolbar_toolbar-integration"][checked],
|
|
#toolbar-menulist et2-switch[id^="calendar-toolbar_toolbar-video_toggle"][checked] {
|
|
filter: none;
|
|
box-shadow: inset 1px 1px 1px 1px gray !important;
|
|
}
|
|
#calendar-toolbar_toolbar span[data-group="integration"] > et2-switch span.label,
|
|
#toolbar-menulist et2-switch[id^="calendar-toolbar_toolbar-video_toggle"] span.label,
|
|
#toolbar-menulist et2-switch[id^="calendar-toolbar_toolbar-integration"] span.label {
|
|
background: none;
|
|
min-width: 24px;
|
|
}
|
|
#calendar-toolbar_toolbar et2-switch::part(control) {
|
|
visibility: hidden;
|
|
}
|
|
#calendar-toolbar_toolbar et2-switch {
|
|
height: 32px;
|
|
display: inline-block;
|
|
vertical-align: top;
|
|
border: 1px solid silver;
|
|
border-radius: 3px;
|
|
}
|
|
.ui-toolbar-menulist et2-switch,
|
|
.ui-toolbar-menulist et2-switch::part(base),
|
|
.ui-toolbar-menulist et2-switch::part(label),
|
|
.ui-toolbar-menulist et2-switch .label {
|
|
width: 100%!important;
|
|
}
|
|
#calendar-toolbar_toolbar .et2_toolbar_more {
|
|
margin-top: 0;
|
|
}
|
|
#calendar-toolbar button#toolbar-today {
|
|
color: #616161;
|
|
font-weight: 500;
|
|
}
|
|
#calendar-edit .dialogFooterToolbar {
|
|
min-width: 800px;
|
|
}
|
|
#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,
|
|
.calendar_calDayColHeader:first-child:nth-last-child(5) ~ .calendar_calDayColHeader > div[data-date] .short_date {
|
|
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,
|
|
.calendar_calDayColHeader:first-child:nth-last-child(2) ~ .calendar_calDayColHeader > div[data-date] .long_date {
|
|
display: inline;
|
|
}
|
|
}
|
|
#calendar-edit_quantity.et2_textbox_ro {
|
|
opacity: 0.5;
|
|
}
|
|
#calendar-edit_quantity,
|
|
#calendar-edit_role {
|
|
float: left;
|
|
}
|
|
.category_report_cats {
|
|
height: 80%;
|
|
overflow-y: auto;
|
|
display: block;
|
|
}
|
|
#calendar-category_report_grid {
|
|
display: block;
|
|
max-height: 550px;
|
|
overflow-y: auto;
|
|
}
|
|
#toolbar-weekend {
|
|
background-image: none !important;
|
|
filter: none;
|
|
}
|
|
#calendar-list_nm .nextmatch_header .header_count {
|
|
margin-right: -4px;
|
|
}
|
|
#calendar-list_nm .nextmatch_header .search {
|
|
display: none;
|
|
}
|
|
#calendar-edit_description {
|
|
height: 70%;
|
|
margin-bottom: 2em;
|
|
}
|
|
/*generell*/
|
|
.egw_fw_content_browser_iframe img[src$="svg"] {
|
|
background-color: #828282 !important;
|
|
background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0iZzc0MyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj48c3RvcCBzdG9wLWNvbG9yPSIjODI4MjgyIiBvZmZzZXQ9IjAiLz48c3RvcCBzdG9wLWNvbG9yPSIjODI4MjgyIiBvZmZzZXQ9IjEiLz48L2xpbmVhckdyYWRpZW50PjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZzc0MykiLz48L3N2Zz4=) !important;
|
|
background-image: -moz-linear-gradient(top, #828282, #828282) !important;
|
|
background-image: -ms-linear-gradient(top, #828282, #828282) !important;
|
|
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#828282), to(#828282)) !important;
|
|
background-image: -webkit-linear-gradient(top, #828282, #828282) !important;
|
|
background-image: -o-linear-gradient(top, #828282, #828282) !important;
|
|
background-image: linear-gradient(top, #828282, #828282) !important;
|
|
background-repeat: repeat-x !important;
|
|
}
|
|
#calendar-list {
|
|
/* Keeps the scrollbar in the window in chrome */
|
|
margin-right: 10px;
|
|
/* Prevents going to far down (off bottom)*/
|
|
height: calc(100% - 78px);
|
|
}
|
|
#calendar_sidebox_content .egw_fw_ui_category_content {
|
|
padding-left: 0px !important;
|
|
}
|
|
img.sideboxstar {
|
|
width: 12px;
|
|
height: 12px;
|
|
/*.background_color_10_gray;*/
|
|
-webkit-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
|
|
-moz-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
|
|
box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
|
|
border: 1px solid rgba(0, 0, 0, 0.15);
|
|
-webkit-border-radius: 3px;
|
|
-moz-border-radius: 3px;
|
|
border-radius: 3px;
|
|
padding: 3px;
|
|
margin: 1px;
|
|
}
|
|
img.sideboxstar:hover {
|
|
/*.background_color_20_gray;*/
|
|
-webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
|
|
-moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
|
|
box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
|
|
border: 1px solid rgba(0, 0, 0, 0.5);
|
|
-webkit-border-radius: 3px;
|
|
-moz-border-radius: 3px;
|
|
border-radius: 3px;
|
|
}
|
|
img.sideboxstar:active {
|
|
/*.background_color_30_gray;*/
|
|
border: 1px solid rgba(0, 0, 0, 0.9);
|
|
-webkit-border-radius: 3px;
|
|
-moz-border-radius: 3px;
|
|
border-radius: 3px;
|
|
-webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
|
|
-moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
|
|
box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
|
|
background-color: #b3e4a6;
|
|
background-color: #b3e4a6 !important;
|
|
}
|
|
.chzn-container {
|
|
max-width: 85% !important;
|
|
margin-top: 0em;
|
|
}
|
|
.egw_fw_content_browser_iframe {
|
|
margin-top: 0em;
|
|
border: none;
|
|
}
|
|
.calendar_calDayColHeader img {
|
|
width: 16px;
|
|
height: 16px;
|
|
}
|
|
.calendar_calWeekNavHeader img {
|
|
width: 16px;
|
|
height: 16px;
|
|
}
|
|
.calendar_calMonthNavHeader img {
|
|
width: 16px;
|
|
height: 16px;
|
|
}
|
|
.calendar_calEventBodySmall img {
|
|
width: 16px;
|
|
height: 16px;
|
|
}
|
|
.calendar_calEventBodySmall img[src$="svg"],
|
|
.calendar_calDayColHeader img[src$="svg"] {
|
|
background-color: #0c5da5;
|
|
background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0iZzc0MyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj48c3RvcCBzdG9wLWNvbG9yPSIjMEM1REE1IiBvZmZzZXQ9IjAiLz48c3RvcCBzdG9wLWNvbG9yPSIjMEM1REE1IiBvZmZzZXQ9IjEiLz48L2xpbmVhckdyYWRpZW50PjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZzc0MykiLz48L3N2Zz4=);
|
|
background-image: -moz-linear-gradient(top, #0C5DA5, #0C5DA5);
|
|
background-image: -ms-linear-gradient(top, #0C5DA5, #0C5DA5);
|
|
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0C5DA5), to(#0C5DA5));
|
|
background-image: -webkit-linear-gradient(top, #0C5DA5, #0C5DA5);
|
|
background-image: -o-linear-gradient(top, #0C5DA5, #0C5DA5);
|
|
background-image: linear-gradient(top, #0C5DA5, #0C5DA5);
|
|
background-repeat: repeat-x;
|
|
}
|
|
/* calender view*/
|
|
/*defind in layout_raster.less , because frame*/
|
|
span#start {
|
|
margin-right: 1em;
|
|
}
|
|
/* The main calendar widget. DIV containing a table. */
|
|
div.calendar {
|
|
position: relative;
|
|
}
|
|
/* Header part -- contains navigation buttons and day names. */
|
|
.calendar {
|
|
/* The body part -- contains all the days in month. */
|
|
/* The footer part -- status bar and "Close" button */
|
|
/* Combo boxes (menus that display months/years for direct selection) */
|
|
}
|
|
.calendar .button {
|
|
/* "<<", "<", ">", ">>" buttons have this class */
|
|
text-align: center;
|
|
/* They are the navigation buttons */
|
|
padding: 2px;
|
|
/* Make the buttons seem like they're pressing */
|
|
background-color: #FFDD73;
|
|
}
|
|
.calendar .nav {
|
|
/*background: url(../../default/images/menuarrow.png) no-repeat 100% 100%;*/
|
|
background-image: none;
|
|
background-color: #FFDD73;
|
|
}
|
|
.calendar thead .title {
|
|
/* This holds the current "month, year" */
|
|
font-weight: bold;
|
|
/* Pressing it will take you to the current date */
|
|
/*text-align: center;*/
|
|
background-color: #679FD2;
|
|
}
|
|
.calendar thead .title:hover {
|
|
background-color: #E6E6E6 !important;
|
|
}
|
|
.calendar thead .headrow {
|
|
/* Row <TR> containing navigation buttons */
|
|
background-color: #FFDD73;
|
|
color: #fff;
|
|
}
|
|
.calendar thead .daynames {
|
|
/* Row <TR> containing the day names */
|
|
background-color: #b3b3b3 !important;
|
|
}
|
|
.calendar thead .name {
|
|
/* Cells <TD> containing the day names */
|
|
/*border-bottom: 1px solid #556;*/
|
|
/*padding: 2px;*/
|
|
/*text-align: center;*/
|
|
/*color: #000;*/
|
|
}
|
|
.calendar thead .weekend {
|
|
/* How a weekend day name shows in header */
|
|
color: #a66;
|
|
}
|
|
.calendar thead .hilite {
|
|
/* How do the buttons in header appear when hover */
|
|
background-color: #ffffff;
|
|
border: none;
|
|
/*.box_shadow_standard_light_inset;*/
|
|
/*color: #000;*/
|
|
/*border: 0px solid;*/
|
|
border-color: #828282;
|
|
/*padding: 1px;*/
|
|
}
|
|
.calendar thead .active {
|
|
/* Active (pressed) buttons in header */
|
|
background_color: #408DD2;
|
|
/*padding: 2px 0px 0px 2px;*/
|
|
}
|
|
.calendar tbody tr,
|
|
.calendar tbody td {
|
|
border: 1px;
|
|
}
|
|
.calendar tbody .day {
|
|
/* Cells <TD> containing month days dates */
|
|
/*width: 2em;*/
|
|
/*color: #456;*/
|
|
/*text-align: right;*/
|
|
/*padding: 2px 4px 2px 2px;*/
|
|
/*border: 1px;*/
|
|
}
|
|
.calendar tbody .day.othermonth {
|
|
font-size: 80%;
|
|
color: #bbb;
|
|
}
|
|
.calendar tbody .day.othermonth.oweekend {
|
|
color: #fbb;
|
|
}
|
|
.calendar tbody .rowhilite td {
|
|
background-color: #bfbfbf;
|
|
}
|
|
.calendar tbody .rowhilite td.wn {
|
|
background: #eef;
|
|
}
|
|
.calendar tbody td.hilite {
|
|
/* Hovered cells <TD> */
|
|
/*background: #def;*/
|
|
/*padding: 1px 3px 1px 1px;*/
|
|
/*border: 1px solid #bbb;*/
|
|
}
|
|
.calendar tbody td.active {
|
|
/* Active (pressed) cells <TD> */
|
|
background: #cde;
|
|
/*padding: 2px 2px 0px 2px;*/
|
|
}
|
|
.calendar tbody td.selected {
|
|
/* Cell showing today date */
|
|
/*font-weight: normal;*/
|
|
/*border: 0px solid @gray_50;*/
|
|
/*padding: 1px 3px 1px 1px;*/
|
|
/*padding: 0px;*/
|
|
background-color: #FFDD73;
|
|
color: #000;
|
|
-webkit-box-shadow: inset 1px 2px 1px #000000;
|
|
-moz-box-shadow: inset 1px 2px 1px #000000;
|
|
box-shadow: inset 1px 2px 1px #000000;
|
|
}
|
|
.calendar tbody td.weekend {
|
|
/* Cells showing weekend days */
|
|
color: #a66;
|
|
}
|
|
.calendar tbody td.today {
|
|
/* Cell showing selected date */
|
|
font-weight: normal;
|
|
color: #189800;
|
|
background-color: #ffc200;
|
|
}
|
|
.calendar tbody .disabled {
|
|
color: #999;
|
|
}
|
|
.calendar tbody .emptycell {
|
|
/* Empty cells (the best is to hide them) */
|
|
visibility: hidden;
|
|
}
|
|
.calendar tbody .emptyrow {
|
|
/* Empty row (some months need less than 6 rows) */
|
|
display: none;
|
|
}
|
|
.calendar table .wn {
|
|
/*padding: 2px 3px 2px 2px;*/
|
|
/*border-right: 1px solid #000;*/
|
|
background-color: #b3b3b3 !important;
|
|
}
|
|
.calendar tfoot .footrow {
|
|
/* The <TR> in footer (only one right now) */
|
|
text-align: center;
|
|
background: #556;
|
|
color: #fff;
|
|
}
|
|
.calendar tfoot .ttip {
|
|
/* Tooltip (status bar) cell <TD> */
|
|
background: #fff;
|
|
color: #445;
|
|
border-top: 1px solid #556;
|
|
padding: 1px;
|
|
height: 30px;
|
|
}
|
|
.calendar tfoot .hilite {
|
|
/* Hover style for buttons in footer */
|
|
background: #aaf;
|
|
border: 1px solid #04f;
|
|
color: #000;
|
|
padding: 1px;
|
|
}
|
|
.calendar tfoot .active {
|
|
/* Active (pressed) style for buttons in footer */
|
|
background: #77c;
|
|
padding: 2px 0px 0px 2px;
|
|
}
|
|
.calendar .combo {
|
|
position: absolute;
|
|
display: none;
|
|
top: 0px;
|
|
left: 0px;
|
|
width: 4em;
|
|
cursor: default;
|
|
border: 1px solid #655;
|
|
background: #def;
|
|
color: #000;
|
|
font-size: 90%;
|
|
}
|
|
.calendar .combo .label,
|
|
.calendar .combo .label-IEfix {
|
|
text-align: center;
|
|
padding: 1px;
|
|
}
|
|
.calendar .combo .label-IEfix {
|
|
width: 4em;
|
|
}
|
|
.calendar .combo .hilite {
|
|
background: #acf;
|
|
}
|
|
.calendar .combo .active {
|
|
border-top: 1px solid #46a;
|
|
border-bottom: 1px solid #46a;
|
|
background: #eef;
|
|
font-weight: bold;
|
|
}
|
|
.calendar td.time {
|
|
border-top: 1px solid #000;
|
|
padding: 1px 0px;
|
|
text-align: center;
|
|
background-color: #f4f0e8;
|
|
}
|
|
.calendar td.time .hour,
|
|
.calendar td.time .minute,
|
|
.calendar td.time .ampm {
|
|
padding: 0px 3px 0px 4px;
|
|
border: 1px solid #889;
|
|
font-weight: bold;
|
|
background-color: #fff;
|
|
}
|
|
.calendar td.time .ampm {
|
|
text-align: center;
|
|
}
|
|
.calendar td.time .colon {
|
|
padding: 0px 2px 0px 3px;
|
|
font-weight: bold;
|
|
}
|
|
.calendar td.time span.hilite {
|
|
border-color: #000;
|
|
background-color: #b3b3b3 !important;
|
|
color: #fff;
|
|
}
|
|
.calendar td.time span.active {
|
|
border-color: #f00;
|
|
background-color: #000;
|
|
color: #0f0;
|
|
}
|
|
#calendar-edit {
|
|
/*###########################################*/
|
|
/*###########################################*/
|
|
/*Tab Beschreibung*/
|
|
/*###########################################*/
|
|
/*###########################################*/
|
|
/*###########################################*/
|
|
/*###########################################*/
|
|
/*###########################################*/
|
|
/*###########################################*/
|
|
/*// Historie*/
|
|
/*###########################################*/
|
|
/*// Toolbar*/
|
|
}
|
|
#calendar-edit label.et2_label {
|
|
/*padding: 0 2px;*/
|
|
}
|
|
#calendar-edit .chzn-container {
|
|
padding-top: 0;
|
|
}
|
|
#calendar-edit .et2_tabheader {
|
|
background-color: transparent;
|
|
}
|
|
#calendar-edit #calendar-edit_id {
|
|
float: right;
|
|
margin-right: 5px;
|
|
}
|
|
#calendar-edit #calendar-edit_calendar-edit-details {
|
|
display: block;
|
|
float: left;
|
|
width: 100%;
|
|
}
|
|
#calendar-edit #calendar-edit_calendar-edit-details table.et2_grid {
|
|
/*background-color: yellow;*/
|
|
line-height: 20px;
|
|
width: 60%;
|
|
}
|
|
#calendar-edit #calendar-edit_calendar-edit-details .calendar_category_details {
|
|
margin: 0 1em;
|
|
width: 20em;
|
|
}
|
|
#calendar-edit #calendar-edit_calendar-edit-details .et2_hbox_right {
|
|
overflow-y: auto;
|
|
width: 30%;
|
|
}
|
|
#calendar-edit #calendar-edit_calendar-edit-details .et2_selectbox .ui-multiselect-checkboxes {
|
|
min-height: 229px;
|
|
}
|
|
#calendar-edit #calendar-edit_calendar-edit-details .et2_selectbox .ui-multiselect-checkboxes li {
|
|
text-indent: -20px;
|
|
}
|
|
#calendar-edit #calendar-edit_calendar-edit-details #calendar-edit_category {
|
|
-webkit-border-radius: 3px;
|
|
-moz-border-radius: 3px;
|
|
border-radius: 3px;
|
|
padding: 0 0.3em 0 0;
|
|
}
|
|
#calendar-edit #calendar-edit_calendar-edit-details #calendar-edit_category li .ui-state-hover {
|
|
font-weight: normal !important;
|
|
-webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
|
|
-moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
|
|
box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
|
|
}
|
|
#calendar-edit #calendar-edit_calendar-edit-details #calendar-edit_details_alarms {
|
|
background-color: #CDCDCD;
|
|
display: block !important;
|
|
}
|
|
#calendar-edit #calendar-edit_calendar-edit-description #calendar-edit_details_category {
|
|
margin: 0 1em;
|
|
width: 20em;
|
|
}
|
|
#calendar-edit #calendar-edit_calendar-edit-description .et2_hbox_right {
|
|
overflow-y: auto;
|
|
}
|
|
#calendar-edit #calendar-edit_calendar-edit-description .et2_selectbox .ui-multiselect-checkboxes {
|
|
min-height: 218px;
|
|
}
|
|
#calendar-edit #calendar-edit_calendar-edit-description .et2_selectbox .ui-multiselect-checkboxes li {
|
|
text-indent: -20px;
|
|
}
|
|
#calendar-edit #calendar-edit_calendar-edit-description #calendar-edit_category {
|
|
border: 1px solid;
|
|
border-color: #B4B4B4;
|
|
-webkit-border-radius: 3px;
|
|
-moz-border-radius: 3px;
|
|
border-radius: 3px;
|
|
padding: 0 0.3em 0 0;
|
|
}
|
|
#calendar-edit #calendar-edit_calendar-edit-description #calendar-edit_category li .ui-state-hover {
|
|
font-weight: normal !important;
|
|
-webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
|
|
-moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
|
|
box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
|
|
}
|
|
#calendar-edit #calendar-edit_calendar-edit-recurrence tbody {
|
|
display: table;
|
|
width: 100%;
|
|
line-height: 30px;
|
|
}
|
|
#calendar-edit #calendar-edit_calendar-edit-custom tbody {
|
|
display: table;
|
|
width: 100%;
|
|
}
|
|
#calendar-edit #calendar-edit_calendar-edit-links tbody {
|
|
display: table;
|
|
width: 100%;
|
|
}
|
|
#calendar-edit #calendar-edit_calendar-edit-links tbody .et2_link_to {
|
|
width: auto !important;
|
|
margin: 1em;
|
|
}
|
|
#calendar-edit #calendar-edit_calendar-edit-links span.et2_label {
|
|
padding: 1em;
|
|
}
|
|
#calendar-edit #calendar-edit_calendar-edit-alarms tbody {
|
|
display: table;
|
|
width: 100%;
|
|
}
|
|
#calendar-edit #calendar-edit_calendar-edit-alarms tbody label.et2_label {
|
|
white-space: nowrap;
|
|
padding: 0 5px;
|
|
}
|
|
#calendar-edit #calendar-edit_calendar-edit-alarms tbody tr.add_alarm_action {
|
|
background-color: rgba(255, 221, 115, 0.1);
|
|
margin-bottom: 1em;
|
|
}
|
|
#calendar-edit #calendar-edit_calendar-edit-history tbody {
|
|
display: table-row-group;
|
|
width: 100%;
|
|
}
|
|
#calendar-edit tr.dialogFooterToolbar label.et2_label {
|
|
top: 0px !important;
|
|
}
|
|
#calendar-edit #calendar-edit_recur_enddate input.et2_date {
|
|
margin: 0px -1px;
|
|
}
|
|
/******************************************************************
|
|
* CSS settings for the day, week and month view (timeGridWidget) *
|
|
******************************************************************/
|
|
/*
|
|
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:
|
|
e.g. the div with class calendar_calTimeGrid is generated by the timeGridWidget method of uiviews.
|
|
|
|
+++ calendar_calTimeGrid +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
|
|
+ #### calendar_calDayCols[12h|NoGrip] ###########################################################
|
|
+ #... calendar_calDayCol ............................. ... calendar_calDayCol ..........................
|
|
+ #.+- calendar_calDayColHeader ---------------------+. .+- calendar_calDayColHeader ------------------+.
|
|
+ #.| |. .| |.
|
|
+ #.+---------------------------------------+. .+------------------------------------+.
|
|
+.calendar_calTimeRowTime.#.** calendar_calEventCol ***** ** calendar_calEventCol *****. .** calendar_calEventCol ***********************.
|
|
+. .#.* * * *. .* *.
|
|
+. .#.* * * *. .* *.
|
|
+................#.*+- calendar_calEvent -----+* * *. .* *.
|
|
+.calendar_calTimeRowTime.#.*| |* * *. .*+- calendar_calEvent[Private] --------------+*.
|
|
+. .#.*| |* *+- calendar_calEvent -----+*. .*| |*.
|
|
+. .#.*+----------------+* *| |*. .*| |*.
|
|
+................#.* * *| |*. .*| |*.
|
|
+.calendar_calTimeRowTime.#.* * *+----------------+*. .*| |*.
|
|
+. .#.* * * *. .*+----------------------------------+*.
|
|
|
|
*/
|
|
/* 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;
|
|
}
|
|
.calendar_size120b {
|
|
font-size: 120%;
|
|
font-weight: bold;
|
|
}
|
|
/* marks a day in the colum-header as today
|
|
*/
|
|
.calendar_calToday,
|
|
.calendar_calTimeGrid .calendar_calDayColHeader .calendar_calToday.et2_link.et2_clickable {
|
|
background-color: #FFDD73;
|
|
}
|
|
.calendar_calWeek {
|
|
background-color: #FFFFFF;
|
|
width: auto;
|
|
margin: 0 auto;
|
|
text-align: center;
|
|
border: none;
|
|
}
|
|
.calendar_calMonth {
|
|
/*.background_table_cal_head;*/
|
|
background-color: #FFFFFF;
|
|
width: auto;
|
|
margin: 0 auto;
|
|
text-align: center;
|
|
border: none;
|
|
}
|
|
/* marks a day in the colum-header as holiday
|
|
*/
|
|
.calendar_calHoliday a {
|
|
font-size: 0.9em;
|
|
}
|
|
/* marks a day in the column-header additionaly as birthday of some contact,
|
|
* it should work together with the backgrounds of calendar_calToday, calendar_calHoliday, th, row_on and row_off
|
|
*/
|
|
/* timeGridWidget, contains timeRow's and dayCol's
|
|
*/
|
|
.calendar_calTimeGrid {
|
|
/* set via inline style on runtime:
|
|
* height:
|
|
*/
|
|
}
|
|
.calendar_calTimeRow {
|
|
/* background-color: silver; */
|
|
background-color: #fafafa;
|
|
}
|
|
/* time in a timeRow
|
|
*/
|
|
.calendar_calTimeRowTime {
|
|
padding-left: 5px;
|
|
height: 100%;
|
|
line-height: 14px;
|
|
font-size: 8pt;
|
|
text-align: left;
|
|
}
|
|
/* Calendar Id #
|
|
*/
|
|
#calendar-edit_id:before {
|
|
content: "#";
|
|
}
|
|
/* header for the dayCol
|
|
*/
|
|
.calendar_calDayColHeader a img,
|
|
.calendar_calGridHeader a img {
|
|
position: relative;
|
|
top: 0px;
|
|
}
|
|
/*header for the weekCol*/
|
|
.calendar_calWeekNavHeader,
|
|
.calendar_calMonthNavHeader {
|
|
top: 3px;
|
|
left: 0px;
|
|
width: auto;
|
|
right: 0px;
|
|
/* does not work in IE, but looks better in other browsers then width:100% */
|
|
text-align: center;
|
|
font-size: 100%;
|
|
white-space: nowrap;
|
|
border-bottom: 0px solid silver;
|
|
border-right: 0px solid silver;
|
|
height: 24px;
|
|
line-height: 21px;
|
|
/*height: 24px;*/
|
|
z-index: 30;
|
|
}
|
|
.calendar_calWeekNavHeader a img,
|
|
.calendar_calMonthNavHeader a img {
|
|
position: relative;
|
|
top: 3px;
|
|
}
|
|
.calendar_calMonthNavHeader a img {
|
|
top: 0px;
|
|
}
|
|
.calendar_calWeekNavHeader,
|
|
.calendar_calMonthNavHeader img {
|
|
vertical-align: middle;
|
|
}
|
|
.calendar_calViewUserNameBox {
|
|
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;
|
|
}
|
|
.calendar_calViewUserName {
|
|
font-weight: normal;
|
|
}
|
|
.calendar_calViewUserName:first-letter {
|
|
text-transform: uppercase;
|
|
}
|
|
.calendar_calViewUserNameFirst:after {
|
|
content: ", ";
|
|
}
|
|
/* contains one event: header-row & -body
|
|
*/
|
|
.calendar_calEvent {
|
|
/* set via inline style on runtime:
|
|
* top: depending on startime
|
|
* height: depending on length
|
|
* border-color: depending on category
|
|
* background: depending on category (shade)
|
|
*/
|
|
background-color: #679FD2;
|
|
border-top: 1px solid;
|
|
}
|
|
.calendar_calEvent:not([class*=" cat_"]) {
|
|
/* Defaults for no category, so we don't override it */
|
|
background-color: #679FD2;
|
|
}
|
|
/**
|
|
* All participants accepted the invitation
|
|
*/
|
|
/**
|
|
* All participants answered the invitation, but not all accepted
|
|
*/
|
|
/**
|
|
* Some participants did NOT answer the invitation
|
|
*/
|
|
.calendar_calEventTooltip {
|
|
max-height: 400px;
|
|
overflow: auto;
|
|
}
|
|
.calendar_calDayColHeader .calendar_calAddEvent:hover {
|
|
background-color: #FFDD73;
|
|
cursor: pointer;
|
|
color: #ffffff;
|
|
}
|
|
/* header-row of the event
|
|
*/
|
|
.calendar_calEventHeader,
|
|
.calendar_calEventHeaderSmall {
|
|
text-align: left;
|
|
left: 0px;
|
|
right: 0px;
|
|
padding-left: 2px;
|
|
/* set via inline style on runtime
|
|
* background-color: depending on category
|
|
* color: white || black depending on cat;
|
|
*/
|
|
}
|
|
.calendar_calEventHeaderSmall {
|
|
font-size: 8pt;
|
|
line-height: 10pt;
|
|
}
|
|
.calendar_calEventIcons {
|
|
position: absolute;
|
|
right: 0px;
|
|
top: 0px;
|
|
background-color: #E6E6E6;
|
|
-webkit-border-radius: 2px;
|
|
-moz-border-radius: 2px;
|
|
border-radius: 2px;
|
|
}
|
|
.calendar_calEventHeaderSmall .calendar_calEventIcons img {
|
|
height: 13px;
|
|
}
|
|
/* table of the dayView containing 2 cols: 1) day-view, 2) todos
|
|
*/
|
|
.calendar_calDayView {
|
|
width: 100%;
|
|
}
|
|
/* calDayTods is the day-view's todo column, containing the calDayTodoHeader and the calDayTodoTable
|
|
*/
|
|
.calendar_calDayTodos .calendar_calDayTodosHeader {
|
|
margin: 0px;
|
|
padding: 2px;
|
|
font-weight: bold;
|
|
}
|
|
.calendar_calDayTodos .calendar_calDayTodosHeader a img[src$="svg"] {
|
|
background-color: #0c5da5;
|
|
background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0iZzc0MyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj48c3RvcCBzdG9wLWNvbG9yPSIjMEM1REE1IiBvZmZzZXQ9IjAiLz48c3RvcCBzdG9wLWNvbG9yPSIjMEM1REE1IiBvZmZzZXQ9IjEiLz48L2xpbmVhckdyYWRpZW50PjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZzc0MykiLz48L3N2Zz4=);
|
|
background-image: -moz-linear-gradient(top, #0C5DA5, #0C5DA5);
|
|
background-image: -ms-linear-gradient(top, #0C5DA5, #0C5DA5);
|
|
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0C5DA5), to(#0C5DA5));
|
|
background-image: -webkit-linear-gradient(top, #0C5DA5, #0C5DA5);
|
|
background-image: -o-linear-gradient(top, #0C5DA5, #0C5DA5);
|
|
background-image: linear-gradient(top, #0C5DA5, #0C5DA5);
|
|
background-repeat: repeat-x;
|
|
}
|
|
.calendar_calDayTodos .calendar_calDayTodosHeader a img {
|
|
/*.border_normal;*/
|
|
/*.box_shadow_standard_light;*/
|
|
/*.rounded (3px);*/
|
|
color: #000000;
|
|
-webkit-appearance: none;
|
|
-webkit-transition-property: background-color;
|
|
-moz-transition-property: background-color;
|
|
-o-transition-property: background-color;
|
|
transition-property: background-color;
|
|
-webkit-transition-duration: 0.5s;
|
|
-moz-transition-duration: 0.5s;
|
|
-o-transition-duration: 0.5s;
|
|
transition-duration: 0.5s;
|
|
-webkit-transition-timing-function: linear;
|
|
-moz-transition-timing-function: linear;
|
|
-o-transition-timing-function: linear;
|
|
transition-timing-function: linear;
|
|
background-color: #E6E6E6;
|
|
width: 16px;
|
|
height: 16px;
|
|
}
|
|
.calendar_calDayTodos .calendar_calDayTodosHeader a img:hover {
|
|
-webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
|
|
-moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
|
|
box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
|
|
background-color: inherit;
|
|
}
|
|
.calendar_calDayTodos .calendar_calDayTodosTable table tr:nth-child(even) {
|
|
background: #FFFFFF;
|
|
}
|
|
.calendar_calDayTodos .calendar_calDayTodosTable table tr:nth-child(odd) {
|
|
background: #f2f2f2;
|
|
}
|
|
.calendar_calDayTodos .calendar_calDayTodosTable table td {
|
|
padding: 3px;
|
|
}
|
|
.calendar_calDayTodos .calendar_calDayTodosTable table td img[src$="svg"] {
|
|
background-color: #0c5da5;
|
|
background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0iZzc0MyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj48c3RvcCBzdG9wLWNvbG9yPSIjMEM1REE1IiBvZmZzZXQ9IjAiLz48c3RvcCBzdG9wLWNvbG9yPSIjMEM1REE1IiBvZmZzZXQ9IjEiLz48L2xpbmVhckdyYWRpZW50PjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZzc0MykiLz48L3N2Zz4=);
|
|
background-image: -moz-linear-gradient(top, #0C5DA5, #0C5DA5);
|
|
background-image: -ms-linear-gradient(top, #0C5DA5, #0C5DA5);
|
|
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#0C5DA5), to(#0C5DA5));
|
|
background-image: -webkit-linear-gradient(top, #0C5DA5, #0C5DA5);
|
|
background-image: -o-linear-gradient(top, #0C5DA5, #0C5DA5);
|
|
background-image: linear-gradient(top, #0C5DA5, #0C5DA5);
|
|
background-repeat: repeat-x;
|
|
}
|
|
.calendar_calDayTodos .calendar_calDayTodosTable table td img {
|
|
width: 12px;
|
|
height: 12px;
|
|
/*.background_color_10_gray;*/
|
|
-webkit-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
|
|
-moz-box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
|
|
box-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
|
|
border: 1px solid rgba(0, 0, 0, 0.15);
|
|
-webkit-border-radius: 3px;
|
|
-moz-border-radius: 3px;
|
|
border-radius: 3px;
|
|
}
|
|
.calendar_calDayTodos .calendar_calDayTodosTable table td img:hover {
|
|
/*.background_color_20_gray;*/
|
|
-webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
|
|
-moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
|
|
box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
|
|
border: 1px solid rgba(0, 0, 0, 0.5);
|
|
-webkit-border-radius: 3px;
|
|
-moz-border-radius: 3px;
|
|
border-radius: 3px;
|
|
}
|
|
.calendar_calDayTodos .calendar_calDayTodosTable table td img:active {
|
|
/*.background_color_30_gray;*/
|
|
border: 1px solid rgba(0, 0, 0, 0.9);
|
|
-webkit-border-radius: 3px;
|
|
-moz-border-radius: 3px;
|
|
border-radius: 3px;
|
|
-webkit-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
|
|
-moz-box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
|
|
box-shadow: inset 1px 2px 1px rgba(0, 0, 0, 0.5);
|
|
background-color: #b3e4a6;
|
|
background-color: #ace29e !important;
|
|
}
|
|
.calendar_calDayTodosHeader {
|
|
text-align: center;
|
|
}
|
|
/******************************************************
|
|
* CSS settings for the planner views (calendar_plannerWidget) *
|
|
******************************************************/
|
|
/* calendar_plannerWidget represents the whole planner, consiting of the calendar_plannerHeader and multiple plannerRowWidgets
|
|
*/
|
|
.calendar_plannerWidget {
|
|
width: 99.5%;
|
|
}
|
|
.calendar_plannerWidget img {
|
|
height: 16px;
|
|
}
|
|
/* calendar_plannerScale represents a scale-row of the calendar_plannerHeader, containing multiple planner{Day|Week|Month}Scales
|
|
*/
|
|
.calendar_plannerScaleDay {
|
|
height: 28px;
|
|
line-height: 14px;
|
|
}
|
|
.calendar_plannerDayScale,
|
|
.calendar_plannerMonthScale,
|
|
.calendar_plannerWeekScale,
|
|
.calendar_plannerHourScale,
|
|
.calendar_plannerDayOfMonthScale {
|
|
/* left+width: is set by the code on runtime */
|
|
text-align: center;
|
|
height: 100%;
|
|
/* set via inline style on runtime:
|
|
* left:
|
|
* width:
|
|
*/
|
|
}
|
|
.calendar_plannerHourScale {
|
|
font-size: 90%;
|
|
}
|
|
.calendar_plannerDayScale {
|
|
font-size: 90%;
|
|
}
|
|
.calendar_plannerWeekScale {
|
|
line-height: 20px;
|
|
}
|
|
.calendar_plannerMonthScale {
|
|
font-weight: bold;
|
|
}
|
|
.calendar_plannerMonthScale a img {
|
|
width: 16px;
|
|
height: 16px;
|
|
}
|
|
.calendar_plannerDayScale img,
|
|
.calendar_plannerWeekScale img,
|
|
.calendar_plannerMonthScale img,
|
|
.calendar_plannerDayOfMonthScale img {
|
|
vertical-align: text-top;
|
|
}
|
|
/* calendar_plannerRowHeader contains the user or category name of the calendar_plannerRowWidget
|
|
*/
|
|
.calendar_plannerRowHeader,
|
|
.calendar_plannerHeaderTitle {
|
|
line-height: 20px;
|
|
}
|
|
/**
|
|
* Filler for month with less then 31 days in yearly planner
|
|
*/
|
|
.calendar_eventRowsFiller {
|
|
height: 93%;
|
|
background-color: white;
|
|
border: 1px dashed gray;
|
|
border-right: none;
|
|
}
|
|
/* calendar_eventRowWidget contains non-overlapping events
|
|
*/
|
|
.calendar_eventRowWidget {
|
|
border: 1px solid white;
|
|
}
|
|
/* Special colors for the year view */
|
|
.calendar_cal_year_legend_weekend {
|
|
background-color: #CCCCCC;
|
|
}
|
|
.calendar_cal_year_legend {
|
|
background-color: #EFEFEF;
|
|
}
|
|
.calendar_cal_year_legend {
|
|
background-color: #FFFFCC;
|
|
z-index: 0;
|
|
}
|
|
.calendar_cal_year_weekend {
|
|
background-color: #F9F9CC;
|
|
z-index: 0;
|
|
}
|
|
.calendar_cal_year_today {
|
|
border-color: #EE0000;
|
|
border-width: 2px;
|
|
}
|
|
/**
|
|
* edit series or exception popup used in eventWidget and
|
|
* delete series and exceptions popup used in edit event
|
|
*/
|
|
#dialog-content {
|
|
display: block;
|
|
height: 100px;
|
|
padding: 6px;
|
|
color: #666666;
|
|
font-size: 13px;
|
|
margin: -2px -1px 0px -2px;
|
|
width: 410px;
|
|
}
|
|
/* ###########################################################################################################################################
|
|
* Calendar specfic
|
|
/* ###########################################################################################################################################
|
|
*/
|
|
/*ui-widget*/
|
|
/*edit series*/
|
|
button#series {
|
|
background-image: url('../../../api/templates/default/images/edit.svg') !important;
|
|
/*.border_normal;*/
|
|
/*.box_shadow_standard_light;*/
|
|
/*.rounded (3px);*/
|
|
color: #000000;
|
|
-webkit-appearance: none;
|
|
-webkit-transition-property: background-color;
|
|
-moz-transition-property: background-color;
|
|
-o-transition-property: background-color;
|
|
transition-property: background-color;
|
|
-webkit-transition-duration: 0.5s;
|
|
-moz-transition-duration: 0.5s;
|
|
-o-transition-duration: 0.5s;
|
|
transition-duration: 0.5s;
|
|
-webkit-transition-timing-function: linear;
|
|
-moz-transition-timing-function: linear;
|
|
-o-transition-timing-function: linear;
|
|
transition-timing-function: linear;
|
|
background-color: #E6E6E6;
|
|
padding-left: 30px;
|
|
background-position: 6px center;
|
|
background-repeat: no-repeat;
|
|
background-size: 20px auto;
|
|
/*.Button_size_h32_auto;*/
|
|
height: 24px;
|
|
}
|
|
button#series img[url*="svg"] {
|
|
background-color: #b4b4b4;
|
|
background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0iZzc0MyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj48c3RvcCBzdG9wLWNvbG9yPSIjQjRCNEI0IiBvZmZzZXQ9IjAiLz48c3RvcCBzdG9wLWNvbG9yPSIjQjRCNEI0IiBvZmZzZXQ9IjEiLz48L2xpbmVhckdyYWRpZW50PjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZzc0MykiLz48L3N2Zz4=);
|
|
background-image: -moz-linear-gradient(top, #B4B4B4, #B4B4B4);
|
|
background-image: -ms-linear-gradient(top, #B4B4B4, #B4B4B4);
|
|
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#B4B4B4), to(#B4B4B4));
|
|
background-image: -webkit-linear-gradient(top, #B4B4B4, #B4B4B4);
|
|
background-image: -o-linear-gradient(top, #B4B4B4, #B4B4B4);
|
|
background-image: linear-gradient(top, #B4B4B4, #B4B4B4);
|
|
background-repeat: repeat-x;
|
|
fill: red;
|
|
}
|
|
button#series:hover {
|
|
color: #000000;
|
|
-webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
|
|
-moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
|
|
box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
|
|
}
|
|
button#series:hover {
|
|
background-image: url('../../../api/templates/default/images/edit.svg') !important;
|
|
background-color: #b3e4a6 !important;
|
|
}
|
|
button#series:active {
|
|
background-color: #b3e4a6 !important;
|
|
}
|
|
/*edit exception*/
|
|
button#exception {
|
|
background-image: url('../../../api/templates/default/images/edit.svg') !important;
|
|
/*.border_normal;*/
|
|
/*.box_shadow_standard_light;*/
|
|
/*.rounded (3px);*/
|
|
color: #000000;
|
|
-webkit-appearance: none;
|
|
-webkit-transition-property: background-color;
|
|
-moz-transition-property: background-color;
|
|
-o-transition-property: background-color;
|
|
transition-property: background-color;
|
|
-webkit-transition-duration: 0.5s;
|
|
-moz-transition-duration: 0.5s;
|
|
-o-transition-duration: 0.5s;
|
|
transition-duration: 0.5s;
|
|
-webkit-transition-timing-function: linear;
|
|
-moz-transition-timing-function: linear;
|
|
-o-transition-timing-function: linear;
|
|
transition-timing-function: linear;
|
|
background-color: #E6E6E6;
|
|
padding-left: 30px;
|
|
background-position: 6px center;
|
|
background-repeat: no-repeat;
|
|
background-size: 20px auto;
|
|
/*.Button_size_h32_auto;*/
|
|
height: 24px;
|
|
}
|
|
button#exception img[url*="svg"] {
|
|
background-color: #b4b4b4;
|
|
background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPjxsaW5lYXJHcmFkaWVudCBpZD0iZzc0MyIgZ3JhZGllbnRVbml0cz0idXNlclNwYWNlT25Vc2UiIHgxPSIwJSIgeTE9IjAlIiB4Mj0iMCUiIHkyPSIxMDAlIj48c3RvcCBzdG9wLWNvbG9yPSIjQjRCNEI0IiBvZmZzZXQ9IjAiLz48c3RvcCBzdG9wLWNvbG9yPSIjQjRCNEI0IiBvZmZzZXQ9IjEiLz48L2xpbmVhckdyYWRpZW50PjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZzc0MykiLz48L3N2Zz4=);
|
|
background-image: -moz-linear-gradient(top, #B4B4B4, #B4B4B4);
|
|
background-image: -ms-linear-gradient(top, #B4B4B4, #B4B4B4);
|
|
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#B4B4B4), to(#B4B4B4));
|
|
background-image: -webkit-linear-gradient(top, #B4B4B4, #B4B4B4);
|
|
background-image: -o-linear-gradient(top, #B4B4B4, #B4B4B4);
|
|
background-image: linear-gradient(top, #B4B4B4, #B4B4B4);
|
|
background-repeat: repeat-x;
|
|
fill: red;
|
|
}
|
|
button#exception:hover {
|
|
color: #000000;
|
|
-webkit-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
|
|
-moz-box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
|
|
box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.6);
|
|
}
|
|
button#exception:hover {
|
|
background-image: url('../../../api/templates/default/images/edit.svg') !important;
|
|
background-color: #b3e4a6 !important;
|
|
}
|
|
button#exception:active {
|
|
background-color: #b3e4a6 !important;
|
|
}
|
|
/*calendar series add*/
|
|
#calendar-edit_add {
|
|
padding-left: 24px;
|
|
background-size: 16px;
|
|
background-position: center;
|
|
}
|
|
#calendar-edit_add:active {
|
|
background-color: #b3e4a6 !important;
|
|
}
|
|
/*calendar search freetime*/
|
|
#calendar-edit_freetime:active {
|
|
background-color: #b3e4a6 !important;
|
|
}
|
|
/*calendar search freetime*/
|
|
button[id*="edit_button[add_alarm]"]:active {
|
|
background-color: #b3e4a6 !important;
|
|
}
|
|
/*SIDEMENU */
|
|
/*extended for calender app*/
|
|
/*distance between picture and select*/
|
|
select#calendar_view {
|
|
margin-top: 8px;
|
|
}
|
|
/*searchfield*/
|
|
input#calendar_keywords {
|
|
margin: 10px 0 10px 2px;
|
|
font-size: 1.3em;
|
|
}
|
|
div#calendar-container {
|
|
margin-left: 0px;
|
|
/*distance to cal widget*/
|
|
/*margin-top: 10px;*/
|
|
}
|
|
div#calendar-container select,
|
|
div#calendar-container input,
|
|
div#calendar-container option {
|
|
font-size: 11px;
|
|
}
|
|
div#calendar-container div.calendar {
|
|
background-color: inherit;
|
|
padding: 0px;
|
|
}
|
|
div#calendar-container div.calendar table {
|
|
background-color: #fafafa;
|
|
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
|
|
}
|
|
div#calendar-container div.calendar table thead .button {
|
|
background-color: #FFDD73;
|
|
}
|
|
div#calendar-container div.calendar table thead .title {
|
|
border: none;
|
|
box-shadow: none;
|
|
-webkit-box-shadow: none;
|
|
background-color: #FFDD73;
|
|
}
|
|
div#calendar-container div.calendar table thead .headrow {
|
|
color: #1E1E1E;
|
|
}
|
|
div#calendar-container div.calendar table thead .headrow td {
|
|
background-color: #ffc200;
|
|
}
|
|
div#calendar-container div.calendar table thead .daynames {
|
|
background-color: #679FD2;
|
|
}
|
|
div#calendar-container div.calendar table tbody tr.daysrow:hover {
|
|
background-color: #ffc200;
|
|
}
|
|
div#calendar-container div.calendar table tbody tr.rowhilite td {
|
|
background-color: #ffc200;
|
|
}
|
|
#calendar_cat_id,
|
|
#calendar_filter,
|
|
#uical_select_owner,
|
|
#calendar_merge {
|
|
font-size: 11px;
|
|
}
|
|
#uical_select_owner {
|
|
margin: 9px 0 9px;
|
|
}
|
|
#calendar_merge {
|
|
margin: 9px 0 0 0;
|
|
}
|
|
#calendar-view_view.hideDayColHeader tr:first-of-type .calendar_calGridHeader .calendar_calDayColHeader_spacer {
|
|
height: calc(1.5em + 32px);
|
|
}
|
|
#calendar-view_view.hideDayColHeader tr .calendar_calGridHeader > span.et2_label {
|
|
width: calc(100% - 58px);
|
|
}
|
|
#calendar-toolbar_toolbar et2-switch .label.on span.off {
|
|
filter: invert(1);
|
|
}
|
|
#calendar-toolbar_toolbar et2-switch .label.on span.on {
|
|
filter: none !important;
|
|
}
|
|
#calendar-toolbar_toolbar et2-switch .label span.on {
|
|
background-size: 18px 18px;
|
|
background-repeat: no-repeat;
|
|
background-position: center;
|
|
height: 28px;
|
|
top: 0;
|
|
filter: invert(1);
|
|
}
|
|
#calendar-toolbar_toolbar et2-switch .label span.off {
|
|
background-size: 18px 18px;
|
|
background-repeat: no-repeat;
|
|
background-position: center;
|
|
height: 28px;
|
|
top: 0;
|
|
}
|
|
#calendar-toolbar_toolbar et2-switch .label span {
|
|
color: transparent !important;
|
|
}
|
|
#calendar-toolbar_toolbar et2-switch .label a {
|
|
background: none;
|
|
}
|
|
#calendar-toolbar_toolbar #calendar-toolbar_toolbar-weekend .label span.on {
|
|
background-image: url(../../../api/templates/default/images/7_day_view.svg);
|
|
width: 50%;
|
|
}
|
|
#calendar-toolbar_toolbar #calendar-toolbar_toolbar-weekend .label span.off {
|
|
background-image: url(../../../api/templates/default/images/5_day_view.svg);
|
|
width: 50%;
|
|
}
|
|
/* ########################################################################################
|
|
/* * Calendar END */
|
|
/* tablets and smartphones */
|
|
@media all {
|
|
#calendar-toolbar {
|
|
height: 50px;
|
|
width: 100%;
|
|
background: #0c5da5;
|
|
z-index: 1;
|
|
}
|
|
#calendar-toolbar #toolbar-actionlist {
|
|
margin-left: 60px;
|
|
margin-top: 14px;
|
|
}
|
|
#calendar-edit #calendar-edit_calendar-edit-details {
|
|
float: none;
|
|
display: initial;
|
|
}
|
|
span[id^="calendar-list_"][id$="title]"] {
|
|
font-size: 12pt;
|
|
white-space: nowrap;
|
|
}
|
|
div.calDescRow {
|
|
height: 30px;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
overflow: hidden;
|
|
}
|
|
label[id^="calendar-list_"][id$="start]"] > time,
|
|
label[id^="calendar-list_"][id$="end]"] > time {
|
|
float: none;
|
|
color: #828282;
|
|
}
|
|
.calDates .dash {
|
|
text-align: center;
|
|
padding: 0px 5px 0 5px !important;
|
|
}
|
|
#calendar-list {
|
|
margin-right: 0px;
|
|
}
|
|
#calendar-list button.plus_button {
|
|
bottom: 85px ;
|
|
}
|
|
#calendar-edit_category {
|
|
max-width: 100%;
|
|
}
|
|
#calendar-edit #calendar-edit_whole_day {
|
|
margin: 0;
|
|
}
|
|
.quantity {
|
|
margin-left: 5px;
|
|
}
|
|
#popupMainDiv .et2_date.calendar_alarm_date_display {
|
|
padding-left: 3px;
|
|
}
|
|
#calendar-toolbar {
|
|
background-color: #CC0033;
|
|
}
|
|
#calendar-view button.plus_button {
|
|
bottom: 15px;
|
|
}
|
|
#calendar-toolbar button#toolbar-today {
|
|
font-weight: bold;
|
|
font-size: 12pt;
|
|
text-align: center;
|
|
vertical-align: bottom;
|
|
}
|
|
#calendar-toolbar_toolbar .et2_toolbar_more {
|
|
width: 30px;
|
|
}
|
|
#calendar-toolbar .egw_fw_ui_app_header_container {
|
|
background: white;
|
|
width: 100%;
|
|
display: block;
|
|
margin-top: 44px;
|
|
font-size: 10pt;
|
|
}
|
|
#calendar-toolbar .egw_fw_ui_app_header_container span {
|
|
display: block;
|
|
width: 100%;
|
|
text-align: center;
|
|
font-size: 10pt;
|
|
}
|
|
#calendar-edit button#calendar-edit_freetime {
|
|
margin-left: 0;
|
|
white-space: nowrap;
|
|
text-overflow: ellipsis;
|
|
overflow: hidden;
|
|
padding-right: 0;
|
|
height: 45px;
|
|
vertical-align: top;
|
|
width: 100%;
|
|
}
|
|
#calendar-toolbar_app_header {
|
|
height: 17px;
|
|
left: 0;
|
|
}
|
|
#calendar-toolbar .egw_fw_ui_app_header_container {
|
|
min-height: 20px;
|
|
}
|
|
#calendar-toolbar .et2_searchbox input {
|
|
height: 42px;
|
|
}
|
|
#calendar-toolbar .nm-mob-header {
|
|
width: 100%;
|
|
position: absolute;
|
|
z-index: 100;
|
|
}
|
|
#calendar-toolbar .nm-mob-header .ui-toolbar-menulist button {
|
|
color: black;
|
|
}
|
|
#calendar-toolbar .nm-mob-header .et2_searchbox {
|
|
display: inline-block;
|
|
width: 50px;
|
|
}
|
|
#calendar-toolbar .nm-mob-header #calendar-toolbar_toolbar {
|
|
width: calc(100% - 100px);
|
|
display: inline-block;
|
|
padding: 0px !important;
|
|
}
|
|
#calendar-toolbar .nm-mob-header #calendar-toolbar_toolbar #toolbar-actionlist {
|
|
margin-left: 0px;
|
|
}
|
|
span#calendar-view_header_dateIndicator {
|
|
display: block;
|
|
text-align: center;
|
|
padding: 4px;
|
|
font-size: 10pt;
|
|
color: #707070;
|
|
}
|
|
}
|