forked from extern/egroupware
Merge remote-tracking branch 'origin/master'
This commit is contained in:
commit
21d362b5fa
@ -17,6 +17,11 @@ import {dateStyles} from "./DateStyles";
|
|||||||
import {LitFlatpickr} from "lit-flatpickr";
|
import {LitFlatpickr} from "lit-flatpickr";
|
||||||
import "flatpickr/dist/plugins/scrollPlugin.js";
|
import "flatpickr/dist/plugins/scrollPlugin.js";
|
||||||
|
|
||||||
|
import(egw.webserverUrl + "/node_modules/flatpickr/dist/l10n/" + (egw.preference('lang') + ".js")).then(() =>
|
||||||
|
{
|
||||||
|
// @ts-ignore
|
||||||
|
flatpickr.localize(flatpickr.l10ns[egw.preference('lang')]);
|
||||||
|
});
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Parse a date string into a Date object
|
* Parse a date string into a Date object
|
||||||
@ -369,6 +374,8 @@ export class Et2Date extends Et2InputWidget(FormControlMixin(ValidateMixin(LitFl
|
|||||||
options.dateFormat = "Y-m-dT00:00:00\\Z";
|
options.dateFormat = "Y-m-dT00:00:00\\Z";
|
||||||
options.weekNumbers = true;
|
options.weekNumbers = true;
|
||||||
|
|
||||||
|
this._localize(options);
|
||||||
|
|
||||||
if(this.inline)
|
if(this.inline)
|
||||||
{
|
{
|
||||||
options.inline = this.inline;
|
options.inline = this.inline;
|
||||||
@ -384,6 +391,20 @@ export class Et2Date extends Et2InputWidget(FormControlMixin(ValidateMixin(LitFl
|
|||||||
return options;
|
return options;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/**
|
||||||
|
* Set localize options & translations
|
||||||
|
* @param options
|
||||||
|
* @protected
|
||||||
|
*/
|
||||||
|
protected _localize(options)
|
||||||
|
{
|
||||||
|
let first_dow = this.egw().preference('weekdaystarts', 'calendar') || 'Monday';
|
||||||
|
const DOW_MAP = {Monday: 1, Sunday: 0, Saturday: 6};
|
||||||
|
options.locale = {
|
||||||
|
firstDayOfWeek: DOW_MAP[first_dow]
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
set_value(value)
|
set_value(value)
|
||||||
{
|
{
|
||||||
if(!value || value == 0 || value == "0")
|
if(!value || value == 0 || value == "0")
|
||||||
|
@ -220,6 +220,7 @@ export class Et2Dialog extends Et2Widget(ScopedElementsMixin(SlotMixin(LionDialo
|
|||||||
* Automatically destroy the dialog when it closes. Set to false to keep the dialog around.
|
* Automatically destroy the dialog when it closes. Set to false to keep the dialog around.
|
||||||
*/
|
*/
|
||||||
destroy_on_close: Boolean,
|
destroy_on_close: Boolean,
|
||||||
|
appendTo: String
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -435,7 +436,7 @@ export class Et2Dialog extends Et2Widget(ScopedElementsMixin(SlotMixin(LionDialo
|
|||||||
get value() : Object
|
get value() : Object
|
||||||
{
|
{
|
||||||
let value = this.__value;
|
let value = this.__value;
|
||||||
if(this._template_widget)
|
if(this._template_widget && this._template_widget.widgetContainer)
|
||||||
{
|
{
|
||||||
value = this._template_widget.getValues(this._template_widget.widgetContainer);
|
value = this._template_widget.getValues(this._template_widget.widgetContainer);
|
||||||
}
|
}
|
||||||
|
@ -88,6 +88,27 @@ export class et2_dialog extends Et2Dialog
|
|||||||
return super._getButtons();
|
return super._getButtons();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
_onOpen()
|
||||||
|
{
|
||||||
|
super._onOpen();
|
||||||
|
|
||||||
|
// move the overlay dialog into appendTo dom since we want it to be shown in that container
|
||||||
|
if (this.appendTo)
|
||||||
|
{
|
||||||
|
document.getElementsByClassName(this.appendTo.replace('.',''))[0].appendChild(this._cachedOverlayContentNode);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
_onClose(ev: PointerEvent)
|
||||||
|
{
|
||||||
|
// revert the moved container back to its original position in order to be able to teardown the overlay properly
|
||||||
|
if (this.appendTo)
|
||||||
|
{
|
||||||
|
document.getElementsByClassName('global-overlays__overlay-container')[0].appendChild(this._cachedOverlayContentNode);
|
||||||
|
}
|
||||||
|
super._onClose(ev);
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @deprecated
|
* @deprecated
|
||||||
* @returns {any}
|
* @returns {any}
|
||||||
|
@ -62,7 +62,15 @@ export class SidemenuDate extends Et2Date
|
|||||||
holidays_or_promise.then(holidays =>
|
holidays_or_promise.then(holidays =>
|
||||||
{
|
{
|
||||||
SidemenuDate._holidays = holidays;
|
SidemenuDate._holidays = holidays;
|
||||||
|
if(this._instance)
|
||||||
|
{
|
||||||
|
// Already drawn without holidays so redraw
|
||||||
|
this._instance.redraw();
|
||||||
|
}
|
||||||
|
else
|
||||||
|
{
|
||||||
this.requestUpdate();
|
this.requestUpdate();
|
||||||
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
else
|
else
|
||||||
@ -100,6 +108,12 @@ export class SidemenuDate extends Et2Date
|
|||||||
this._instance.weekNumbers.addEventListener("mouseover", this._handleDayHover);
|
this._instance.weekNumbers.addEventListener("mouseover", this._handleDayHover);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// 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
|
// Move buttons into header
|
||||||
if(this._goButton && this._headerNode)
|
if(this._goButton && this._headerNode)
|
||||||
{
|
{
|
||||||
@ -109,6 +123,7 @@ export class SidemenuDate extends Et2Date
|
|||||||
{
|
{
|
||||||
this._headerNode.append(this._todayButton);
|
this._headerNode.append(this._todayButton);
|
||||||
}
|
}
|
||||||
|
this._updateGoButton();
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@ -123,10 +138,14 @@ export class SidemenuDate extends Et2Date
|
|||||||
|
|
||||||
options.inline = true;
|
options.inline = true;
|
||||||
options.dateFormat = "Y-m-dT00:00:00\\Z";
|
options.dateFormat = "Y-m-dT00:00:00\\Z";
|
||||||
|
options.shorthandCurrentMonth = true;
|
||||||
|
|
||||||
options.onDayCreate = this._onDayCreate;
|
options.onDayCreate = this._onDayCreate;
|
||||||
options.onMonthChange = this._updateGoButton;
|
options.onMonthChange = this._updateGoButton;
|
||||||
|
|
||||||
|
options.nextArrow = "";
|
||||||
|
options.prevArrow = "";
|
||||||
|
|
||||||
return options
|
return options
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -325,12 +344,12 @@ export class SidemenuDate extends Et2Date
|
|||||||
|
|
||||||
get _goButton()
|
get _goButton()
|
||||||
{
|
{
|
||||||
return this.querySelector("button[id*='go']");
|
return this.querySelector("et2-button[id*='go']");
|
||||||
}
|
}
|
||||||
|
|
||||||
get _todayButton()
|
get _todayButton()
|
||||||
{
|
{
|
||||||
return this.querySelector("button[id*='today']");
|
return this.querySelector("et2-button[id*='today']");
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
@ -347,7 +366,7 @@ export class SidemenuDate extends Et2Date
|
|||||||
let temp_date = new Date("" + this._instance.currentYear + "-" + (this._instance.currentMonth + 1) + "-01");
|
let temp_date = new Date("" + this._instance.currentYear + "-" + (this._instance.currentMonth + 1) + "-01");
|
||||||
temp_date.setUTCMinutes(temp_date.getUTCMinutes() + temp_date.getTimezoneOffset());
|
temp_date.setUTCMinutes(temp_date.getUTCMinutes() + temp_date.getTimezoneOffset());
|
||||||
|
|
||||||
this._goButton.setAttribute('title', egw.lang(date('F', temp_date)));
|
this._goButton.setAttribute('title', egw.lang(this._instance.formatDate(temp_date, "F")));
|
||||||
// Store current _displayed_ date in date button for clicking
|
// Store current _displayed_ date in date button for clicking
|
||||||
temp_date.setUTCMinutes(temp_date.getUTCMinutes() - temp_date.getTimezoneOffset());
|
temp_date.setUTCMinutes(temp_date.getUTCMinutes() - temp_date.getTimezoneOffset());
|
||||||
this._goButton.setAttribute('data-date', temp_date.toJSON());
|
this._goButton.setAttribute('data-date', temp_date.toJSON());
|
||||||
|
@ -86,18 +86,12 @@
|
|||||||
border: none;
|
border: none;
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
}
|
}
|
||||||
#calendar-sidebox_buttons tbody {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
#calendar-sidebox_date_header > button {
|
|
||||||
width: 45%;
|
|
||||||
}
|
|
||||||
|
|
||||||
#calendar-sidebox_header_go,
|
#calendar-sidebox_header_go,
|
||||||
#calendar-sidebox_header_today {
|
#calendar-sidebox_header_today {
|
||||||
width: 12px;
|
width: 12px;
|
||||||
height: 12px;
|
height: 12px;
|
||||||
top: 28px;
|
top: 5px;
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
font-size: 10px;
|
font-size: 10px;
|
||||||
@ -105,25 +99,24 @@
|
|||||||
color: white;
|
color: white;
|
||||||
background-color: #217bc0;
|
background-color: #217bc0;
|
||||||
background-image: none;
|
background-image: none;
|
||||||
|
background-position-y: -1px;
|
||||||
border:none;
|
border:none;
|
||||||
border-radius: 100%;
|
border-radius: 100%;
|
||||||
}
|
}
|
||||||
#calendar-sidebox_header_go {
|
#calendar-sidebox_header_go {
|
||||||
text-indent: -1px;
|
margin-right: 10px
|
||||||
}
|
}
|
||||||
|
#calendar-sidebox_header_today {
|
||||||
|
order: 2;
|
||||||
|
}
|
||||||
#calendar-sidebox_header_go:hover, #calendar-sidebox_header_today:hover {
|
#calendar-sidebox_header_go:hover, #calendar-sidebox_header_today:hover {
|
||||||
background-color: #0c5da5;
|
background-color: var(--row-hover);
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
}
|
}
|
||||||
#calendar-sidebox_weekend {
|
#calendar-sidebox_weekend {
|
||||||
/* Special css styling goes here */
|
/* Special css styling goes here */
|
||||||
}
|
}
|
||||||
#calendar-sidebox_date .ui-datepicker .ui-datepicker-header .ui-datepicker-title {
|
|
||||||
max-width: 10em;
|
|
||||||
}
|
|
||||||
#calendar-sidebox_date td.ui-datepicker-week-col {
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
#calendar-sidebox_date .calendar_calHoliday {
|
#calendar-sidebox_date .calendar_calHoliday {
|
||||||
background-color: rgba(103, 159, 210, 0.5);
|
background-color: rgba(103, 159, 210, 0.5);
|
||||||
}
|
}
|
||||||
@ -132,33 +125,79 @@
|
|||||||
background-color: white;
|
background-color: white;
|
||||||
}
|
}
|
||||||
|
|
||||||
#calendar-sidebox_date .flatpickr-months > * {
|
#calendar-sidebox_date .flatpickr-months {
|
||||||
height: 20px;
|
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 {
|
#calendar-sidebox_date .flatpickr-current-month {
|
||||||
height: 25px;
|
height: 25px;
|
||||||
font-size: 110%;
|
font-size: 100%;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
min-width: 16ch;
|
min-width: 7ch;
|
||||||
left: 0;
|
left: 0;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: stretch;
|
align-items: stretch;
|
||||||
padding: 0px;
|
padding: 0px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#calendar-sidebox_date .flatpickr-current-month select {
|
||||||
|
padding: 0 !important;
|
||||||
|
background-color: initial;
|
||||||
|
}
|
||||||
#calendar-sidebox_date .flatpickr-current-month .numInputWrapper {
|
#calendar-sidebox_date .flatpickr-current-month .numInputWrapper {
|
||||||
width: 7ch;
|
width: 7ch;
|
||||||
min-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 {
|
#calendar-sidebox_date .flatpickr-current-month input.cur-year {
|
||||||
padding-top: 3px;
|
padding-top: 3px;
|
||||||
}
|
}
|
||||||
#calendar-sidebox_date div.flatpickr-calendar.inline .flatpickr-current-month .flatpickr-monthDropdown-months {
|
#calendar-sidebox_date div.flatpickr-calendar.inline .flatpickr-current-month .flatpickr-monthDropdown-months {
|
||||||
width: 70%;
|
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(./images/previous.svg);
|
||||||
|
margin-right: 0px;
|
||||||
|
}
|
||||||
|
#calendar-sidebox_date .flatpickr-next-month {
|
||||||
|
order: 3;
|
||||||
|
background-image: url(./images/next.svg);
|
||||||
|
}
|
||||||
#calendar-sidebox_date div.flatpickr-calendar.inline {
|
#calendar-sidebox_date div.flatpickr-calendar.inline {
|
||||||
width: 100% !important;
|
width: 100% !important;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
#calendar-sidebox_date .flatpickr-day {
|
||||||
|
font-size: 11px;
|
||||||
|
}
|
||||||
#calendar-sidebox_date .inRange {
|
#calendar-sidebox_date .inRange {
|
||||||
background-color: var(--row_hover);
|
background-color: var(--row_hover);
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
|
@ -14,18 +14,18 @@ Egroupware
|
|||||||
<overlay>
|
<overlay>
|
||||||
<template id="calendar.sidebox">
|
<template id="calendar.sidebox">
|
||||||
<vbox parent_node="calendar-et2_target">
|
<vbox parent_node="calendar-et2_target">
|
||||||
<calendar-date id="date" class="et2_fullWidth" onchange="var view_change = app.calendar.sidebox_changes_views.indexOf(app.calendar.state.view);
|
<calendar-date id="date" onchange="var view_change = app.calendar.sidebox_changes_views.indexOf(app.calendar.state.view);
|
||||||
var update = {date:widget.getValue()};
|
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);">
|
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);">
|
||||||
<buttononly id="header_today" label="•" icon="nope" onclick="
|
<et2-button id="header_today" label="•" statustext="Today" icon="nope" onclick="
|
||||||
var tempDate = new Date();
|
var tempDate = new Date();
|
||||||
var today = new Date(tempDate.getFullYear(), tempDate.getMonth(), tempDate.getDate(),0,-tempDate.getTimezoneOffset(),0);
|
var today = new Date(tempDate.getFullYear(), tempDate.getMonth(), tempDate.getDate(),0,-tempDate.getTimezoneOffset(),0);
|
||||||
var change = {date: today.toJSON()};
|
var change = {date: today.toJSON()};
|
||||||
app.calendar.update_state(change);
|
app.calendar.update_state(change);
|
||||||
widget.getRoot().getWidgetById('date').set_value(today);
|
widget.getRoot().getWidgetById('date').set_value(today);
|
||||||
return false;"/>
|
return false;"/>
|
||||||
<buttononly id="header_go" label="↵" icon="nope" class="ui-corner-all"
|
<et2-button id="header_go" label="↵" icon="nope"
|
||||||
onclick="var change = {date: widget.btn.attr('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);"/>
|
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>
|
||||||
<textbox type="hidden" id="first"/>
|
<textbox type="hidden" id="first"/>
|
||||||
|
@ -107,17 +107,11 @@
|
|||||||
border: none;
|
border: none;
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
}
|
}
|
||||||
#calendar-sidebox_buttons tbody {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
#calendar-sidebox_date_header > button {
|
|
||||||
width: 45%;
|
|
||||||
}
|
|
||||||
#calendar-sidebox_header_go,
|
#calendar-sidebox_header_go,
|
||||||
#calendar-sidebox_header_today {
|
#calendar-sidebox_header_today {
|
||||||
width: 12px;
|
width: 12px;
|
||||||
height: 12px;
|
height: 12px;
|
||||||
top: 28px;
|
top: 5px;
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
font-size: 10px;
|
font-size: 10px;
|
||||||
@ -125,26 +119,24 @@
|
|||||||
color: white;
|
color: white;
|
||||||
background-color: #217bc0;
|
background-color: #217bc0;
|
||||||
background-image: none;
|
background-image: none;
|
||||||
|
background-position-y: -1px;
|
||||||
border: none;
|
border: none;
|
||||||
border-radius: 100%;
|
border-radius: 100%;
|
||||||
}
|
}
|
||||||
#calendar-sidebox_header_go {
|
#calendar-sidebox_header_go {
|
||||||
text-indent: -1px;
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
#calendar-sidebox_header_today {
|
||||||
|
order: 2;
|
||||||
}
|
}
|
||||||
#calendar-sidebox_header_go:hover,
|
#calendar-sidebox_header_go:hover,
|
||||||
#calendar-sidebox_header_today:hover {
|
#calendar-sidebox_header_today:hover {
|
||||||
background-color: #0c5da5;
|
background-color: var(--row-hover);
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
}
|
}
|
||||||
#calendar-sidebox_weekend {
|
#calendar-sidebox_weekend {
|
||||||
/* Special css styling goes here */
|
/* Special css styling goes here */
|
||||||
}
|
}
|
||||||
#calendar-sidebox_date .ui-datepicker .ui-datepicker-header .ui-datepicker-title {
|
|
||||||
max-width: 10em;
|
|
||||||
}
|
|
||||||
#calendar-sidebox_date td.ui-datepicker-week-col {
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
#calendar-sidebox_date .calendar_calHoliday {
|
#calendar-sidebox_date .calendar_calHoliday {
|
||||||
background-color: rgba(103, 159, 210, 0.5);
|
background-color: rgba(103, 159, 210, 0.5);
|
||||||
}
|
}
|
||||||
@ -152,34 +144,78 @@
|
|||||||
padding: 2px;
|
padding: 2px;
|
||||||
background-color: white;
|
background-color: white;
|
||||||
}
|
}
|
||||||
|
#calendar-sidebox_date .flatpickr-months {
|
||||||
|
gap: 0;
|
||||||
|
background-color: initial;
|
||||||
|
}
|
||||||
#calendar-sidebox_date .flatpickr-months > * {
|
#calendar-sidebox_date .flatpickr-months > * {
|
||||||
height: 20px;
|
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 {
|
#calendar-sidebox_date .flatpickr-current-month {
|
||||||
height: 25px;
|
height: 25px;
|
||||||
font-size: 110%;
|
font-size: 100%;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
min-width: 16ch;
|
min-width: 7ch;
|
||||||
left: 0;
|
left: 0;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: stretch;
|
align-items: stretch;
|
||||||
padding: 0px;
|
padding: 0px;
|
||||||
}
|
}
|
||||||
|
#calendar-sidebox_date .flatpickr-current-month select {
|
||||||
|
padding: 0 !important;
|
||||||
|
background-color: initial;
|
||||||
|
}
|
||||||
#calendar-sidebox_date .flatpickr-current-month .numInputWrapper {
|
#calendar-sidebox_date .flatpickr-current-month .numInputWrapper {
|
||||||
width: 7ch;
|
width: 7ch;
|
||||||
min-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 {
|
#calendar-sidebox_date .flatpickr-current-month input.cur-year {
|
||||||
padding-top: 3px;
|
padding-top: 3px;
|
||||||
}
|
}
|
||||||
#calendar-sidebox_date div.flatpickr-calendar.inline .flatpickr-current-month .flatpickr-monthDropdown-months {
|
#calendar-sidebox_date div.flatpickr-calendar.inline .flatpickr-current-month .flatpickr-monthDropdown-months {
|
||||||
width: 70%;
|
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(./images/previous.svg);
|
||||||
|
margin-right: 0px;
|
||||||
|
}
|
||||||
|
#calendar-sidebox_date .flatpickr-next-month {
|
||||||
|
order: 3;
|
||||||
|
background-image: url(./images/next.svg);
|
||||||
}
|
}
|
||||||
#calendar-sidebox_date div.flatpickr-calendar.inline {
|
#calendar-sidebox_date div.flatpickr-calendar.inline {
|
||||||
width: 100% !important;
|
width: 100% !important;
|
||||||
}
|
}
|
||||||
|
#calendar-sidebox_date .flatpickr-day {
|
||||||
|
font-size: 11px;
|
||||||
|
}
|
||||||
#calendar-sidebox_date .inRange {
|
#calendar-sidebox_date .inRange {
|
||||||
background-color: var(--row_hover);
|
background-color: var(--row_hover);
|
||||||
|
box-shadow: none;
|
||||||
}
|
}
|
||||||
/* Conflict display */
|
/* Conflict display */
|
||||||
div.calendar_conflicts {
|
div.calendar_conflicts {
|
||||||
@ -2755,7 +2791,6 @@ div#calendar-container div.calendar table tbody tr.rowhilite td {
|
|||||||
#calendar-sidebox_header_today {
|
#calendar-sidebox_header_today {
|
||||||
width: 2em;
|
width: 2em;
|
||||||
height: 2em;
|
height: 2em;
|
||||||
margin-left: 6px;
|
|
||||||
background-image: url('../../../pixelegg/images/bullet.svg');
|
background-image: url('../../../pixelegg/images/bullet.svg');
|
||||||
text-indent: 140%;
|
text-indent: 140%;
|
||||||
border: none;
|
border: none;
|
||||||
|
@ -95,17 +95,11 @@
|
|||||||
border: none;
|
border: none;
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
}
|
}
|
||||||
#calendar-sidebox_buttons tbody {
|
|
||||||
width: 100%;
|
|
||||||
}
|
|
||||||
#calendar-sidebox_date_header > button {
|
|
||||||
width: 45%;
|
|
||||||
}
|
|
||||||
#calendar-sidebox_header_go,
|
#calendar-sidebox_header_go,
|
||||||
#calendar-sidebox_header_today {
|
#calendar-sidebox_header_today {
|
||||||
width: 12px;
|
width: 12px;
|
||||||
height: 12px;
|
height: 12px;
|
||||||
top: 28px;
|
top: 5px;
|
||||||
z-index: 1;
|
z-index: 1;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
font-size: 10px;
|
font-size: 10px;
|
||||||
@ -113,26 +107,24 @@
|
|||||||
color: white;
|
color: white;
|
||||||
background-color: #217bc0;
|
background-color: #217bc0;
|
||||||
background-image: none;
|
background-image: none;
|
||||||
|
background-position-y: -1px;
|
||||||
border: none;
|
border: none;
|
||||||
border-radius: 100%;
|
border-radius: 100%;
|
||||||
}
|
}
|
||||||
#calendar-sidebox_header_go {
|
#calendar-sidebox_header_go {
|
||||||
text-indent: -1px;
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
#calendar-sidebox_header_today {
|
||||||
|
order: 2;
|
||||||
}
|
}
|
||||||
#calendar-sidebox_header_go:hover,
|
#calendar-sidebox_header_go:hover,
|
||||||
#calendar-sidebox_header_today:hover {
|
#calendar-sidebox_header_today:hover {
|
||||||
background-color: #0c5da5;
|
background-color: var(--row-hover);
|
||||||
box-shadow: none;
|
box-shadow: none;
|
||||||
}
|
}
|
||||||
#calendar-sidebox_weekend {
|
#calendar-sidebox_weekend {
|
||||||
/* Special css styling goes here */
|
/* Special css styling goes here */
|
||||||
}
|
}
|
||||||
#calendar-sidebox_date .ui-datepicker .ui-datepicker-header .ui-datepicker-title {
|
|
||||||
max-width: 10em;
|
|
||||||
}
|
|
||||||
#calendar-sidebox_date td.ui-datepicker-week-col {
|
|
||||||
cursor: pointer;
|
|
||||||
}
|
|
||||||
#calendar-sidebox_date .calendar_calHoliday {
|
#calendar-sidebox_date .calendar_calHoliday {
|
||||||
background-color: rgba(103, 159, 210, 0.5);
|
background-color: rgba(103, 159, 210, 0.5);
|
||||||
}
|
}
|
||||||
@ -140,34 +132,78 @@
|
|||||||
padding: 2px;
|
padding: 2px;
|
||||||
background-color: white;
|
background-color: white;
|
||||||
}
|
}
|
||||||
|
#calendar-sidebox_date .flatpickr-months {
|
||||||
|
gap: 0;
|
||||||
|
background-color: initial;
|
||||||
|
}
|
||||||
#calendar-sidebox_date .flatpickr-months > * {
|
#calendar-sidebox_date .flatpickr-months > * {
|
||||||
height: 20px;
|
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 {
|
#calendar-sidebox_date .flatpickr-current-month {
|
||||||
height: 25px;
|
height: 25px;
|
||||||
font-size: 110%;
|
font-size: 100%;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
min-width: 16ch;
|
min-width: 7ch;
|
||||||
left: 0;
|
left: 0;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: stretch;
|
align-items: stretch;
|
||||||
padding: 0px;
|
padding: 0px;
|
||||||
}
|
}
|
||||||
|
#calendar-sidebox_date .flatpickr-current-month select {
|
||||||
|
padding: 0 !important;
|
||||||
|
background-color: initial;
|
||||||
|
}
|
||||||
#calendar-sidebox_date .flatpickr-current-month .numInputWrapper {
|
#calendar-sidebox_date .flatpickr-current-month .numInputWrapper {
|
||||||
width: 7ch;
|
width: 7ch;
|
||||||
min-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 {
|
#calendar-sidebox_date .flatpickr-current-month input.cur-year {
|
||||||
padding-top: 3px;
|
padding-top: 3px;
|
||||||
}
|
}
|
||||||
#calendar-sidebox_date div.flatpickr-calendar.inline .flatpickr-current-month .flatpickr-monthDropdown-months {
|
#calendar-sidebox_date div.flatpickr-calendar.inline .flatpickr-current-month .flatpickr-monthDropdown-months {
|
||||||
width: 70%;
|
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(./images/previous.svg);
|
||||||
|
margin-right: 0px;
|
||||||
|
}
|
||||||
|
#calendar-sidebox_date .flatpickr-next-month {
|
||||||
|
order: 3;
|
||||||
|
background-image: url(./images/next.svg);
|
||||||
}
|
}
|
||||||
#calendar-sidebox_date div.flatpickr-calendar.inline {
|
#calendar-sidebox_date div.flatpickr-calendar.inline {
|
||||||
width: 100% !important;
|
width: 100% !important;
|
||||||
}
|
}
|
||||||
|
#calendar-sidebox_date .flatpickr-day {
|
||||||
|
font-size: 11px;
|
||||||
|
}
|
||||||
#calendar-sidebox_date .inRange {
|
#calendar-sidebox_date .inRange {
|
||||||
background-color: var(--row_hover);
|
background-color: var(--row_hover);
|
||||||
|
box-shadow: none;
|
||||||
}
|
}
|
||||||
/* Conflict display */
|
/* Conflict display */
|
||||||
div.calendar_conflicts {
|
div.calendar_conflicts {
|
||||||
@ -2743,7 +2779,6 @@ div#calendar-container div.calendar table tbody tr.rowhilite td {
|
|||||||
#calendar-sidebox_header_today {
|
#calendar-sidebox_header_today {
|
||||||
width: 2em;
|
width: 2em;
|
||||||
height: 2em;
|
height: 2em;
|
||||||
margin-left: 6px;
|
|
||||||
background-image: url('../../../pixelegg/images/bullet.svg');
|
background-image: url('../../../pixelegg/images/bullet.svg');
|
||||||
text-indent: 140%;
|
text-indent: 140%;
|
||||||
border: none;
|
border: none;
|
||||||
|
@ -14,7 +14,6 @@
|
|||||||
@import (reference) "../../../pixelegg/less/definitions.less";
|
@import (reference) "../../../pixelegg/less/definitions.less";
|
||||||
@import (less) "../default/app.css";
|
@import (less) "../default/app.css";
|
||||||
|
|
||||||
|
|
||||||
/*generell*/
|
/*generell*/
|
||||||
|
|
||||||
// makes svg visible
|
// makes svg visible
|
||||||
@ -1176,8 +1175,6 @@ div#calendar-container {
|
|||||||
#calendar-sidebox_header_today {
|
#calendar-sidebox_header_today {
|
||||||
width: 2em;
|
width: 2em;
|
||||||
height: 2em;
|
height: 2em;
|
||||||
|
|
||||||
margin-left: 6px;
|
|
||||||
background-image: url('../../../pixelegg/images/bullet.svg');
|
background-image: url('../../../pixelegg/images/bullet.svg');
|
||||||
text-indent: 140%;
|
text-indent: 140%;
|
||||||
border: none;
|
border: none;
|
||||||
|
Loading…
Reference in New Issue
Block a user