flectra/addons/web/static/src/less/web_calendar.less

223 lines
6.6 KiB
Plaintext
Raw Normal View History

@nb-calendar-colors: 24;
@keyframes backgroundfade {
2018-01-16 11:34:37 +01:00
from {background-color: fade(@flectra-brand-primary, 50%);}
to {background-color: #f5f5f5;}
}
.o_calendar_container {
height: 100%;
2018-01-16 11:34:37 +01:00
.o-webclient-padding(@top: @flectra-horizontal-padding/2, @bottom: @flectra-horizontal-padding/2);
.o-flex-display();
.calendar_color_loop(@index) when (@index < @nb-calendar-colors+1) {
.o_calendar_color_@{index} {
color: #0D0D0D;
background-color: spin(rgb(255, 192, 192), 360/(@nb-calendar-colors+1) * @index);
border-color: spin(rgb(255, 192, 192), 360/(@nb-calendar-colors+1) * @index);
opacity: 0.7;
&.o_event_hightlight {
font-weight: bold;
opacity: 0.9;
}
&:hover {
color: #666 !important;
}
}
.calendar_color_loop(@index + 1);
}
.calendar_color_loop(1);
.underline_color_loop(@index) when (@index < @nb-calendar-colors+1) {
.o_underline_color_@{index} {
border-bottom: 4px solid spin(rgba(255, 192, 192, 0.7), 360/(@nb-calendar-colors+1) * @index);
}
.underline_color_loop(@index + 1);
}
.underline_color_loop(1);
.o_calendar_view {
.o-flex(1, 1, auto);
min-width: 0;
.o_calendar_widget {
height: 100%;
2018-01-16 11:34:37 +01:00
background-color: @flectra-view-background-color;
* {
z-index: 0; // FIXME
}
.fc-week-number, .fc-widget-header {
2018-01-16 11:34:37 +01:00
background-color: lighten(@flectra-brand-secondary, 30%);
}
.o_avatar_square {
border-radius: 5px;
display: inline-block;
opacity: 1;
border: 1px solid #999;
}
.o_fields img, .o_avatar_square {
vertical-align: middle;
margin-left: 1px;
width: 18px;
height: 18px;
}
.o_field_type_char:first-child {
font-weight: bold;
}
.fc-view {
overflow-x: auto;
> table {
min-width: 600px;
}
}
}
.o_target_date:not(.fc-today) {
2018-01-16 11:34:37 +01:00
background-color: @flectra-brand-primary;
opacity: 0.1;
}
}
.o_calendar_sidebar_container {
2018-01-16 11:34:37 +01:00
.o-flex(0, 0, @flectra-horizontal-padding);
position: relative;
&.o_sidebar_hidden {
2018-01-16 11:34:37 +01:00
margin-right: -@flectra-horizontal-padding; // hack to display the toggler in the gutter
.o_calendar_sidebar_toggler {
padding: 4px;
2018-01-16 11:34:37 +01:00
color: darken(@flectra-webclient-background-color, 30%);
}
}
.o_calendar_sidebar_toggler {
.o-position-absolute(@top: 0, @right: 0);
cursor: pointer;
padding: 6px;
z-index: 1;
&:hover {
color: black;
}
}
.o_calendar_sidebar {
width: 250px;
margin-left: 8px;
2018-01-16 11:34:37 +01:00
background: @flectra-view-background-color;
}
.ui-datepicker {
width: 100%;
font-size: 8pt;
border-radius: 0;
border: none;
padding: 0;
.ui-widget-header {
.o-flex-display();
background: none;
2018-01-16 11:34:37 +01:00
background-color: lighten(@flectra-brand-secondary, 30%);
border-radius: 0;
.ui-datepicker-prev, .ui-datepicker-next {
.o-flex(0, 0, auto);
position: static;
cursor: pointer;
padding: 2px;
text-align: center;
2018-01-16 11:34:37 +01:00
color: @flectra-main-text-color;
&.ui-state-hover {
background: none;
border: none;
color: black;
}
.ui-icon {
display: none;
}
}
.ui-datepicker-prev {
order: 1;
&:after {
font-family: FontAwesome;
content: "";
}
}
.ui-datepicker-next {
order: 3;
&:before {
font-family: FontAwesome;
content: "";
}
}
.ui-datepicker-title {
.o-flex(0, 0, auto);
order: 2;
display: inline-block;
margin: 0 10px;
}
}
table {
td {
padding: 0 2px 2px 0;
2018-01-16 11:34:37 +01:00
background-color: @flectra-view-background-color;
a {
border: none;
background: none;
2018-01-16 11:34:37 +01:00
background-color: lighten(@flectra-brand-secondary, 40%);
text-align: center;
}
}
.ui-state-default {
2018-01-16 11:34:37 +01:00
color: @flectra-brand-primary;
&:hover {
background: none;
2018-01-16 11:34:37 +01:00
background-color: fade(@flectra-brand-primary, 50%);
border-color: @flectra-brand-primary;
color: @flectra-view-background-color;
};
}
.ui-state-active {
background: none;
2018-01-16 11:34:37 +01:00
background-color: @flectra-brand-primary;
color: @flectra-view-background-color;
}
.o_selected_range.o_color {
background: none;
2018-01-16 11:34:37 +01:00
background-color: @flectra-brand-primary;
animation: backgroundfade 3s forwards;
}
}
}
.o_calendar_filter {
padding: 8px;
border-top: 1px solid lightgray;
.o_field_many2one {
width: 100%;
}
}
}
.fc-time-grid-event.fc-short .fc-time:before {
content: '';
}
}
@media only screen and (max-width: 768px) {
.o_calendar_container {
padding: 0;
}
}
.modal {
.o_attendee_head {
width: 32px;
margin-right: 5px;
}
}
.o_dashboard {
.o_calendar_container .o_calendar_sidebar_container {
display: none;
}
}