mirror of
https://github.com/EGroupware/egroupware.git
synced 2024-11-07 16:44:20 +01:00
Calendar: remove most sidebox date customisations
Now using regular calendar header. "Go" button and custom header styles removed. Changing the date in sidebox calendar immediately updates state.
This commit is contained in:
parent
4c00b812ee
commit
662ea62790
@ -355,6 +355,7 @@ export class Et2Date extends Et2InputWidget(FormControlMixin(ValidateMixin(LitFl
|
||||
{
|
||||
super.connectedCallback();
|
||||
this._updateValueOnChange = this._updateValueOnChange.bind(this);
|
||||
this._handleShortcutButtonClick = this._handleShortcutButtonClick.bind(this);
|
||||
}
|
||||
|
||||
disconnectedCallback()
|
||||
@ -419,10 +420,7 @@ export class Et2Date extends Et2InputWidget(FormControlMixin(ValidateMixin(LitFl
|
||||
// @ts-ignore TypeScript can't find ShortcutButtonsPlugin, but rollup does
|
||||
ShortcutButtonsPlugin({
|
||||
button: [{label: this.egw().lang("Today")}],
|
||||
onClick: (button_index, fp) =>
|
||||
{
|
||||
fp.setDate(new Date());
|
||||
}
|
||||
onClick: this._handleShortcutButtonClick
|
||||
})
|
||||
];
|
||||
|
||||
@ -432,6 +430,17 @@ export class Et2Date extends Et2InputWidget(FormControlMixin(ValidateMixin(LitFl
|
||||
return options;
|
||||
}
|
||||
|
||||
/**
|
||||
* Handle click on shortcut button(s) like "Today"
|
||||
*
|
||||
* @param button_index
|
||||
* @param fp Flatpickr instance
|
||||
*/
|
||||
public _handleShortcutButtonClick(button_index, fp)
|
||||
{
|
||||
fp.setDate(new Date());
|
||||
}
|
||||
|
||||
/**
|
||||
* Set localize options & translations
|
||||
* @param options
|
||||
|
@ -352,13 +352,6 @@ class calendar_hooks
|
||||
'admin' => False,
|
||||
'default' => ['weekN', 'month'],
|
||||
),
|
||||
'auto_update_on_sidebox_change' => array(
|
||||
'type' => 'check',
|
||||
'label' => 'Update calendar view immediately when navigation calendar in sidebox is changed',
|
||||
'name' => 'auto_update_on_sidebox_change',
|
||||
'help' => 'When changing the month',
|
||||
'default'=> false
|
||||
),
|
||||
'2.section' => array(
|
||||
'type' => 'section',
|
||||
'title' => lang('appointment settings'),
|
||||
|
@ -43,7 +43,7 @@ export class SidemenuDate extends Et2Date
|
||||
this._handleChange = this._handleChange.bind(this);
|
||||
this._handleDayHover = this._handleDayHover.bind(this);
|
||||
this._clearHover = this._clearHover.bind(this);
|
||||
this._updateGoButton = this._updateGoButton.bind(this);
|
||||
this._handleHeaderChange = this._handleHeaderChange.bind(this);
|
||||
}
|
||||
|
||||
async connectedCallback()
|
||||
@ -83,23 +83,6 @@ export class SidemenuDate extends Et2Date
|
||||
this._instance.weekNumbers.addEventListener("mouseover", this._handleDayHover);
|
||||
this._instance.weekNumbers.addEventListener("mouseout", this._clearHover);
|
||||
}
|
||||
|
||||
// Customise next / prev buttons
|
||||
this.querySelector('.flatpickr-next-month').classList.add("et2_button", "et2_button_text");
|
||||
this.egw().tooltipBind(this.querySelector('.flatpickr-next-month'), this.egw().lang("next"));
|
||||
this.querySelector('.flatpickr-prev-month').classList.add("et2_button", "et2_button_text");
|
||||
this.egw().tooltipBind(this.querySelector('.flatpickr-prev-month'), this.egw().lang("prev"));
|
||||
|
||||
// Move buttons into header
|
||||
if(this._goButton && this._headerNode)
|
||||
{
|
||||
this._headerNode.append(this._goButton);
|
||||
}
|
||||
if(this._todayButton && this._headerNode)
|
||||
{
|
||||
this._headerNode.append(this._todayButton);
|
||||
}
|
||||
this._updateGoButton();
|
||||
}
|
||||
|
||||
/**
|
||||
@ -114,13 +97,9 @@ export class SidemenuDate extends Et2Date
|
||||
|
||||
options.inline = true;
|
||||
options.dateFormat = "Y-m-dT00:00:00\\Z";
|
||||
options.shorthandCurrentMonth = true;
|
||||
|
||||
options.onMonthChange = this._updateGoButton;
|
||||
options.onYearChange = this._updateGoButton;
|
||||
|
||||
options.nextArrow = "";
|
||||
options.prevArrow = "";
|
||||
options.onMonthChange = this._handleHeaderChange;
|
||||
options.onYearChange = this._handleHeaderChange;
|
||||
|
||||
return options
|
||||
}
|
||||
@ -154,7 +133,41 @@ export class SidemenuDate extends Et2Date
|
||||
_ev.stopPropagation();
|
||||
return false;
|
||||
}
|
||||
this._oldChange(_ev);
|
||||
let view_change = app.calendar.sidebox_changes_views.indexOf(app.calendar.state.view);
|
||||
let update = {date: this.getValue()};
|
||||
|
||||
if(view_change >= 0)
|
||||
{
|
||||
update.view = app.calendar.sidebox_changes_views[view_change ? view_change - 1 : view_change];
|
||||
}
|
||||
else if(app.calendar.state.view == 'listview')
|
||||
{
|
||||
update.filter = 'after';
|
||||
}
|
||||
else if(app.calendar.state.view == 'planner')
|
||||
{
|
||||
update.planner_view = 'day';
|
||||
}
|
||||
app.calendar.update_state(update);
|
||||
|
||||
}
|
||||
|
||||
/**
|
||||
* Handle click on shortcut button(s) like "Today"
|
||||
*
|
||||
* @param button_index
|
||||
* @param fp Flatpickr instance
|
||||
*/
|
||||
public _handleShortcutButtonClick(button_index, fp)
|
||||
{
|
||||
// This just changes the calendar to today
|
||||
super._handleShortcutButtonClick(button_index, fp);
|
||||
|
||||
let temp_date = new Date("" + this._instance.currentYear + "-" + (this._instance.currentMonth + 1) + "-" + (this._instance.selectedDates[0].getDate() || "01"));
|
||||
|
||||
// Go directly
|
||||
let update = {date: temp_date};
|
||||
app.calendar.update_state(update);
|
||||
}
|
||||
|
||||
_handleClick(_ev : MouseEvent) : boolean
|
||||
@ -276,34 +289,19 @@ export class SidemenuDate extends Et2Date
|
||||
return this._instance?.monthNav;
|
||||
}
|
||||
|
||||
get _goButton()
|
||||
{
|
||||
return this.querySelector("et2-button[id*='go']");
|
||||
}
|
||||
|
||||
get _todayButton()
|
||||
{
|
||||
return this.querySelector("et2-button[id*='today']");
|
||||
}
|
||||
|
||||
/**
|
||||
* Update the go button
|
||||
* Year or month changed
|
||||
*
|
||||
* @protected
|
||||
*/
|
||||
protected _updateGoButton()
|
||||
protected _handleHeaderChange()
|
||||
{
|
||||
if(!this._goButton)
|
||||
{
|
||||
return;
|
||||
}
|
||||
let temp_date = new Date("" + this._instance.currentYear + "-" + (this._instance.currentMonth + 1) + "-01");
|
||||
temp_date.setUTCMinutes(temp_date.getUTCMinutes() + temp_date.getTimezoneOffset());
|
||||
|
||||
this._goButton.setAttribute('title', egw.lang(this._instance.formatDate(temp_date, "F")));
|
||||
// Store current _displayed_ date in date button for clicking
|
||||
temp_date.setUTCMinutes(temp_date.getUTCMinutes() - temp_date.getTimezoneOffset());
|
||||
this._goButton.setAttribute('data-date', temp_date.toJSON());
|
||||
// Go directly
|
||||
let update = {date: temp_date};
|
||||
app.calendar.update_state(update);
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -4092,81 +4092,7 @@ export class CalendarApp extends EgwApp
|
||||
*/
|
||||
_setup_sidebox_filters()
|
||||
{
|
||||
// Further date customizations
|
||||
var date_widget = <et2_date>this.sidebox_et2.getWidgetById('date');
|
||||
if(date_widget)
|
||||
{
|
||||
// Dynamic resize of sidebox calendar to fill sidebox
|
||||
var preferred_width = jQuery('#calendar-sidebox_date .ui-datepicker-inline').outerWidth();
|
||||
var go_button_widget = <et2_button><unknown>date_widget.getRoot().getWidgetById('header_go');
|
||||
var auto_update = this.egw.preference('auto_update_on_sidebox_change', 'calendar') === '1';
|
||||
if(auto_update)
|
||||
{
|
||||
go_button_widget.set_disabled(true);
|
||||
}
|
||||
|
||||
/*
|
||||
const datepicker = date_widget.input_date.datepicker("option", {
|
||||
showButtonPanel: false,
|
||||
onChangeMonthYear: function(year, month, inst)
|
||||
{
|
||||
// Update month button label
|
||||
if(go_button_widget)
|
||||
{
|
||||
var temp_date = new Date(year, month-1, 1,0,0,0);
|
||||
//temp_date.setUTCMinutes(temp_date.getUTCMinutes() + temp_date.getTimezoneOffset());
|
||||
go_button_widget.btn.attr('title',egw.lang(date('F',temp_date)));
|
||||
|
||||
// Store current _displayed_ date in date button for clicking
|
||||
temp_date.setUTCMinutes(temp_date.getUTCMinutes() - temp_date.getTimezoneOffset());
|
||||
go_button_widget.btn.attr('data-date', temp_date.toJSON());
|
||||
}
|
||||
if(auto_update)
|
||||
{
|
||||
go_button_widget.click();
|
||||
}
|
||||
window.setTimeout(calendar_resize,0);
|
||||
},
|
||||
// Mark holidays
|
||||
beforeShowDay: function (date)
|
||||
{
|
||||
var day_holidays = holidays['' + date.getFullYear() +
|
||||
sprintf("%02d", date.getMonth() + 1) +
|
||||
sprintf("%02d", date.getDate())];
|
||||
var css_class = '';
|
||||
var tooltip = '';
|
||||
if (typeof day_holidays !== 'undefined' && day_holidays.length)
|
||||
{
|
||||
for (var i = 0; i < day_holidays.length; i++)
|
||||
{
|
||||
if (typeof day_holidays[i]['birthyear'] !== 'undefined')
|
||||
{
|
||||
css_class += 'calendar_calBirthday ';
|
||||
}
|
||||
else
|
||||
{
|
||||
css_class += 'calendar_calHoliday ';
|
||||
}
|
||||
tooltip += day_holidays[i]['name'] + "\n";
|
||||
}
|
||||
}
|
||||
return [true, css_class, tooltip];
|
||||
}
|
||||
});
|
||||
|
||||
|
||||
*/
|
||||
|
||||
|
||||
}
|
||||
|
||||
// Avoid wrapping owner icons if user has group + search
|
||||
var button = jQuery('#calendar-sidebox_owner ~ span.et2_clickable');
|
||||
if(button.length == 1)
|
||||
{
|
||||
button.parent().css('margin-right',button.outerWidth(true)+2);
|
||||
button.parent().parent().css('white-space','nowrap');
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
|
@ -80,106 +80,12 @@
|
||||
box-shadow: none;
|
||||
}
|
||||
|
||||
#calendar-sidebox_header_go,
|
||||
#calendar-sidebox_header_today {
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
top: 5px;
|
||||
z-index: 1;
|
||||
overflow: hidden;
|
||||
font-size: 10px;
|
||||
line-height: 50%;
|
||||
color: white;
|
||||
background-color: #217bc0;
|
||||
background-image: none;
|
||||
background-position-y: -1px;
|
||||
border:none;
|
||||
border-radius: 100%;
|
||||
}
|
||||
#calendar-sidebox_header_go {
|
||||
margin-right: 10px
|
||||
}
|
||||
#calendar-sidebox_header_today {
|
||||
order: 2;
|
||||
}
|
||||
#calendar-sidebox_header_go:hover, #calendar-sidebox_header_today:hover {
|
||||
background-color: var(--row-hover);
|
||||
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 .flatpickr-next-month,
|
||||
#calendar-sidebox_date .flatpickr-prev-month {
|
||||
background-size: contain;
|
||||
background-color: initial;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
border: none;
|
||||
}
|
||||
#calendar-sidebox_date .flatpickr-prev-month {
|
||||
order: 1;
|
||||
background-image: url(../default/images/previous.svg);
|
||||
margin-right: 0px;
|
||||
}
|
||||
#calendar-sidebox_date .flatpickr-next-month {
|
||||
order: 3;
|
||||
background-image: url(../default/images/next.svg);
|
||||
}
|
||||
#calendar-sidebox_date div.flatpickr-calendar.inline {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
@ -14,20 +14,7 @@ Egroupware
|
||||
<overlay>
|
||||
<template id="calendar.sidebox">
|
||||
<vbox parent_node="calendar-et2_target">
|
||||
<calendar-date id="date" onchange="var view_change = app.calendar.sidebox_changes_views.indexOf(app.calendar.state.view);
|
||||
var update = {date:widget.getValue()};
|
||||
if(view_change >= 0) {update.view = app.calendar.sidebox_changes_views[view_change ? view_change - 1 : view_change];} else if (app.calendar.state.view == 'listview') {update.filter = 'after';} else if (app.calendar.state.view =='planner') { update.planner_view = 'day'; } app.calendar.update_state(update);">
|
||||
<et2-button id="header_today" label="•" statustext="Today" icon="nope" onclick="
|
||||
var tempDate = new Date();
|
||||
var today = new Date(tempDate.getFullYear(), tempDate.getMonth(), tempDate.getDate(),0,-tempDate.getTimezoneOffset(),0);
|
||||
var change = {date: today.toJSON()};
|
||||
app.calendar.update_state(change);
|
||||
widget.getRoot().getWidgetById('date').set_value(today);
|
||||
return false;"/>
|
||||
<et2-button id="header_go" label="↵" icon="nope"
|
||||
onclick="var change = {date: widget.getAttribute('data-date')}; if ( app.calendar.state.view == 'listview') {change.filter='month';} else if (app.calendar.state.view == 'planner') {} else {change.view = 'month';}app.calendar.update_state(change);"/>
|
||||
|
||||
</calendar-date>
|
||||
<calendar-date id="date"></calendar-date>
|
||||
<textbox type="hidden" id="first"/>
|
||||
<textbox type="hidden" id="last"/>
|
||||
<hrule/>
|
||||
|
@ -100,33 +100,6 @@
|
||||
border: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
#calendar-sidebox_header_go,
|
||||
#calendar-sidebox_header_today {
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
top: 5px;
|
||||
z-index: 1;
|
||||
overflow: hidden;
|
||||
font-size: 10px;
|
||||
line-height: 50%;
|
||||
color: white;
|
||||
background-color: #217bc0;
|
||||
background-image: none;
|
||||
background-position-y: -1px;
|
||||
border: none;
|
||||
border-radius: 100%;
|
||||
}
|
||||
#calendar-sidebox_header_go {
|
||||
margin-right: 10px;
|
||||
}
|
||||
#calendar-sidebox_header_today {
|
||||
order: 2;
|
||||
}
|
||||
#calendar-sidebox_header_go:hover,
|
||||
#calendar-sidebox_header_today:hover {
|
||||
background-color: var(--row-hover);
|
||||
box-shadow: none;
|
||||
}
|
||||
#calendar-sidebox_weekend {
|
||||
/* Special css styling goes here */
|
||||
}
|
||||
@ -179,23 +152,6 @@
|
||||
padding: 0;
|
||||
flex: 1 1 auto;
|
||||
}
|
||||
#calendar-sidebox_date .flatpickr-next-month,
|
||||
#calendar-sidebox_date .flatpickr-prev-month {
|
||||
background-size: contain;
|
||||
background-color: initial;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
border: none;
|
||||
}
|
||||
#calendar-sidebox_date .flatpickr-prev-month {
|
||||
order: 1;
|
||||
background-image: url(../default/images/previous.svg);
|
||||
margin-right: 0px;
|
||||
}
|
||||
#calendar-sidebox_date .flatpickr-next-month {
|
||||
order: 3;
|
||||
background-image: url(../default/images/next.svg);
|
||||
}
|
||||
#calendar-sidebox_date div.flatpickr-calendar.inline {
|
||||
width: 100% !important;
|
||||
}
|
||||
@ -242,9 +198,6 @@ div.calendar_conflicts {
|
||||
min-height: 26px;
|
||||
justify-content: flex-end;
|
||||
}
|
||||
#calendar-toolbar #calendar-toolbar_keywords {
|
||||
margin-right: 4px;
|
||||
}
|
||||
#calendar-toolbar .et2_searchbox input {
|
||||
height: 14px;
|
||||
}
|
||||
@ -270,13 +223,16 @@ div.calendar_conflicts {
|
||||
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% - 75px);
|
||||
height: calc(100% - 92px);
|
||||
}
|
||||
#calendar-view {
|
||||
width: 100%;
|
||||
@ -1467,15 +1423,6 @@ Hide subsequent headers in week view with non-consolidated owners
|
||||
.calendar_freetime_timeframe {
|
||||
position: relative;
|
||||
}
|
||||
.calendar_freetime_dow {
|
||||
position: absolute;
|
||||
width: 30ex;
|
||||
height: 22em;
|
||||
}
|
||||
.calendar_freetime_dow ul.ui-multiselect-checkboxes {
|
||||
overflow-y: visible;
|
||||
height: 20em;
|
||||
}
|
||||
img.calendar_print_button,
|
||||
img.calendar_print_appicon {
|
||||
height: 24px;
|
||||
@ -1524,11 +1471,15 @@ img.calendar_print_appicon {
|
||||
}
|
||||
/*weekend slideSwitch in toolbar*/
|
||||
#calendar-toolbar_app_header {
|
||||
color: #616161;
|
||||
color: #000;
|
||||
font-size: 14px;
|
||||
height: 16px;
|
||||
position: absolute;
|
||||
left: 44%;
|
||||
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 {
|
||||
@ -1538,7 +1489,7 @@ img.calendar_print_appicon {
|
||||
#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: 16px;
|
||||
background-size: 20px;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
filter: grayscale(1) contrast(0.9999) opacity(0.7);
|
||||
@ -2749,79 +2700,6 @@ div#calendar-container div.calendar table tbody tr.daysrow:hover {
|
||||
div#calendar-container div.calendar table tbody tr.rowhilite td {
|
||||
background-color: #ffc200;
|
||||
}
|
||||
/* Sidebox calendar */
|
||||
#calendar-sidebox_date .ui-widget-header {
|
||||
background-color: transparent;
|
||||
}
|
||||
#calendar-sidebox_date .ui-widget-content,
|
||||
#calendar-sidebox_date .ui-state-default,
|
||||
#calendar-sidebox_date #calendar-sidebox_date .ui-state-hover {
|
||||
border: none;
|
||||
padding: 2px;
|
||||
text-align: center;
|
||||
}
|
||||
#calendar-sidebox_date .ui-datepicker td {
|
||||
padding: 0px;
|
||||
}
|
||||
#calendar-sidebox_date .ui-datepicker-header .ui-state-hover {
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
top: 2px;
|
||||
box-shadow: none;
|
||||
}
|
||||
#calendar-sidebox_date .ui-datepicker-today {
|
||||
background-color: #FFDD73;
|
||||
}
|
||||
#calendar-sidebox_date .ui-datepicker-calendar .ui-state-hover {
|
||||
background-color: rgba(153, 204, 255, 0.4);
|
||||
}
|
||||
#calendar-sidebox_date .ui-datepicker-header .ui-datepicker-next.ui-state-hover {
|
||||
right: 2px;
|
||||
}
|
||||
#calendar-sidebox_date .ui-datepicker-year {
|
||||
padding-right: 0px !important;
|
||||
min-width: 65px;
|
||||
}
|
||||
#calendar-sidebox_date .ui-datepicker-month {
|
||||
min-width: 60px;
|
||||
padding-right: 0px !important;
|
||||
}
|
||||
#calendar-sidebox_date .ui-datepicker-header a span {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
#calendar-sidebox_date .ui-datepicker-header a.ui-state-hover {
|
||||
top: 3px;
|
||||
}
|
||||
#calendar-sidebox_date .ui-datepicker-header a.ui-state-hover span {
|
||||
transition: none;
|
||||
}
|
||||
#calendar-sidebox_header_go {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
background-image: url('../../../api/templates/default/images/check.svg');
|
||||
text-indent: 140%;
|
||||
border: none;
|
||||
border-radius: 0px;
|
||||
background-size: contain;
|
||||
background-color: transparent;
|
||||
}
|
||||
#calendar-sidebox_header_go:hover {
|
||||
background-color: transparent;
|
||||
}
|
||||
#calendar-sidebox_header_today {
|
||||
width: 2em;
|
||||
height: 2em;
|
||||
background-image: url('../../../api/templates/default/images/bullet.svg');
|
||||
text-indent: 140%;
|
||||
border: none;
|
||||
border-radius: 0px;
|
||||
background-size: contain;
|
||||
background-color: transparent;
|
||||
}
|
||||
#calendar-sidebox_header_today:hover {
|
||||
background-color: transparent;
|
||||
}
|
||||
#calendar_cat_id,
|
||||
#calendar_filter,
|
||||
#uical_select_owner,
|
||||
@ -3006,4 +2884,3 @@ div#calendar-container div.calendar table tbody tr.rowhilite td {
|
||||
color: #707070;
|
||||
}
|
||||
}
|
||||
/*# sourceMappingURL=app.css.map */
|
@ -88,33 +88,6 @@
|
||||
border: none;
|
||||
box-shadow: none;
|
||||
}
|
||||
#calendar-sidebox_header_go,
|
||||
#calendar-sidebox_header_today {
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
top: 5px;
|
||||
z-index: 1;
|
||||
overflow: hidden;
|
||||
font-size: 10px;
|
||||
line-height: 50%;
|
||||
color: white;
|
||||
background-color: #217bc0;
|
||||
background-image: none;
|
||||
background-position-y: -1px;
|
||||
border: none;
|
||||
border-radius: 100%;
|
||||
}
|
||||
#calendar-sidebox_header_go {
|
||||
margin-right: 10px;
|
||||
}
|
||||
#calendar-sidebox_header_today {
|
||||
order: 2;
|
||||
}
|
||||
#calendar-sidebox_header_go:hover,
|
||||
#calendar-sidebox_header_today:hover {
|
||||
background-color: var(--row-hover);
|
||||
box-shadow: none;
|
||||
}
|
||||
#calendar-sidebox_weekend {
|
||||
/* Special css styling goes here */
|
||||
}
|
||||
@ -167,23 +140,6 @@
|
||||
padding: 0;
|
||||
flex: 1 1 auto;
|
||||
}
|
||||
#calendar-sidebox_date .flatpickr-next-month,
|
||||
#calendar-sidebox_date .flatpickr-prev-month {
|
||||
background-size: contain;
|
||||
background-color: initial;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
border: none;
|
||||
}
|
||||
#calendar-sidebox_date .flatpickr-prev-month {
|
||||
order: 1;
|
||||
background-image: url(../default/images/previous.svg);
|
||||
margin-right: 0px;
|
||||
}
|
||||
#calendar-sidebox_date .flatpickr-next-month {
|
||||
order: 3;
|
||||
background-image: url(../default/images/next.svg);
|
||||
}
|
||||
#calendar-sidebox_date div.flatpickr-calendar.inline {
|
||||
width: 100% !important;
|
||||
}
|
||||
@ -2732,79 +2688,6 @@ div#calendar-container div.calendar table tbody tr.daysrow:hover {
|
||||
div#calendar-container div.calendar table tbody tr.rowhilite td {
|
||||
background-color: #ffc200;
|
||||
}
|
||||
/* Sidebox calendar */
|
||||
#calendar-sidebox_date .ui-widget-header {
|
||||
background-color: transparent;
|
||||
}
|
||||
#calendar-sidebox_date .ui-widget-content,
|
||||
#calendar-sidebox_date .ui-state-default,
|
||||
#calendar-sidebox_date #calendar-sidebox_date .ui-state-hover {
|
||||
border: none;
|
||||
padding: 2px;
|
||||
text-align: center;
|
||||
}
|
||||
#calendar-sidebox_date .ui-datepicker td {
|
||||
padding: 0px;
|
||||
}
|
||||
#calendar-sidebox_date .ui-datepicker-header .ui-state-hover {
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
top: 2px;
|
||||
box-shadow: none;
|
||||
}
|
||||
#calendar-sidebox_date .ui-datepicker-today {
|
||||
background-color: #FFDD73;
|
||||
}
|
||||
#calendar-sidebox_date .ui-datepicker-calendar .ui-state-hover {
|
||||
background-color: rgba(153, 204, 255, 0.4);
|
||||
}
|
||||
#calendar-sidebox_date .ui-datepicker-header .ui-datepicker-next.ui-state-hover {
|
||||
right: 2px;
|
||||
}
|
||||
#calendar-sidebox_date .ui-datepicker-year {
|
||||
padding-right: 0px !important;
|
||||
min-width: 65px;
|
||||
}
|
||||
#calendar-sidebox_date .ui-datepicker-month {
|
||||
min-width: 60px;
|
||||
padding-right: 0px !important;
|
||||
}
|
||||
#calendar-sidebox_date .ui-datepicker-header a span {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
#calendar-sidebox_date .ui-datepicker-header a.ui-state-hover {
|
||||
top: 3px;
|
||||
}
|
||||
#calendar-sidebox_date .ui-datepicker-header a.ui-state-hover span {
|
||||
transition: none;
|
||||
}
|
||||
#calendar-sidebox_header_go {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
background-image: url('../../../api/templates/default/images/check.svg');
|
||||
text-indent: 140%;
|
||||
border: none;
|
||||
border-radius: 0px;
|
||||
background-size: contain;
|
||||
background-color: transparent;
|
||||
}
|
||||
#calendar-sidebox_header_go:hover {
|
||||
background-color: transparent;
|
||||
}
|
||||
#calendar-sidebox_header_today {
|
||||
width: 2em;
|
||||
height: 2em;
|
||||
background-image: url('../../../api/templates/default/images/bullet.svg');
|
||||
text-indent: 140%;
|
||||
border: none;
|
||||
border-radius: 0px;
|
||||
background-size: contain;
|
||||
background-color: transparent;
|
||||
}
|
||||
#calendar-sidebox_header_today:hover {
|
||||
background-color: transparent;
|
||||
}
|
||||
#calendar_cat_id,
|
||||
#calendar_filter,
|
||||
#uical_select_owner,
|
||||
|
@ -1110,82 +1110,6 @@ div#calendar-container {
|
||||
|
||||
}
|
||||
|
||||
/* Sidebox calendar */
|
||||
#calendar-sidebox_date {
|
||||
|
||||
.ui-widget-header {
|
||||
background-color: transparent;
|
||||
}
|
||||
.ui-widget-content, .ui-state-default, #calendar-sidebox_date .ui-state-hover {
|
||||
border: none;
|
||||
padding: 2px;
|
||||
text-align: center;
|
||||
}
|
||||
.ui-datepicker td {
|
||||
padding: 0px
|
||||
}
|
||||
.ui-datepicker-header .ui-state-hover {
|
||||
background-color: transparent;
|
||||
border: none;
|
||||
top: 2px;
|
||||
box-shadow: none;
|
||||
}
|
||||
.ui-datepicker-today {
|
||||
background-color: @egw_color_1_e;
|
||||
}
|
||||
.ui-datepicker-calendar .ui-state-hover {
|
||||
background-color: @color_hover_row;
|
||||
}
|
||||
.ui-datepicker-header .ui-datepicker-next.ui-state-hover {
|
||||
right: 2px;
|
||||
}
|
||||
.ui-datepicker-year {
|
||||
padding-right: 0px !important;
|
||||
min-width: 65px;
|
||||
}
|
||||
.ui-datepicker-month {
|
||||
min-width: 60px;
|
||||
padding-right: 0px !important;
|
||||
}
|
||||
.ui-datepicker-header a span {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
}
|
||||
.ui-datepicker-header a.ui-state-hover {
|
||||
top: 3px;
|
||||
span {
|
||||
transition: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
#calendar-sidebox_header_go {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
|
||||
background-image: url('../../../api/templates/default/images/check.svg');
|
||||
text-indent: 140%;
|
||||
border: none;
|
||||
border-radius: 0px;
|
||||
background-size: contain;
|
||||
background-color: transparent;
|
||||
&:hover {
|
||||
background-color: transparent;
|
||||
}
|
||||
}
|
||||
#calendar-sidebox_header_today {
|
||||
width: 2em;
|
||||
height: 2em;
|
||||
background-image: url('../../../api/templates/default/images/bullet.svg');
|
||||
text-indent: 140%;
|
||||
border: none;
|
||||
border-radius: 0px;
|
||||
background-size: contain;
|
||||
background-color: transparent;
|
||||
&:hover {
|
||||
background-color: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
// Select Fields in Sidemenu
|
||||
#calendar_cat_id,
|
||||
#calendar_filter,
|
||||
|
Loading…
Reference in New Issue
Block a user