From 075f5b738ad95cef831b681d092458213505cf0f Mon Sep 17 00:00:00 2001 From: noctildon Date: Tue, 25 Nov 2025 15:08:47 -0600 Subject: [PATCH 1/3] mark today in minicalendar --- src/bases/MiniCalendarView.ts | 6 +++--- styles/calendar-view.css | 15 ++++++++------- 2 files changed, 11 insertions(+), 10 deletions(-) diff --git a/src/bases/MiniCalendarView.ts b/src/bases/MiniCalendarView.ts index 32ac25a2..a66852c2 100644 --- a/src/bases/MiniCalendarView.ts +++ b/src/bases/MiniCalendarView.ts @@ -555,11 +555,11 @@ export class MiniCalendarView extends BasesViewBase { const today = createUTCDateFromLocalCalendarDate(todayLocal); const isToday = isSameDay(dayDate, today); - const isSelected = isSameDay(dayDate, this.selectedDate); + // const isSelected = isSameDay(dayDate, this.selectedDate); let classNames = "mini-calendar-view__day"; if (isToday) classNames += " mini-calendar-view__day--today"; - if (isSelected) classNames += " mini-calendar-view__day--selected"; + // if (isSelected) classNames += " mini-calendar-view__day--selected"; if (isOutsideMonth) classNames += " mini-calendar-view__day--outside-month"; const dayEl = weekRow.createDiv({ @@ -568,7 +568,7 @@ export class MiniCalendarView extends BasesViewBase { attr: { role: "gridcell", "aria-label": format(convertUTCToLocalCalendarDate(dayDate), "EEEE, MMMM d, yyyy") + (isToday ? " (Today)" : ""), - "aria-selected": isSelected ? "true" : "false", + // "aria-selected": isSelected ? "true" : "false", "aria-current": isToday ? "date" : null, }, }); diff --git a/styles/calendar-view.css b/styles/calendar-view.css index e9086229..2e5bb1a1 100644 --- a/styles/calendar-view.css +++ b/styles/calendar-view.css @@ -709,6 +709,7 @@ .tasknotes-plugin .mini-calendar-view__day--today { background: none !important; + border: 1px solid var(--tn-interactive-accent) !important; color: var(--tn-text-on-accent); } @@ -789,19 +790,19 @@ padding: var(--tn-spacing-xs); gap: var(--tn-spacing-xs); } - + .tasknotes-plugin .calendar-view__controls, .tasknotes-plugin .mini-calendar-view__controls { padding: var(--tn-spacing-xs); } - + .tasknotes-plugin .calendar-view__nav-button, .tasknotes-plugin .mini-calendar-view__nav-button { width: 28px; height: 28px; font-size: 14px; } - + .tasknotes-plugin .calendar-view__day, .tasknotes-plugin .mini-calendar-view__day { min-height: 1.8rem; @@ -816,24 +817,24 @@ gap: var(--tn-spacing-sm); align-items: stretch; } - + .tasknotes-plugin .calendar-view__navigation, .tasknotes-plugin .mini-calendar-view__navigation { justify-content: center; } - + .tasknotes-plugin .calendar-view__month-display, .tasknotes-plugin .mini-calendar-view__month-display { font-size: var(--tn-font-size-md); min-width: auto; } - + .tasknotes-plugin .calendar-view__day, .tasknotes-plugin .mini-calendar-view__day { min-height: 1.5rem; padding: var(--tn-spacing-xs); } - + .tasknotes-plugin .calendar-view__content-indicator, .tasknotes-plugin .mini-calendar-view__content-indicator { width: 6px; From 7fd2ca42a28260075b491d877c6d325eab3859ea Mon Sep 17 00:00:00 2001 From: noctildon Date: Tue, 25 Nov 2025 15:55:08 -0600 Subject: [PATCH 2/3] highlight the selected date --- src/bases/MiniCalendarView.ts | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/src/bases/MiniCalendarView.ts b/src/bases/MiniCalendarView.ts index a66852c2..32ac25a2 100644 --- a/src/bases/MiniCalendarView.ts +++ b/src/bases/MiniCalendarView.ts @@ -555,11 +555,11 @@ export class MiniCalendarView extends BasesViewBase { const today = createUTCDateFromLocalCalendarDate(todayLocal); const isToday = isSameDay(dayDate, today); - // const isSelected = isSameDay(dayDate, this.selectedDate); + const isSelected = isSameDay(dayDate, this.selectedDate); let classNames = "mini-calendar-view__day"; if (isToday) classNames += " mini-calendar-view__day--today"; - // if (isSelected) classNames += " mini-calendar-view__day--selected"; + if (isSelected) classNames += " mini-calendar-view__day--selected"; if (isOutsideMonth) classNames += " mini-calendar-view__day--outside-month"; const dayEl = weekRow.createDiv({ @@ -568,7 +568,7 @@ export class MiniCalendarView extends BasesViewBase { attr: { role: "gridcell", "aria-label": format(convertUTCToLocalCalendarDate(dayDate), "EEEE, MMMM d, yyyy") + (isToday ? " (Today)" : ""), - // "aria-selected": isSelected ? "true" : "false", + "aria-selected": isSelected ? "true" : "false", "aria-current": isToday ? "date" : null, }, }); From f1b7e1b8989318f17dfab91ea4e6280252123f0a Mon Sep 17 00:00:00 2001 From: noctildon Date: Tue, 25 Nov 2025 16:08:49 -0600 Subject: [PATCH 3/3] differentiate the styles between today and selected date --- styles/calendar-view.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/styles/calendar-view.css b/styles/calendar-view.css index 2e5bb1a1..a9067354 100644 --- a/styles/calendar-view.css +++ b/styles/calendar-view.css @@ -709,7 +709,7 @@ .tasknotes-plugin .mini-calendar-view__day--today { background: none !important; - border: 1px solid var(--tn-interactive-accent) !important; + border: 2px solid var(--tn-color-info) !important; color: var(--tn-text-on-accent); }