Replace bootstrap-datetimepicker by HannesClausnitzer · Pull Request #2608 · e-valuation/EvaP

HannesClausnitzer · 2026-01-12T20:03:12Z

Copilot

Pull request overview

This pull request replaces the bootstrap-datetimepicker JavaScript library with native HTML5 date and datetime-local input types. The change modernizes the date/time input handling by using browser-native controls instead of a third-party library, simplifying the codebase and reducing dependencies.

Changes:

Replaced bootstrap-datetimepicker widgets with HTML5 native date/datetime inputs across all forms
Removed bootstrap_datetimepicker.html template includes from multiple templates
Extracted message rendering into a reusable messages.html template
Updated plain_page templates to include message rendering explicitly

Reviewed changes

Copilot reviewed 8 out of 8 changed files in this pull request and generated 2 comments.

Show a summary per file

File	Description
evap/staff/templates/staff_semester_import.html	Removed bootstrap_datetimepicker include and additional JavaScript block
evap/staff/templates/staff_evaluation_form.html	Added messages template include for plain_page display
evap/staff/templates/staff_course_copyform.html	Removed bootstrap_datetimepicker include
evap/staff/forms.py	Updated ImportForm, CourseCopyForm, and EvaluationForm with HTML5 date/datetime widgets
evap/rewards/templates/rewards_reward_point_redemption_event_form.html	Removed bootstrap_datetimepicker include
evap/rewards/forms.py	Updated RewardPointRedemptionEventForm with HTML5 date widgets
evap/evaluation/templates/messages.html	Created reusable messages display template
evap/evaluation/templates/evap_evaluation_edit_js.html	Removed bootstrap_datetimepicker include
evap/evaluation/templates/base.html	Removed bootstrap_datetimepicker CSS and extracted messages to separate template
evap/contributor/forms.py	Updated EvaluationForm widgets (contains bug - incorrect widget type)

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

hansegucker

Also, the file evap/static/js/bootstrap-datetimepicker.min.js still exists.

But apart from that, this looks very good!

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

niklasmohrin · 2026-01-12T20:57:46Z

There are also still adjustments in _adjustments.scss for the bootstrap datetimepicker

niklasmohrin

Very cool!

We still mention bootstrap-datetimepicker in license.md and the places that are listed in the other comments

janno42

It would be nice to open the picker once the field receives focus.

Also, please investigate if we can force the date and time format to be our default format YYYY-MM-DD HH:mm.

HannesClausnitzer · 2026-01-19T20:39:21Z

So it seems the native datetime-picker in firefox and chromium doesn't meet our needs, as it doesn't support setting the locale and gives a few focus issues (when the date picker is shown, nothing can be typed into the input field).
I have found a different alternative to the bootstrap-datetimepicker that is quite similar but doesn't use jQuery:
https://github.com/Eonasdan/tempus-dominus/
You can try it out here:
https://getdatepicker.com/6/repl.html
What do you think about this? Would it be worth it implementing this?

richardebeling · 2026-02-01T21:36:43Z

I'll re-mark as draft, if I recall correctly, we decided that a native HTML datetime-local input isn't viable because we had at least one scenario where Firefox would render the time with AM/PM although we didn't want it to (@janno42 right?)

niklasmohrin · 2026-02-01T22:01:53Z

I am very much pro vanilla inputs, if we can get it to work. However, if not, then I guess switching to this tempus dominus thing is still better what we currently have. Both with this or with our current version of datepicker, we don't get support from anyone, but at least dominus lets us get rid of jquery. Based on the Latin name, we should do a quick background check on whether the creator is a nutcase before associating our project with theirs. Update: Richard and I did some digging, nothing worrying turned up

But before that, let's document here when exactly the plain browser things fail us

janno42

the picker doesn't always open when clicking on the input field.

janno42 · 2026-05-04T17:41:25Z

+</head>
+
+<body>
+    <div class="input-group" id="datepicker1" data-td-target-input="nearest" data-td-target-toggle="nearest">


why do we need the number in the id?

it is included in the official documentation, but actually we don't need it, so i removed it.

janno42 · 2026-05-04T17:47:09Z

@@ -0,0 +1,26 @@
+<head>


same here (head, ids)

janno42 · 2026-05-04T17:48:51Z

@@ -0,0 +1,26 @@
+<head>


why do we need a head/body here? shouldn't all scripts and css be loaded by base.html?

janno42 · 2026-05-04T17:56:54Z

-            <link rel="stylesheet" href="{% static 'css/bootstrap-datetimepicker.min.css' %}" />
            <link rel="stylesheet" href="{% static 'css/evap.css' %}" />
+            <link rel="stylesheet" href="{% static 'tempus-dominus/tempus-dominus.min.css' %}" />
+            <script src="{%static 'js/popper.min.js' %}"></script>


this should already be available via bootstrap, please check

what do you mean exactly?

btw it seems popper js script is needed, when i remove it, the datetimepicker breaks...

janno42 · 2026-05-04T18:01:49Z

are the two tempus-dominus js files from us? then we should use typescript.

janno42 · 2026-05-04T18:03:44Z

+    min-width: 290px;
+}
+
+:root{--td-light:#fff;--td-widget-background:#fff;--td-font-color:#000;--td-timepicker-font-size:1.2em;--td-active-bg:#0d6efd;--td-range-bg:#01419e;--td-active-color:#fff;--td-active-border-color:#fff;--td-border-radius:999px;--td-btn-hover-bg:#e9ecef;--td-disabled-color:#6c757d;--td-alternate-color:rgba(0,0,0,.38);--td-secondary-border-color:#ccc;--td-secondary-border-color-rgba:rgba(0,0,0,.2);--td-primary-border-color:#fff;--td-text-shadow:0 -1px 0 rgba(0,0,0,.25);--td-dow-color:rgba(0,0,0,.5);--td-dark:#1b1b1b;--td-dark-widget-background:#1b1b1b;--td-dark-font-color:#e3e3e3;--td-dark-active-bg:#4db2ff;--td-dark-range-bg:#0071c7;--td-dark-active-color:#fff;--td-dark-active-border-color:#1b1b1b;--td-dark-btn-hover-bg:#232627;--td-dark-disabled-color:#6c757d;--td-dark-alternate-color:hsla(36,10%,90%,.38);--td-dark-secondary-border-color:#ccc;--td-dark-secondary-border-color-rgba:hsla(36,10%,90%,.2);--td-dark-primary-border-color:#1b1b1b;--td-dark-text-shadow:0 -1px 0 hsla(36,10%,90%,.25);--td-dark-dow-color:hsla(36,10%,90%,.5)}.tempus-dominus-widget [data-action]:after,.visually-hidden{clip:rect(0,0,0,0)!important;border:0!important;height:1px!important;margin:-1px!important;overflow:hidden!important;padding:0!important;position:absolute!important;white-space:nowrap!important;width:1px!important}.tempus-dominus-widget{border-radius:4px;box-shadow:0 2px 4px -1px rgba(0,0,0,.2),0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12);display:none;list-style:none;padding:4px;width:19rem;z-index:9999}.tempus-dominus-widget.calendarWeeks{width:21rem}.tempus-dominus-widget.calendarWeeks .date-container-days{grid-auto-columns:12.5%;grid-template-areas:"a a a a a a a a"}.tempus-dominus-widget [data-action]{cursor:pointer}.tempus-dominus-widget [data-action]:after{content:attr(title)}.tempus-dominus-widget [data-action].disabled,.tempus-dominus-widget [data-action].disabled:hover{background:none;cursor:not-allowed}.tempus-dominus-widget .arrow{display:none}.tempus-dominus-widget.show{display:block}.tempus-dominus-widget.show.date-container{min-height:315px}.tempus-dominus-widget.show.time-container{min-height:217px}.tempus-dominus-widget .td-collapse:not(.show){display:none}.tempus-dominus-widget .td-collapsing{height:0;overflow:hidden;transition:height .35s ease}@media (min-width:576px){.tempus-dominus-widget.timepicker-sbs{width:38em}}@media (min-width:768px){.tempus-dominus-widget.timepicker-sbs{width:38em}}@media (min-width:992px){.tempus-dominus-widget.timepicker-sbs{width:38em}}.tempus-dominus-widget.timepicker-sbs .td-row{display:flex}.tempus-dominus-widget.timepicker-sbs .td-row .td-half{flex:0 0 auto;width:50%}.tempus-dominus-widget div[data-action]:active{box-shadow:none}.tempus-dominus-widget .timepicker-hour,.tempus-dominus-widget .timepicker-minute,.tempus-dominus-widget .timepicker-second{font-size:1.2em;font-weight:700;margin:0;width:54px}.tempus-dominus-widget button[data-action]{padding:6px}.tempus-dominus-widget .toggleMeridiem{height:38px;text-align:center}.tempus-dominus-widget .calendar-header{display:grid;font-weight:700;grid-template-areas:"a a a";margin-bottom:10px}.tempus-dominus-widget .calendar-header .next{padding-right:10px;text-align:right}.tempus-dominus-widget .calendar-header .previous{padding-left:10px;text-align:left}.tempus-dominus-widget .calendar-header .picker-switch{text-align:center}.tempus-dominus-widget .toolbar{display:grid;grid-auto-flow:column;grid-auto-rows:40px}.tempus-dominus-widget .toolbar div{align-items:center;border-radius:var(--td-border-radius);box-sizing:border-box;display:flex;justify-content:center}.tempus-dominus-widget .date-container-days{display:grid;grid-auto-columns:14.2857142857%;grid-auto-rows:40px;grid-template-areas:"a a a a a a a"}.tempus-dominus-widget .date-container-days .range-in{background-color:var(--td-range-bg)!important;border:none;border-radius:0!important;box-shadow:-5px 0 0 var(--td-range-bg),5px 0 0 var(--td-range-bg)}.tempus-dominus-widget .date-container-days .range-end{border-radius:0 50px 50px 0!important}.tempus-dominus-widget .date-container-days .range-start{border-radius:50px 0 0 50px!important}.tempus-dominus-widget .date-container-days .dow{align-items:center;justify-content:center;text-align:center}.tempus-dominus-widget .date-container-days .cw{align-items:center;cursor:default;display:flex;font-size:.8em;height:90%;justify-content:center;line-height:20px;width:90%}.tempus-dominus-widget .date-container-decades,.tempus-dominus-widget .date-container-months,.tempus-dominus-widget .date-container-years{display:grid;grid-auto-rows:calc(2.71429rem - 1.14286px);grid-template-areas:"a a a"}.tempus-dominus-widget .time-container-hour,.tempus-dominus-widget .time-container-minute,.tempus-dominus-widget .time-container-second{display:grid;grid-auto-rows:calc(2.71429rem - 1.14286px);grid-template-areas:"a a a a"}.tempus-dominus-widget .time-container-clock{display:grid;grid-auto-rows:calc(2.71429rem - 1.14286px)}.tempus-dominus-widget .time-container-clock .no-highlight{align-items:center;display:flex;height:90%;justify-content:center;width:90%}.tempus-dominus-widget .date-container-days div:not(.no-highlight),.tempus-dominus-widget .date-container-decades div:not(.no-highlight),.tempus-dominus-widget .date-container-months div:not(.no-highlight),.tempus-dominus-widget .date-container-years div:not(.no-highlight),.tempus-dominus-widget .time-container-clock div:not(.no-highlight),.tempus-dominus-widget .time-container-hour div:not(.no-highlight),.tempus-dominus-widget .time-container-minute div:not(.no-highlight),.tempus-dominus-widget .time-container-second div:not(.no-highlight){align-items:center;border-radius:var(--td-border-radius);box-sizing:border-box;display:flex;height:90%;justify-content:center;width:90%}.tempus-dominus-widget .date-container-days div:not(.no-highlight).disabled,.tempus-dominus-widget .date-container-days div:not(.no-highlight).disabled:hover,.tempus-dominus-widget .date-container-decades div:not(.no-highlight).disabled,.tempus-dominus-widget .date-container-decades div:not(.no-highlight).disabled:hover,.tempus-dominus-widget .date-container-months div:not(.no-highlight).disabled,.tempus-dominus-widget .date-container-months div:not(.no-highlight).disabled:hover,.tempus-dominus-widget .date-container-years div:not(.no-highlight).disabled,.tempus-dominus-widget .date-container-years div:not(.no-highlight).disabled:hover,.tempus-dominus-widget .time-container-clock div:not(.no-highlight).disabled,.tempus-dominus-widget .time-container-clock div:not(.no-highlight).disabled:hover,.tempus-dominus-widget .time-container-hour div:not(.no-highlight).disabled,.tempus-dominus-widget .time-container-hour div:not(.no-highlight).disabled:hover,.tempus-dominus-widget .time-container-minute div:not(.no-highlight).disabled,.tempus-dominus-widget .time-container-minute div:not(.no-highlight).disabled:hover,.tempus-dominus-widget .time-container-second div:not(.no-highlight).disabled,.tempus-dominus-widget .time-container-second div:not(.no-highlight).disabled:hover{background:none;cursor:not-allowed}.tempus-dominus-widget .date-container-days div:not(.no-highlight).today,.tempus-dominus-widget .date-container-decades div:not(.no-highlight).today,.tempus-dominus-widget .date-container-months div:not(.no-highlight).today,.tempus-dominus-widget .date-container-years div:not(.no-highlight).today,.tempus-dominus-widget .time-container-clock div:not(.no-highlight).today,.tempus-dominus-widget .time-container-hour div:not(.no-highlight).today,.tempus-dominus-widget .time-container-minute div:not(.no-highlight).today,.tempus-dominus-widget .time-container-second div:not(.no-highlight).today{position:relative}.tempus-dominus-widget .date-container-days div:not(.no-highlight).today:before,.tempus-dominus-widget .date-container-decades div:not(.no-highlight).today:before,.tempus-dominus-widget .date-container-months div:not(.no-highlight).today:before,.tempus-dominus-widget .date-container-years div:not(.no-highlight).today:before,.tempus-dominus-widget .time-container-clock div:not(.no-highlight).today:before,.tempus-dominus-widget .time-container-hour div:not(.no-highlight).today:before,.tempus-dominus-widget .time-container-minute div:not(.no-highlight).today:before,.tempus-dominus-widget .time-container-second div:not(.no-highlight).today:before{border:solid transparent;border-width:0 0 7px 7px;bottom:6px;content:"";display:inline-block;position:absolute;right:6px}.tempus-dominus-widget .time-container{margin-bottom:.5rem}.tempus-dominus-widget button{border-radius:.25rem;cursor:pointer;display:inline-block;font-size:1rem;font-weight:400;line-height:1.5;padding:.375rem .75rem;text-align:center;text-decoration:none;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out;-webkit-user-select:none;-moz-user-select:none;user-select:none;vertical-align:middle}.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=decrementHours],.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=decrementMinutes],.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=decrementSeconds],.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=incrementHours],.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=incrementMinutes],.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=incrementSeconds],.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=showHours],.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=showMinutes],.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=showSeconds],.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=togglePeriod],.tempus-dominus-widget.tempus-dominus-widget-readonly table td.day,.tempus-dominus-widget.tempus-dominus-widget-readonly table td.hour,.tempus-dominus-widget.tempus-dominus-widget-readonly table td.minute,.tempus-dominus-widget.tempus-dominus-widget-readonly table td.second{cursor:default;pointer-events:none}.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=decrementHours]:hover,.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=decrementMinutes]:hover,.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=decrementSeconds]:hover,.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=incrementHours]:hover,.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=incrementMinutes]:hover,.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=incrementSeconds]:hover,.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=showHours]:hover,.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=showMinutes]:hover,.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=showSeconds]:hover,.tempus-dominus-widget.tempus-dominus-widget-readonly table td [data-action=togglePeriod]:hover,.tempus-dominus-widget.tempus-dominus-widget-readonly table td.day:hover,.tempus-dominus-widget.tempus-dominus-widget-readonly table td.hour:hover,.tempus-dominus-widget.tempus-dominus-widget-readonly table td.minute:hover,.tempus-dominus-widget.tempus-dominus-widget-readonly table td.second:hover{background:none}.tempus-dominus-widget.light{background-color:var(--td-widget-background);color:var(--td-font-color)}.tempus-dominus-widget.light [data-action].disabled,.tempus-dominus-widget.light [data-action].disabled:hover{color:var(--td-disabled-color)}.tempus-dominus-widget.light .toolbar div:hover{background:var(--td-btn-hover-bg)}.tempus-dominus-widget.light .date-container-days .dow{color:var(--td-dow-color)}.tempus-dominus-widget.light .date-container-days .cw{color:var(--td-alternate-color)}.tempus-dominus-widget.light .date-container-days div:not(.no-highlight):hover,.tempus-dominus-widget.light .date-container-decades div:not(.no-highlight):hover,.tempus-dominus-widget.light .date-container-months div:not(.no-highlight):hover,.tempus-dominus-widget.light .date-container-years div:not(.no-highlight):hover,.tempus-dominus-widget.light .time-container-clock div:not(.no-highlight):hover,.tempus-dominus-widget.light .time-container-hour div:not(.no-highlight):hover,.tempus-dominus-widget.light .time-container-minute div:not(.no-highlight):hover,.tempus-dominus-widget.light .time-container-second div:not(.no-highlight):hover{background:var(--td-btn-hover-bg)}.tempus-dominus-widget.light .date-container-days div.range-end:not(.no-highlight),.tempus-dominus-widget.light .date-container-days div.range-in:not(.no-highlight),.tempus-dominus-widget.light .date-container-days div.range-start:not(.no-highlight),.tempus-dominus-widget.light .date-container-days div:not(.no-highlight).active,.tempus-dominus-widget.light .date-container-decades div:not(.no-highlight).active,.tempus-dominus-widget.light .date-container-months div:not(.no-highlight).active,.tempus-dominus-widget.light .date-container-years div:not(.no-highlight).active,.tempus-dominus-widget.light .time-container-clock div:not(.no-highlight).active,.tempus-dominus-widget.light .time-container-hour div:not(.no-highlight).active,.tempus-dominus-widget.light .time-container-minute div:not(.no-highlight).active,.tempus-dominus-widget.light .time-container-second div:not(.no-highlight).active{background-color:var(--td-active-bg);color:var(--td-active-color);text-shadow:var(--td-text-shadow)}.tempus-dominus-widget.light .date-container-days .date-container-decades div.range-end:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .date-container-decades div.range-end:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .date-container-decades div.range-in:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .date-container-decades div.range-in:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .date-container-decades div.range-start:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .date-container-decades div.range-start:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .date-container-months div.range-end:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .date-container-months div.range-end:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .date-container-months div.range-in:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .date-container-months div.range-in:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .date-container-months div.range-start:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .date-container-months div.range-start:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .date-container-years div.range-end:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .date-container-years div.range-end:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .date-container-years div.range-in:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .date-container-years div.range-in:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .date-container-years div.range-start:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .date-container-years div.range-start:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .time-container-clock div.range-end:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .time-container-clock div.range-end:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .time-container-clock div.range-in:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .time-container-clock div.range-in:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .time-container-clock div.range-start:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .time-container-clock div.range-start:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .time-container-hour div.range-end:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .time-container-hour div.range-end:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .time-container-hour div.range-in:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .time-container-hour div.range-in:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .time-container-hour div.range-start:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .time-container-hour div.range-start:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .time-container-minute div.range-end:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .time-container-minute div.range-end:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .time-container-minute div.range-in:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .time-container-minute div.range-in:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .time-container-minute div.range-start:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .time-container-minute div.range-start:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .time-container-second div.range-end:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .time-container-second div.range-end:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .time-container-second div.range-in:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .time-container-second div.range-in:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days .time-container-second div.range-start:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days .time-container-second div.range-start:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days div.range-end:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days div.range-end:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days div.range-in:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days div.range-in:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days div.range-start:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days div.range-start:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-days div:not(.no-highlight).active.new,.tempus-dominus-widget.light .date-container-days div:not(.no-highlight).active.old,.tempus-dominus-widget.light .date-container-decades .date-container-days div.range-end:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-decades .date-container-days div.range-end:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-decades .date-container-days div.range-in:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-decades .date-container-days div.range-in:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-decades .date-container-days div.range-start:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-decades .date-container-days div.range-start:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-decades div:not(.no-highlight).active.new,.tempus-dominus-widget.light .date-container-decades div:not(.no-highlight).active.old,.tempus-dominus-widget.light .date-container-months .date-container-days div.range-end:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-months .date-container-days div.range-end:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-months .date-container-days div.range-in:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-months .date-container-days div.range-in:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-months .date-container-days div.range-start:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-months .date-container-days div.range-start:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-months div:not(.no-highlight).active.new,.tempus-dominus-widget.light .date-container-months div:not(.no-highlight).active.old,.tempus-dominus-widget.light .date-container-years .date-container-days div.range-end:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-years .date-container-days div.range-end:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-years .date-container-days div.range-in:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-years .date-container-days div.range-in:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-years .date-container-days div.range-start:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-years .date-container-days div.range-start:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-years div:not(.no-highlight).active.new,.tempus-dominus-widget.light .date-container-years div:not(.no-highlight).active.old,.tempus-dominus-widget.light .time-container-clock .date-container-days div.range-end:not(.no-highlight).new,.tempus-dominus-widget.light .time-container-clock .date-container-days div.range-end:not(.no-highlight).old,.tempus-dominus-widget.light .time-container-clock .date-container-days div.range-in:not(.no-highlight).new,.tempus-dominus-widget.light .time-container-clock .date-container-days div.range-in:not(.no-highlight).old,.tempus-dominus-widget.light .time-container-clock .date-container-days div.range-start:not(.no-highlight).new,.tempus-dominus-widget.light .time-container-clock .date-container-days div.range-start:not(.no-highlight).old,.tempus-dominus-widget.light .time-container-clock div:not(.no-highlight).active.new,.tempus-dominus-widget.light .time-container-clock div:not(.no-highlight).active.old,.tempus-dominus-widget.light .time-container-hour .date-container-days div.range-end:not(.no-highlight).new,.tempus-dominus-widget.light .time-container-hour .date-container-days div.range-end:not(.no-highlight).old,.tempus-dominus-widget.light .time-container-hour .date-container-days div.range-in:not(.no-highlight).new,.tempus-dominus-widget.light .time-container-hour .date-container-days div.range-in:not(.no-highlight).old,.tempus-dominus-widget.light .time-container-hour .date-container-days div.range-start:not(.no-highlight).new,.tempus-dominus-widget.light .time-container-hour .date-container-days div.range-start:not(.no-highlight).old,.tempus-dominus-widget.light .time-container-hour div:not(.no-highlight).active.new,.tempus-dominus-widget.light .time-container-hour div:not(.no-highlight).active.old,.tempus-dominus-widget.light .time-container-minute .date-container-days div.range-end:not(.no-highlight).new,.tempus-dominus-widget.light .time-container-minute .date-container-days div.range-end:not(.no-highlight).old,.tempus-dominus-widget.light .time-container-minute .date-container-days div.range-in:not(.no-highlight).new,.tempus-dominus-widget.light .time-container-minute .date-container-days div.range-in:not(.no-highlight).old,.tempus-dominus-widget.light .time-container-minute .date-container-days div.range-start:not(.no-highlight).new,.tempus-dominus-widget.light .time-container-minute .date-container-days div.range-start:not(.no-highlight).old,.tempus-dominus-widget.light .time-container-minute div:not(.no-highlight).active.new,.tempus-dominus-widget.light .time-container-minute div:not(.no-highlight).active.old,.tempus-dominus-widget.light .time-container-second .date-container-days div.range-end:not(.no-highlight).new,.tempus-dominus-widget.light .time-container-second .date-container-days div.range-end:not(.no-highlight).old,.tempus-dominus-widget.light .time-container-second .date-container-days div.range-in:not(.no-highlight).new,.tempus-dominus-widget.light .time-container-second .date-container-days div.range-in:not(.no-highlight).old,.tempus-dominus-widget.light .time-container-second .date-container-days div.range-start:not(.no-highlight).new,.tempus-dominus-widget.light .time-container-second .date-container-days div.range-start:not(.no-highlight).old,.tempus-dominus-widget.light .time-container-second div:not(.no-highlight).active.new,.tempus-dominus-widget.light .time-container-second div:not(.no-highlight).active.old{color:var(--td-active-color)}.tempus-dominus-widget.light .date-container-days div.range-end:not(.no-highlight).today:before,.tempus-dominus-widget.light .date-container-days div.range-in:not(.no-highlight).today:before,.tempus-dominus-widget.light .date-container-days div.range-start:not(.no-highlight).today:before,.tempus-dominus-widget.light .date-container-days div:not(.no-highlight).active.today:before,.tempus-dominus-widget.light .date-container-decades div:not(.no-highlight).active.today:before,.tempus-dominus-widget.light .date-container-months div:not(.no-highlight).active.today:before,.tempus-dominus-widget.light .date-container-years div:not(.no-highlight).active.today:before,.tempus-dominus-widget.light .time-container-clock div:not(.no-highlight).active.today:before,.tempus-dominus-widget.light .time-container-hour div:not(.no-highlight).active.today:before,.tempus-dominus-widget.light .time-container-minute div:not(.no-highlight).active.today:before,.tempus-dominus-widget.light .time-container-second div:not(.no-highlight).active.today:before{border-bottom-color:var(--td-active-border-color)}.tempus-dominus-widget.light .date-container-days div:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-days div:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-decades div:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-decades div:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-months div:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-months div:not(.no-highlight).old,.tempus-dominus-widget.light .date-container-years div:not(.no-highlight).new,.tempus-dominus-widget.light .date-container-years div:not(.no-highlight).old,.tempus-dominus-widget.light .time-container-clock div:not(.no-highlight).new,.tempus-dominus-widget.light .time-container-clock div:not(.no-highlight).old,.tempus-dominus-widget.light .time-container-hour div:not(.no-highlight).new,.tempus-dominus-widget.light .time-container-hour div:not(.no-highlight).old,.tempus-dominus-widget.light .time-container-minute div:not(.no-highlight).new,.tempus-dominus-widget.light .time-container-minute div:not(.no-highlight).old,.tempus-dominus-widget.light .time-container-second div:not(.no-highlight).new,.tempus-dominus-widget.light .time-container-second div:not(.no-highlight).old{color:var(--td-alternate-color)}.tempus-dominus-widget.light .date-container-days div:not(.no-highlight).disabled,.tempus-dominus-widget.light .date-container-days div:not(.no-highlight).disabled:hover,.tempus-dominus-widget.light .date-container-decades div:not(.no-highlight).disabled,.tempus-dominus-widget.light .date-container-decades div:not(.no-highlight).disabled:hover,.tempus-dominus-widget.light .date-container-months div:not(.no-highlight).disabled,.tempus-dominus-widget.light .date-container-months div:not(.no-highlight).disabled:hover,.tempus-dominus-widget.light .date-container-years div:not(.no-highlight).disabled,.tempus-dominus-widget.light .date-container-years div:not(.no-highlight).disabled:hover,.tempus-dominus-widget.light .time-container-clock div:not(.no-highlight).disabled,.tempus-dominus-widget.light .time-container-clock div:not(.no-highlight).disabled:hover,.tempus-dominus-widget.light .time-container-hour div:not(.no-highlight).disabled,.tempus-dominus-widget.light .time-container-hour div:not(.no-highlight).disabled:hover,.tempus-dominus-widget.light .time-container-minute div:not(.no-highlight).disabled,.tempus-dominus-widget.light .time-container-minute div:not(.no-highlight).disabled:hover,.tempus-dominus-widget.light .time-container-second div:not(.no-highlight).disabled,.tempus-dominus-widget.light .time-container-second div:not(.no-highlight).disabled:hover{color:var(--td-disabled-color)}.tempus-dominus-widget.light .date-container-days div:not(.no-highlight).today:before,.tempus-dominus-widget.light .date-container-decades div:not(.no-highlight).today:before,.tempus-dominus-widget.light .date-container-months div:not(.no-highlight).today:before,.tempus-dominus-widget.light .date-container-years div:not(.no-highlight).today:before,.tempus-dominus-widget.light .time-container-clock div:not(.no-highlight).today:before,.tempus-dominus-widget.light .time-container-hour div:not(.no-highlight).today:before,.tempus-dominus-widget.light .time-container-minute div:not(.no-highlight).today:before,.tempus-dominus-widget.light .time-container-second div:not(.no-highlight).today:before{border-bottom-color:var(--td-active-bg);border-top-color:var(--td-secondary-border-color-rgba)}.tempus-dominus-widget.light button{background-color:var(--td-active-bg);border-color:var(--td-active-bg);color:var(--td-active-color)}.tempus-dominus-widget.dark{background-color:var(--td-dark-widget-background);color:var(--td-dark-font-color)}.tempus-dominus-widget.dark [data-action].disabled,.tempus-dominus-widget.dark [data-action].disabled:hover{color:var(--td-dark-disabled-color)}.tempus-dominus-widget.dark .toolbar div:hover{background:var(--td-dark-btn-hover-bg)}.tempus-dominus-widget.dark .date-container-days .dow{color:var(--td-dark-dow-color)}.tempus-dominus-widget.dark .date-container-days .range-in{background-color:var(--td-dark-range-bg)!important;box-shadow:-5px 0 0 var(--td-dark-range-bg),5px 0 0 var(--td-dark-range-bg)}.tempus-dominus-widget.dark .date-container-days .cw{color:var(--td-dark-alternate-color)}.tempus-dominus-widget.dark .date-container-days div:not(.no-highlight):hover,.tempus-dominus-widget.dark .date-container-decades div:not(.no-highlight):hover,.tempus-dominus-widget.dark .date-container-months div:not(.no-highlight):hover,.tempus-dominus-widget.dark .date-container-years div:not(.no-highlight):hover,.tempus-dominus-widget.dark .time-container-clock div:not(.no-highlight):hover,.tempus-dominus-widget.dark .time-container-hour div:not(.no-highlight):hover,.tempus-dominus-widget.dark .time-container-minute div:not(.no-highlight):hover,.tempus-dominus-widget.dark .time-container-second div:not(.no-highlight):hover{background:var(--td-dark-btn-hover-bg)}.tempus-dominus-widget.dark .date-container-days div.range-end:not(.no-highlight),.tempus-dominus-widget.dark .date-container-days div.range-in:not(.no-highlight),.tempus-dominus-widget.dark .date-container-days div.range-start:not(.no-highlight),.tempus-dominus-widget.dark .date-container-days div:not(.no-highlight).active,.tempus-dominus-widget.dark .date-container-decades div:not(.no-highlight).active,.tempus-dominus-widget.dark .date-container-months div:not(.no-highlight).active,.tempus-dominus-widget.dark .date-container-years div:not(.no-highlight).active,.tempus-dominus-widget.dark .time-container-clock div:not(.no-highlight).active,.tempus-dominus-widget.dark .time-container-hour div:not(.no-highlight).active,.tempus-dominus-widget.dark .time-container-minute div:not(.no-highlight).active,.tempus-dominus-widget.dark .time-container-second div:not(.no-highlight).active{background-color:var(--td-dark-active-bg);color:var(--td-dark-active-color);text-shadow:var(--td-dark-text-shadow)}.tempus-dominus-widget.dark .date-container-days .date-container-decades div.range-end:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .date-container-decades div.range-end:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .date-container-decades div.range-in:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .date-container-decades div.range-in:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .date-container-decades div.range-start:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .date-container-decades div.range-start:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .date-container-months div.range-end:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .date-container-months div.range-end:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .date-container-months div.range-in:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .date-container-months div.range-in:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .date-container-months div.range-start:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .date-container-months div.range-start:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .date-container-years div.range-end:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .date-container-years div.range-end:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .date-container-years div.range-in:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .date-container-years div.range-in:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .date-container-years div.range-start:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .date-container-years div.range-start:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .time-container-clock div.range-end:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .time-container-clock div.range-end:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .time-container-clock div.range-in:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .time-container-clock div.range-in:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .time-container-clock div.range-start:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .time-container-clock div.range-start:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .time-container-hour div.range-end:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .time-container-hour div.range-end:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .time-container-hour div.range-in:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .time-container-hour div.range-in:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .time-container-hour div.range-start:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .time-container-hour div.range-start:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .time-container-minute div.range-end:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .time-container-minute div.range-end:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .time-container-minute div.range-in:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .time-container-minute div.range-in:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .time-container-minute div.range-start:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .time-container-minute div.range-start:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .time-container-second div.range-end:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .time-container-second div.range-end:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .time-container-second div.range-in:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .time-container-second div.range-in:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days .time-container-second div.range-start:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days .time-container-second div.range-start:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days div.range-end:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days div.range-end:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days div.range-in:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days div.range-in:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days div.range-start:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days div.range-start:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-days div:not(.no-highlight).active.new,.tempus-dominus-widget.dark .date-container-days div:not(.no-highlight).active.old,.tempus-dominus-widget.dark .date-container-decades .date-container-days div.range-end:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-decades .date-container-days div.range-end:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-decades .date-container-days div.range-in:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-decades .date-container-days div.range-in:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-decades .date-container-days div.range-start:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-decades .date-container-days div.range-start:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-decades div:not(.no-highlight).active.new,.tempus-dominus-widget.dark .date-container-decades div:not(.no-highlight).active.old,.tempus-dominus-widget.dark .date-container-months .date-container-days div.range-end:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-months .date-container-days div.range-end:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-months .date-container-days div.range-in:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-months .date-container-days div.range-in:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-months .date-container-days div.range-start:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-months .date-container-days div.range-start:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-months div:not(.no-highlight).active.new,.tempus-dominus-widget.dark .date-container-months div:not(.no-highlight).active.old,.tempus-dominus-widget.dark .date-container-years .date-container-days div.range-end:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-years .date-container-days div.range-end:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-years .date-container-days div.range-in:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-years .date-container-days div.range-in:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-years .date-container-days div.range-start:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-years .date-container-days div.range-start:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-years div:not(.no-highlight).active.new,.tempus-dominus-widget.dark .date-container-years div:not(.no-highlight).active.old,.tempus-dominus-widget.dark .time-container-clock .date-container-days div.range-end:not(.no-highlight).new,.tempus-dominus-widget.dark .time-container-clock .date-container-days div.range-end:not(.no-highlight).old,.tempus-dominus-widget.dark .time-container-clock .date-container-days div.range-in:not(.no-highlight).new,.tempus-dominus-widget.dark .time-container-clock .date-container-days div.range-in:not(.no-highlight).old,.tempus-dominus-widget.dark .time-container-clock .date-container-days div.range-start:not(.no-highlight).new,.tempus-dominus-widget.dark .time-container-clock .date-container-days div.range-start:not(.no-highlight).old,.tempus-dominus-widget.dark .time-container-clock div:not(.no-highlight).active.new,.tempus-dominus-widget.dark .time-container-clock div:not(.no-highlight).active.old,.tempus-dominus-widget.dark .time-container-hour .date-container-days div.range-end:not(.no-highlight).new,.tempus-dominus-widget.dark .time-container-hour .date-container-days div.range-end:not(.no-highlight).old,.tempus-dominus-widget.dark .time-container-hour .date-container-days div.range-in:not(.no-highlight).new,.tempus-dominus-widget.dark .time-container-hour .date-container-days div.range-in:not(.no-highlight).old,.tempus-dominus-widget.dark .time-container-hour .date-container-days div.range-start:not(.no-highlight).new,.tempus-dominus-widget.dark .time-container-hour .date-container-days div.range-start:not(.no-highlight).old,.tempus-dominus-widget.dark .time-container-hour div:not(.no-highlight).active.new,.tempus-dominus-widget.dark .time-container-hour div:not(.no-highlight).active.old,.tempus-dominus-widget.dark .time-container-minute .date-container-days div.range-end:not(.no-highlight).new,.tempus-dominus-widget.dark .time-container-minute .date-container-days div.range-end:not(.no-highlight).old,.tempus-dominus-widget.dark .time-container-minute .date-container-days div.range-in:not(.no-highlight).new,.tempus-dominus-widget.dark .time-container-minute .date-container-days div.range-in:not(.no-highlight).old,.tempus-dominus-widget.dark .time-container-minute .date-container-days div.range-start:not(.no-highlight).new,.tempus-dominus-widget.dark .time-container-minute .date-container-days div.range-start:not(.no-highlight).old,.tempus-dominus-widget.dark .time-container-minute div:not(.no-highlight).active.new,.tempus-dominus-widget.dark .time-container-minute div:not(.no-highlight).active.old,.tempus-dominus-widget.dark .time-container-second .date-container-days div.range-end:not(.no-highlight).new,.tempus-dominus-widget.dark .time-container-second .date-container-days div.range-end:not(.no-highlight).old,.tempus-dominus-widget.dark .time-container-second .date-container-days div.range-in:not(.no-highlight).new,.tempus-dominus-widget.dark .time-container-second .date-container-days div.range-in:not(.no-highlight).old,.tempus-dominus-widget.dark .time-container-second .date-container-days div.range-start:not(.no-highlight).new,.tempus-dominus-widget.dark .time-container-second .date-container-days div.range-start:not(.no-highlight).old,.tempus-dominus-widget.dark .time-container-second div:not(.no-highlight).active.new,.tempus-dominus-widget.dark .time-container-second div:not(.no-highlight).active.old{color:var(--td-dark-active-color)}.tempus-dominus-widget.dark .date-container-days div.range-end:not(.no-highlight).today:before,.tempus-dominus-widget.dark .date-container-days div.range-in:not(.no-highlight).today:before,.tempus-dominus-widget.dark .date-container-days div.range-start:not(.no-highlight).today:before,.tempus-dominus-widget.dark .date-container-days div:not(.no-highlight).active.today:before,.tempus-dominus-widget.dark .date-container-decades div:not(.no-highlight).active.today:before,.tempus-dominus-widget.dark .date-container-months div:not(.no-highlight).active.today:before,.tempus-dominus-widget.dark .date-container-years div:not(.no-highlight).active.today:before,.tempus-dominus-widget.dark .time-container-clock div:not(.no-highlight).active.today:before,.tempus-dominus-widget.dark .time-container-hour div:not(.no-highlight).active.today:before,.tempus-dominus-widget.dark .time-container-minute div:not(.no-highlight).active.today:before,.tempus-dominus-widget.dark .time-container-second div:not(.no-highlight).active.today:before{border-bottom-color:var(--td-dark-active-border-color)}.tempus-dominus-widget.dark .date-container-days div:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-days div:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-decades div:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-decades div:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-months div:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-months div:not(.no-highlight).old,.tempus-dominus-widget.dark .date-container-years div:not(.no-highlight).new,.tempus-dominus-widget.dark .date-container-years div:not(.no-highlight).old,.tempus-dominus-widget.dark .time-container-clock div:not(.no-highlight).new,.tempus-dominus-widget.dark .time-container-clock div:not(.no-highlight).old,.tempus-dominus-widget.dark .time-container-hour div:not(.no-highlight).new,.tempus-dominus-widget.dark .time-container-hour div:not(.no-highlight).old,.tempus-dominus-widget.dark .time-container-minute div:not(.no-highlight).new,.tempus-dominus-widget.dark .time-container-minute div:not(.no-highlight).old,.tempus-dominus-widget.dark .time-container-second div:not(.no-highlight).new,.tempus-dominus-widget.dark .time-container-second div:not(.no-highlight).old{color:var(--td-dark-alternate-color)}.tempus-dominus-widget.dark .date-container-days div:not(.no-highlight).disabled,.tempus-dominus-widget.dark .date-container-days div:not(.no-highlight).disabled:hover,.tempus-dominus-widget.dark .date-container-decades div:not(.no-highlight).disabled,.tempus-dominus-widget.dark .date-container-decades div:not(.no-highlight).disabled:hover,.tempus-dominus-widget.dark .date-container-months div:not(.no-highlight).disabled,.tempus-dominus-widget.dark .date-container-months div:not(.no-highlight).disabled:hover,.tempus-dominus-widget.dark .date-container-years div:not(.no-highlight).disabled,.tempus-dominus-widget.dark .date-container-years div:not(.no-highlight).disabled:hover,.tempus-dominus-widget.dark .time-container-clock div:not(.no-highlight).disabled,.tempus-dominus-widget.dark .time-container-clock div:not(.no-highlight).disabled:hover,.tempus-dominus-widget.dark .time-container-hour div:not(.no-highlight).disabled,.tempus-dominus-widget.dark .time-container-hour div:not(.no-highlight).disabled:hover,.tempus-dominus-widget.dark .time-container-minute div:not(.no-highlight).disabled,.tempus-dominus-widget.dark .time-container-minute div:not(.no-highlight).disabled:hover,.tempus-dominus-widget.dark .time-container-second div:not(.no-highlight).disabled,.tempus-dominus-widget.dark .time-container-second div:not(.no-highlight).disabled:hover{color:var(--td-dark-disabled-color)}.tempus-dominus-widget.dark .date-container-days div:not(.no-highlight).today:before,.tempus-dominus-widget.dark .date-container-decades div:not(.no-highlight).today:before,.tempus-dominus-widget.dark .date-container-months div:not(.no-highlight).today:before,.tempus-dominus-widget.dark .date-container-years div:not(.no-highlight).today:before,.tempus-dominus-widget.dark .time-container-clock div:not(.no-highlight).today:before,.tempus-dominus-widget.dark .time-container-hour div:not(.no-highlight).today:before,.tempus-dominus-widget.dark .time-container-minute div:not(.no-highlight).today:before,.tempus-dominus-widget.dark .time-container-second div:not(.no-highlight).today:before{border-bottom-color:var(--td-dark-active-bg);border-top-color:var(--td-dark-secondary-border-color-rgba)}.tempus-dominus-widget.dark button{background-color:var(--td-dark-active-bg);border-color:var(--td-dark-active-bg);color:var(--td-dark-active-color)}


do we need all this? 😅

we need it for custom styling, but i moved it to a dedicated file so that it isn't included in the .min.css anymore.

janno42

UI works

janno42 · 2026-06-08T16:33:31Z

+.tempus-dominus-widget.timepicker-sbs .time-container .clock .hour,
+.tempus-dominus-widget.timepicker-sbs .time-container .clock .minute {


I can't find the .clock and .hour/.minute classes in the HTML. Is this part correct?
There is a .time-container-clock in .time-container though.

richardebeling · 2026-06-08T17:54:14Z

@@ -0,0 +1,14 @@
+<div class="input-group" id="datepicker1" data-td-target-input="nearest" data-td-target-toggle="nearest">


ids need to be unique in the full HTML document. This widget HTML snippet here may be used on one page multiple times, so we cannot put any ids in here.

Do we use this for anything? If not, let's just remove it. Otherwise, we have to use some other mechanism to identify these elements (probably classes)?

richardebeling · 2026-06-08T17:55:16Z

-    vote_end_date = forms.DateField(label=_("End of evaluation"), localize=True, required=False)
+    vote_start_datetime = forms.DateTimeField(
+        label=_("Start of evaluation"),
+        widget=forms.DateTimeInput(),


Is this necessary? I would have expected tht forms.DateTimeInput is the default widget for a forms.DateTimeField.

richardebeling · 2026-06-08T17:55:46Z

+
+    vote_end_date = forms.DateField(
+        label=_("End of evaluation"),
+        widget=forms.DateInput(attrs={"type": "date", "class": "form-control"}),


What do we need "type": "date" for here? Should it just be part of the default for the widget? (And I guess the same for "class": "form-control")

richardebeling · 2026-06-08T17:59:32Z

The contents of our two -init files looks like it's mostly the same. Could we just put handling for both components in one file (and reuse all code that is currently duplicated)?

I think chances are if we change one of these files, we want to change the other one as well

richardebeling · 2026-06-08T18:01:03Z

+declare global {
+    interface Window {
+        tempusDominus: any;
+    }
+}


The only purpose of this is to allow us to do window.tempusDominus? Is there an advantage of doing this over just doing (window as any).tempusDominus?

@niklasmohrin opinions on how to do this?

I would also just declare any wherever we use this

Copilot AI review requested due to automatic review settings January 12, 2026 20:03

Copilot started reviewing on behalf of HannesClausnitzer January 12, 2026 20:06 View session

HannesClausnitzer added 3 commits January 12, 2026 21:06

implement native datetime picker

982e7e3

changed more fields

96ef45f

remove unnecessary bootstrap-datetimepicker references

8eb3d24

HannesClausnitzer force-pushed the datetimepicker branch from a34421a to 8eb3d24 Compare January 12, 2026 20:06

Copilot AI reviewed Jan 12, 2026

View reviewed changes

Comment thread evap/contributor/forms.py Outdated

Comment thread evap/staff/templates/staff_semester_import.html

hansegucker requested changes Jan 12, 2026

View reviewed changes

Comment thread evap/contributor/forms.py Outdated

Comment thread evap/staff/templates/staff_semester_import.html

HannesClausnitzer and others added 3 commits January 12, 2026 21:20

fixed input field type

6439923

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>

bring back accidentally deleted js copy headers

79d0852

removed static files that are no longer needed

20219d4

richardebeling requested review from janno42, niklasmohrin and richardebeling January 12, 2026 20:37

niklasmohrin reviewed Jan 12, 2026

View reviewed changes

Comment thread evap/contributor/forms.py Outdated

remove bootstrap references

1552cdc

janno42 reviewed Jan 19, 2026

View reviewed changes

custom template for DateTimeInput

979ae27

include value in datetime template

f40355d

richardebeling marked this pull request as draft February 1, 2026 21:36

richardebeling removed their request for review February 1, 2026 21:36

HannesClausnitzer added 2 commits April 20, 2026 20:34

implement new datetimepicker

1f4a889

08:00 as default time

ae3619a

HannesClausnitzer marked this pull request as ready for review April 20, 2026 20:20

janno42 requested changes May 4, 2026

View reviewed changes

open picker on click

73f0337

HannesClausnitzer added 5 commits May 4, 2026 21:59

rewrite in typescript

1c4eb9d

fix stuff

e49ebf5

improvements

b99dbc9

more improvements

98ca7b0

implement correct import syntax

b01f1e2

janno42 reviewed Jun 8, 2026

View reviewed changes

janno42 requested review from niklasmohrin and richardebeling June 8, 2026 16:41

richardebeling reviewed Jun 8, 2026

View reviewed changes

niklasmohrin removed their request for review June 24, 2026 22:41

		.tempus-dominus-widget.timepicker-sbs .time-container .clock .hour,
		.tempus-dominus-widget.timepicker-sbs .time-container .clock .minute {

		@@ -0,0 +1,14 @@
		<div class="input-group" id="datepicker1" data-td-target-input="nearest" data-td-target-toggle="nearest">

Uh oh!

Conversation

HannesClausnitzer commented Jan 12, 2026

Uh oh!

Copilot AI left a comment

Choose a reason for hiding this comment

Pull request overview

Reviewed changes

Uh oh!

Uh oh!

Uh oh!

hansegucker left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

niklasmohrin commented Jan 12, 2026

Uh oh!

niklasmohrin left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

janno42 left a comment

Choose a reason for hiding this comment

Uh oh!

HannesClausnitzer commented Jan 19, 2026

Uh oh!

richardebeling commented Feb 1, 2026

Uh oh!

niklasmohrin commented Feb 1, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

janno42 left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Uh oh!

janno42 left a comment

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Milestone

Development

Uh oh!

6 participants

niklasmohrin commented Feb 1, 2026 •

edited

Loading