feat: Calendar Layout and Function Update

This commit is contained in:
Semir 2025-06-06 10:43:25 +02:00 committed by Dominik Stahl
parent 675a5fa5ff
commit 04b1b80e53
6 changed files with 1170 additions and 130 deletions

View file

@ -13,8 +13,7 @@
font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
/* Style für den Bereich, in dem die Ansichten (Month, Week, etc.) gewechselt werden */
.custom-toolbar .view-change .view-switcher {
/*.custom-toolbar .view-change .view-switcher {
display: flex;
gap: 8px;
justify-content: center;
@ -24,7 +23,7 @@
padding: 8px 16px;
background-color: #c1830d;
/*border: 1px solid #ccc;*/
border-radius: 11px;
/* border-radius: 11px;
font-size: 12px;
cursor: pointer;
transition: background-color 0.2s, border-color 0.2s;
@ -42,7 +41,7 @@
background-color: #d0d0d0;
border-color: #aaa;
cursor: default;
}
}*/
/* Anzeige des aktuellen Datums (Monat und Jahr) */
.custom-toolbar .current-date {
@ -50,7 +49,7 @@
font-size: 12px;
text-align: center;
color: #ffffff;
margin: 4px 0;
/*margin: 4px 0;*/
background-color: #717171;
width: 178px;
height: 37px;
@ -110,30 +109,53 @@
}
.right-section {
background-color: #717171;
width: 393px;
height: 37px;
border-radius: 11px;
background-color: #717171;
width: 393px;
height: 48px;
border-radius: 11px;
justify-items: center;
align-items: center;
}
.custom-toolbar .navigation-controls .handleWeek button {
background-color: #717171;
height: 30px;
width: 30px;
margin-bottom: 3.5px;
background-color: #717171;
height: 30px;
width: 30px;
margin-bottom: 3.5px;
}
.custom-toolbar .navigation-controls .today button {
background-color: #c6c6c6;
height: 30px;
width: 100px;
color: #000000;
margin-top: 3.5px;
}
/*.custom-toolbar .navigation-controls .today button {
background-color: #c6c6c6;
height: 30px;
width: 100px;
color: #000000;
margin-top: 3.5px;
}*/
.view-change {
background-color: #717171;
height: 37px;
width: 290px;
border-radius: 11px;
background-color: #717171;
height: 48px;
width: 323px;
border-radius: 11px;
justify-items: center;
}
.right-section .datepicker-box {
color: #000000;
background-color: #c6c6c6;
height: 36px;
width: 85px;
border-radius: 11px;
font-size: 12px;
align-self: center;
}
.datepicker {
text-align: center;
width: 85px;
height: 30px;
}
.datepicker-box {
z-index: 9999;
}