dhtmlx-scheduler/codebase/sources/less/skins/contrast_black/add_styles.less

JavaScript event calendar. Allows to manage events and appointments in different views

.dhx_cal_container,
.dhx_cal_light,
.dhx_cal_quick_info,
.dhtmlXTooltip{
	color:@fontColor;
	font-size:@fontSize;
}

/* recurring */
.dhx_repeat_divider {
	border-left: 1px solid @default-borderColor;
}

.dhx_form_repeat {
	font-size: 13px;
	background: @container-background;
	font-family: @default-font-family;
}

.dhx_custom_button {
	background-color: @container-background;
	border: 1px solid #FFF;
	font-size: @default-font-size;
	color: #fff;
}

.dhx_cal_light{
	input, textarea, select{
		font-size:@default-font-size;
	}

}
.dhx_cal_light_wide .dhx_section_time{
	padding-top:0 !important;
}

/* recurring end */

/* agenda */
.dhx_v_border, .dhx_agenda_line div {
	border-right: 1px solid @default-borderColor;
}

.dhx_cal_container_rtl  .dhx_v_border, .dhx_agenda_line div {
	border-left: 1px solid @default-borderColor;
	border-right: 0;
}

.dhx_agenda_line {
	font-size: @default-font-size;
	height:22px
}

.dhx_agenda_line .dhx_event_icon {
	background: url(imgs_contrast_black/controls.png) no-repeat;
	background-position: 0px 0px;
}

/* agenda end */

/* year */
.dhx_year_month {
	border: 1px solid @default-borderColor;
	font-size: @default-font-size;
	color: #fff;
	font-weight: bold;
}

.dhx_scale_bar_last {
	border-right: 1px solid @default-borderColor;
}

.dhx_year_body {
	border-left: 1px solid @default-borderColor;
}

.dhx_year_week {
	border-bottom: 1px solid @default-borderColor;
}

.dhx_tooltip_line {
	height: 22px;
	line-height: 22px;
	color: #fff;
}

.dhx_tooltip_line .dhx_event_icon {
	background-position: 0 0;
	background-repeat: no-repeat;
	background-image: url(imgs_contrast_black/controls.png);
	height: 20px;
	margin: 0 7px;
}

.dhx_year_tooltip {
	font-size: @default-font-size;
	background-color: @container-background;
}

/* year end */

/* expand */
.dhx_expand_icon {
	top: -3px;
}

/* expand end */

/* units view */
.dhx_cal_header .dhx_cal_next_button, .dhx_cal_header .dhx_cal_prev_button {
	width: 20px;
	height: 20px;
	top: 0px !important;
	border: 0;
}

.dhx_cal_header .dhx_cal_next_button {
	right: 1px !important;
	border-left: 1px solid @default-borderColor;
}

.dhx_scale_bar .dhx_cal_prev_button {
	left: 1px !important;
	border-right: 1px solid @default-borderColor;
}

/* units view end */

/* map view */
.dhx_map_line .headline_date, .dhx_map_line .headline_description {
	border: 0;
}

.dhx_map_line .headline_date {
	border-right: 1px solid @default-borderColor;
}

.dhx_cal_container_rtl .dhx_map_line .headline_date {
	border-left: 1px solid @default-borderColor;
}

/* map view end */

/* tooltip start */
.dhtmlXTooltip.tooltip {
	font-size: @default-font-size;
	color: #FFF;
	background: @container-background;
	border: 1px solid @default-borderColor;
	line-height: 16px;
}

/* tooltip end */

/* week agenda start */

.dhx_wa_day_data {
	background: @container-background;
}

.dhx_wa_scale_bar {
	border-top: 1px solid @default-borderColor;
	border-bottom: 1px solid @default-borderColor;
}

.dhx_wa_column_last .dhx_wa_day_cont {
	border-left: 1px solid @default-borderColor;
}

.dhx_wa_ev_body {
	font-size: @default-font-size;
	border-bottom: 1px solid @lightBorderColor;
}

.dhx_wa_scale_bar {
	font-size: @default-font-size;
	color: #E9E9E9;
	font-weight: bold;
	background-color: @container-background;
}

.dhx_wa_ev_body.dhx_cal_event_selected {
	background-color: #fff3a1;
	color: #362d26;
}

.dhx_grid_area .dhx_grid_event_selected{
	background-color: #fff3a1 !important;
	color: #362d26  !important;
}

.dhx_wa_dnd {
	background-color: #fddb93 !important;
	color: #747473 !important;
	border: 1px solid #ccb177;
}

/* week agenda end */

/* readonly start */
.dhx_text_disabled {
	color: #2E2E2E;
}

.dhx_cal_ltext .dhx_text_disabled {
	line-height: 22px;
}

/* readonly end */

/* grid view start */
.dhx_grid_v_border {
	border-right-color: @default-borderColor;
}

.dhx_cal_container_rtl .dhx_grid_v_border {
	border-left-color: @default-borderColor;
}

.dhx_grid_area {
	background: transparent;
	color: #fff;
}

.dhx_grid_area tr.dhx_grid_event:nth-child(2n) {
	background: #2e2e2e;
}

.dhx_grid_line {
	font-size: @default-font-size;
}


/* grid view end*/

/* left border support */
.dhx_scale_hour_border, .dhx_month_body_border, .dhx_scale_bar_border, .dhx_month_head_border {
	border-left: 1px solid @default-borderColor;
}

.dhx_cal_quick_info {
	background: @container-background;
	border: 1px solid #FFF;
	-webkit-box-shadow: inset 0px 0px 0px 4px @mainColor;
	-moz-box-shadow: inset 0px 0px 0px 4px @mainColor;
	box-shadow: inset 0px 0px 0px 4px @mainColor;
	padding: 4px;
}

.dhx_cal_qi_title {
	padding: 5px 0px 8px 12px;
	color: #fff;
	background-color: @container-background;
	border-bottom: 1px solid @default-borderColor;
}

.dhx_cal_qi_content {
	background: transparent;
	width: auto;
	border: none;
	color: #fff;
}

.dhx_qi_big_icon {
	margin: 8px 9px 8px 6px;
	background: @container-background;
	color: #fff;
	border: 2px solid #fff;
}

/* export to PDF and iCal buttons start */
.dhx_cal_navline .dhx_cal_export {
	width: 32px;
	height: 32px;
	margin: 2px;
	cursor: pointer;
	top: 12px;
}

.dhx_cal_navline .dhx_cal_export.pdf {
	left: auto;
	right: 249px;
	background-image: url('imgs_contrast_black/export_pdf.png');
}

.dhx_cal_navline .dhx_cal_export.ical {
	left: auto;
	right: 210px;
	background-image: url('imgs_contrast_black/export_ical.png');
}

/* export to PDF and iCal buttons end */




// **

.dhx_cal_container {
	font-family: @default-font-family;
	font-size: @default-font-size;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale; 

}

.dhtmlx_popup_button.dhtmlx_cancel_button {
	border: @modal-cancel-button-wrap-border;
	background: @modal-cancel-button-wrap-background;

	& div {
		background-color: inherit;
		color: @modal-cancel-button-color;
	}
}

.dhx_cal_event .dhx_header, .dhx_cal_event.dhx_cal_select_menu .dhx_footer {
	display: none;
}

.dhx_cal_event.dhx_cal_editor {
	border: 1px solid transparent;
}

.dhx_scale_hour {
	font-weight: bold;
	font-size: @scale-hour-font-size;
}

.dhx_scale_holder_now {
	background-color: @scale-column-now-background;
}

.dhx_multi_day_icon_small {
	background-image: none;
}

.dhx_multi_day_icon {
	background-image: none;
}

.dhx_month_head {
	font-weight: @daybox-title-font-weight;
}

.dhx_cal_event .dhx_title {
	text-align: center;
}

.dhx_cal_ltext textarea, .dhx_cal_light select, .dhx_cal_light input, .dhx_cal_light {
	color: @lightbox-font-color;
	background: @lightbox-background;
}

.dhx_cal_ltext textarea {
	font-size: @lightbox-area-rs-font-size;
}

.dhx_save_btn, .dhx_cancel_btn, .dhx_delete_btn, .dhx_btn_set div:first-child {
	display: none;
}

.dhx_btn_set, .dhx_cancel_btn_set {
	border-width: 2px;
}

.dhx_mark {
	display: none;
}

.dhtmlx_modal_box {
	background: @modal-box-background;
	padding: 4px;
}

/* minicalendar */

.dhx_mini_calendar {
	padding: 5px;
}

.dhx_mini_calendar .dhx_year_event, .dhx_mini_calendar .dhx_calendar_click {
	border-radius: 7px;
}

.dhx_mini_calendar .dhx_month_head {
	margin: 2px 1px 2px 2px;
	padding-right: 0;
	text-align: center;
}

.dhx_mini_calendar .dhx_year_month {
	line-height: 20px;
	height: 25px;
	font-size: 16px;
	border: 1px solid @mini-calendar-border-color;
	color: #fff;
	font-weight: bold;
}

.dhx_mini_calendar .dhx_cal_prev_button {
	top: 8px !important;
}

.dhx_mini_calendar .dhx_cal_next_button {
	top: 8px !important;
}

.dhx_year_body .dhx_month_head.dhx_year_event,
.dhx_year_body .dhx_month_head.dhx_calendar_click {
	color: @mini-calendar-font-color;
}

.dhx_cal_container.dhx_mini_calendar {
	box-sizing: border-box;
	border: 1px solid @mini-calendar-border-color;
	box-shadow: none;
	border-radius: 3px;
}

.dhx_mini_calendar .dhx_month_head, .dhx_mini_calendar .dhx_year_month, .dhx_mini_calendar .dhx_month_body,
.dhx_mini_calendar .dhx_scale_bar, .dhx_mini_calendar .dhx_year_body {
	border-color: transparent;
}

.dhx_mini_calendar .dhx_year_body {
	padding-top: 1px;
}

.dhx_mini_calendar .dhx_scale_bar {
	border-width: 0;
}

.dhx_mini_calendar .dhx_year_week {
	border-bottom: 1px solid @mini-calendar-border-color;
	padding-top: 1px;
}

.dhx_mini_calendar .dhx_cal_prev_button, .dhx_mini_calendar .dhx_cal_next_button {
	border: 0;
	height: 20px;
}

.dhx_cal_navline div.dhx_minical_icon {
	left: 210px;
	top: 14px;
	width: 30px;
	height: 30px;
	background: url(./imgs_contrast_black/calendar.gif) no-repeat;
	background-position: 3px 5px;
}


.dhx_matrix_scell, .dhx_matrix_cell {
	border-bottom: 1px solid @default-borderColor;
	border-right: 1px solid @default-borderColor;
}

.dhx_cal_header  {
	background-color: @container-background;
}

.dhx_cal_header div div {
	border-left: 1px solid @default-borderColor;
}

.dhx_matrix_scell.folder {
	border-right: 0;
}

.dhx_second_scale_bar {
	border-bottom: 1px solid @default-borderColor;
}

.dhx_matrix_cell {
	background: transparent;
}

.dhx_cal_tab_standalone {
		border-radius: 5px;
		background-color: @container-background;
		width: auto;
		padding: 0 8px;
}


.dhx_drag_maker {
	background: @scale-time-drag-maker-background;
	border-top:@scale-time-drag-maker-border-top;
	border-bottom: @scale-time-drag-maker-border-bottom;
	opacity: @scale-time-drag-maker-opacity;
}

div.dhx_agenda_line div,
div.dhx_agenda_line span {
	font-weight: @agenda-topline-font-weight;
	color: @agenda-topline-font-color;
	border-color: @agenda-topline-border-left-color;
}

.dhx_cal_event_line {
	height: 19px;
}

.dhx_cal_event_clear {
	padding: 2px 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.dhx_cal_navline, .dhx_cal_header, .dhx_cal_container {
	background-color: @container-background;
}

.panel {
	background: @container-background!important;
}