.schedule-edit-selection { position: absolute; width: 100%; background-color: rgba(172, 189, 215, 0.2); outline: 1px solid #acbdd7; z-index: 2; text-align: left; padding-left: 5px; } .schedule-edit-selection label { overflow: hidden; text-overflow: ellipsis; color: #779bce; font-size: 1.1em; } .scheduler-area, .title-area, .grid-area, .multi-day-item-area, .time-column-area, .day-column, .holiday-column, .holiday-title, .today-title, .timezone-title, .main-timezone-title, .day-title, .time-column, .main-time-column, .single-main-timezone-title, .hour-row, .minute-row, .hour-cell, .minute-cell, .minute-cell-content { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .day-title .schedule-edit-day-image, .holiday-title .schedule-edit-day-image, .today-title .schedule-edit-day-image { position: absolute; left: 100%; top: 0; width: 16px; height: 16px; margin: 3px 0 0 -19px; cursor: pointer; background-size: cover; background-position: bottom left; background-image: url(images/dayimagedefault.png); } .day-title .schedule-edit-selected-day-image, .holiday-title .schedule-edit-selected-day-image, .today-title .schedule-edit-selected-day-image { background-position: top left; } .day-title .schedule-edit-day-image-sunday, .holiday-title .schedule-edit-day-image-sunday, .today-title .schedule-edit-day-image-sunday { background-image: url(images/dayimagesunday.png); } .day-title .schedule-edit-day-image-monday, .holiday-title .schedule-edit-day-image-monday, .today-title .schedule-edit-day-image-monday { background-image: url(images/dayimagemonday.png); } .day-title .schedule-edit-day-image-tuesday, .holiday-title .schedule-edit-day-image-tuesday, .today-title .schedule-edit-day-image-tuesday { background-image: url(images/dayimarkertuesday.png); } .day-title .schedule-edit-day-image-wednesday, .holiday-title .schedule-edit-day-image-wednesday, .today-title .schedule-edit-day-image-wednesday { background-image: url(images/daymarkerwednesday.png); } .day-title .schedule-edit-day-image-thursday, .holiday-title .schedule-edit-day-image-thursday, .today-title .schedule-edit-day-image-thursday { background-image: url(images/dayimagethursday.png); } .day-title .schedule-edit-day-image-friday, .holiday-title .schedule-edit-day-image-friday, .today-title .schedule-edit-day-image-friday { background-image: url(images/dayimagefriday.png); } .day-title .schedule-edit-day-image-saturday, .holiday-title .schedule-edit-day-image-saturday, .today-title .schedule-edit-day-image-saturday { background-image: url(images/dayimagesaturday.png); } .scheduler-area { width: auto; text-align: center; overflow-x: hidden; padding: 0 2.2em 0 0; } .title-area, .grid-area, .multi-day-item-area { height: 32px; position: relative; top: 0; left: 0; bottom: 0; } .title-area, .grid-area { line-height: 2em; } .multi-day-item-area { z-index: 11; text-align: left; } .title-area { border-bottom: 1px solid #e1e0e0; height: 2.1em; } .timezone-title-area, .time-column-area { display: inline-block; float: left; position: absolute; top: 0; left: 0; bottom: 0; z-index: 2; } .day-title-area { height: 100%; } .day-column-area, .day-row-area { border-bottom: 1px solid #e1e0e0; height: 100%; } .day-row-area { position: absolute; top: 0; left: 0; bottom: 0; width: 100%; z-index: 0; } .timezone-title, .main-timezone-title, .day-title, .today-title, .day-column, .holiday-column, .time-column, .main-time-column, .holiday-title, .single-main-timezone-title { float: left; height: 100%; width: 3.5em; position: relative; top: 0; left: 0; bottom: 0; } .timezone-title, .day-title, .holiday-title, .today-title { padding-bottom: 6px; overflow: hidden; background: #ffffff; font-size: 1.2em; } .timezone-title { padding-right: 9px; text-align: left; width: 4em; line-height: 3em; } .main-timezone-title { border-right: 1px solid #e1e0e0; text-align: left; line-height: 3em; } .single-main-timezone-title { text-align: left; line-height: 3em; } .today-title { border-bottom: 2px solid #f49d57; top: 1px; } .holiday-title { color: #999999; } .time-column-area { height: 100%; } .main-time-column { height: 100%; border-right: 1px solid #e1e0e0; } .time-column { height: 100%; border-right: 9px solid #ffffff; width: 4em; } .day-column, .holiday-column { border-right: 1px solid #e1e0e0; } .holiday-column { background: #fafafa; } .grid-area { width: 100%; } .day-grid-area { width: 100%; height: 100%; position: relative; top: 0; left: 0; bottom: 0; } .hour-cell, .minute-cell{ height: 2.2em; text-align: left; border-top: none; width: 3.5em; padding: 1px; line-height: 1em; padding-top: 4px; } .minute-cell { color: #999999; border-top: 1px solid white; width: 1.5em; padding-left: 1.5em; } .hour-cell-content { font-size: 1.2em; } .minute-cell-content {} .hour-row, .minute-row { height: 2.2em; width: 100%; } .hour-row { border-top: 1px #e1e0e0 solid; } .minute-row { border-top: 1px #f1f0f0 solid; } .time-marker { box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; position: absolute; z-index: 15; background: none; width: 100%; left: 0; border-top: 1px solid #f49d57; } .scroll-area { border-top: 1px solid #e1e0e0; min-height: 150px; width: 100%; } .scroll-area::-webkit-scrollbar { /* * Измения ширину, необходимо изменить величину смещения заголовков расписания при появлении скрола * gridAreaEl.dom.style['paddingRight'] = this.isScrollVisible ? (scrollbarSize.width - 12) + 'px' : '0'; */ width: 12px; } .scroll-area::-webkit-scrollbar-thumb { border-width: 1px 1px 1px 0px; border-style: solid; border-color: white; background-color: #e2e2e2; } .timezone-title-area { z-index: 50; background-color: #fff; }