frontend: fix active day and next pred buttons on calendar

This commit is contained in:
OleSTEEP 2025-10-16 19:59:23 +03:00
parent b22c2875c7
commit 41be12050d

View file

@ -7,7 +7,6 @@
let now = new Date();
let year = now.getFullYear(); // this is the month & year displayed
let month = now.getMonth();
let current = now.getDate();
var days: Array<Object> = []; // The days to display in each box
$: month,year,initContent();
@ -65,6 +64,14 @@
let selected: Object;
function isCurrent(date: Date) {
if (now.getDate() == date.getDate() &&
now.getMonth() == date.getMonth() &&
now.getFullYear() == date.getFullYear())
return true;
return false;
}
function set_day(day: Object) {
selected = day;
return null;
@ -74,8 +81,8 @@
<div class="calendar input rounded">
<div class="month">
<ul>
<button class="prev" onclick={prev()}>&#10094;</button>
<button class="next" onclick={next()}>&#10095;</button>
<button class="prev" onclick={() => prev()}>&#10094;</button>
<button class="next" onclick={() => next()}>&#10095;</button>
<li>{monthNames[month]} {year}</li>
</ul>
</div>
@ -88,9 +95,9 @@
{#each days as day}
<li>
{#if selected == day}
<button class="active {day.name == current ? "current":""}">{day.name}</button>
<button class="active {isCurrent(day.date) ? "current":""}">{day.name}</button>
{:else}
<button class="nonactive {day.name == current ? "current":""}" onclick={set_day(day)}>{day.name}</button>
<button class="nonactive {isCurrent(day.date) ? "current":""}" onclick={set_day(day)}>{day.name}</button>
{/if}
</li>
{/each}
@ -115,14 +122,18 @@
}
.month ul {
padding: 0;
margin: 0;
padding: 0.5rem;
}
.month ul li {
display: inline;
text-transform: uppercase;
letter-spacing: 3px;
padding: 0.5rem;
}
.month ul button {
padding: 0.5rem;
}
.month .prev {