replace calendar event emoji marker

docs/releases/unreleased.md

@@ -136,6 +136,7 @@ Example:
 ## Fixed
 
 - Fixed Calendar timeblocks created from a selected time range so they appear as soon as Obsidian indexes the daily note update, instead of waiting for a later refresh.
+- Replaced the external calendar event emoji marker with the calendar icon and kept it in the same top-right event corner.
 - (#263) Made the instant inline task conversion button respond to touch/pointer activation, so mobile multi-line selections can be converted into TaskNotes. Thanks to @cathywu for reporting this.
 - (#216) Preserved `@context` markers when converting Tasks-plugin-style checkbox tasks into TaskNotes, while keeping those contexts out of the created task title. Thanks to @ksdavidc for suggesting this, and to @hangryscribe3, @nayatiuh, and @natleahh for the follow-up feedback.
 - (#508) Showed project note names instead of full project paths in grouped Kanban and Task List headings, while keeping the headings linked to the project note. Thanks to @elvarb for reporting this and @dmodify for confirming it in Task List.

src/bases/TaskListView.ts

@@ -1911,6 +1911,7 @@ export class TaskListView extends BasesViewBase {
 		// Add toggle button
 		const toggleBtn = doc.createElement("button");
 		toggleBtn.className = "task-group-toggle";
+		toggleBtn.type = "button";
 		toggleBtn.setAttribute("aria-label", "Toggle group");
 		toggleBtn.setAttribute("aria-expanded", String(!headerItem.isCollapsed));
 		toggleBtn.dataset.groupKey = groupHeader.dataset.groupKey!;

src/bases/helpers.ts

@@ -724,6 +724,7 @@ export async function renderGroupedTasksInBasesView(
 		// Add toggle button (chevron)
 		const toggleBtn = doc.createElement("button");
 		toggleBtn.className = "task-group-toggle";
+		toggleBtn.type = "button";
 		toggleBtn.setAttribute("aria-label", "Toggle group");
 		toggleBtn.setAttribute("aria-expanded", "true");
 		headerElement.appendChild(toggleBtn);

src/modals/taskEditCompletions.ts

@@ -1,3 +1,4 @@
+import { setIcon } from "obsidian";
 import TaskNotesPlugin from "../main";
 import { TaskInfo } from "../types";
 import {
@@ -67,16 +68,24 @@ function renderCalendarMonth(
 	const header = container.createDiv("recurring-calendar__header");
 	const prevButton = header.createEl("button", {
 		cls: "recurring-calendar__nav",
-		text: "<",
+		attr: {
+			type: "button",
+			"aria-label": "Previous month",
+		},
 	});
+	setIcon(prevButton, "chevron-left");
 	const monthLabel = header.createSpan("recurring-calendar__month");
 	const locale = options.plugin.i18n.getCurrentLocale() || "en";
 	const monthFormatter = new Intl.DateTimeFormat(locale, { month: "short", year: "numeric" });
 	monthLabel.textContent = monthFormatter.format(displayDate);
 	const nextButton = header.createEl("button", {
 		cls: "recurring-calendar__nav",
-		text: ">",
+		attr: {
+			type: "button",
+			"aria-label": "Next month",
+		},
 	});
+	setIcon(nextButton, "chevron-right");
 
 	const grid = container.createDiv("recurring-calendar__grid");
 	const monthStart = getUTCStartOfMonth(displayDate);

styles/bases-views.css

@@ -102,19 +102,31 @@
 
 /* Toggle button for groups */
 .tn-bases-tasknotes-list .task-group-toggle {
+    appearance: none;
     display: flex;
     align-items: center;
     justify-content: center;
     width: 20px;
     height: 20px;
+    min-width: 20px;
+    min-height: 20px;
+    margin: 0;
+    padding: 0;
     flex-shrink: 0;
-    border: none;
+    border: 0;
+    border-radius: var(--tn-radius-sm);
+    box-shadow: none;
     background: transparent;
-    color: var(--tn-text-normal);
+    color: var(--tn-text-muted);
     font-size: 14px;
     line-height: 1;
     cursor: var(--cursor-link, pointer);
-    padding: 0;
+}
+
+.tn-bases-tasknotes-list .task-group-toggle:hover,
+.tn-bases-tasknotes-list .task-group-toggle:focus-visible {
+    background: var(--background-modifier-hover);
+    color: var(--tn-text-normal);
 }
 
 /* Default expanded state - chevron pointing down */

styles/task-list-view.css

@@ -141,11 +141,35 @@
 /* Chevron/toggle styles (match preview-all) */
 .tasknotes-plugin .task-group-header { cursor: var(--cursor-link, pointer); }
 .task-group-header { display: flex; align-items: center; justify-content: flex-start; gap: var(--tn-spacing-xs); }
-.tasknotes-plugin .task-group-toggle svg,  .task-group-toggle .chevron, .task-group-toggle .chevron path { color: var(--tn-text-normal); }
+.tasknotes-plugin .task-group-toggle svg,  .task-group-toggle .chevron, .task-group-toggle .chevron path { color: currentColor; }
 .tasknotes-plugin .task-group-toggle svg,  .task-group-toggle .chevron path { stroke: currentColor; }
 .tasknotes-plugin .task-group.is-collapsed .task-group-toggle svg,
 .tasknotes-plugin .task-group.is-collapsed .task-group-toggle .chevron { transform: rotate(0deg); }
-.tasknotes-plugin .task-group-toggle { display: inline-flex; align-items: center; justify-content: center; width: 20px; height: 20px; margin-right: var(--tn-spacing-xs); border: none; background: transparent; color: var(--tn-text-normal); font-size: 14px; line-height: 1; }
+.tasknotes-plugin .task-group-toggle {
+    appearance: none;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    width: 20px;
+    height: 20px;
+    min-width: 20px;
+    min-height: 20px;
+    margin: 0 var(--tn-spacing-xs) 0 0;
+    padding: 0;
+    border: 0;
+    border-radius: var(--tn-radius-sm);
+    box-shadow: none;
+    background: transparent;
+    color: var(--tn-text-muted);
+    font-size: 14px;
+    line-height: 1;
+    cursor: var(--cursor-link, pointer);
+}
+.tasknotes-plugin .task-group-toggle:hover,
+.tasknotes-plugin .task-group-toggle:focus-visible {
+    background: var(--background-modifier-hover);
+    color: var(--tn-text-normal);
+}
 .tasknotes-plugin .task-group-toggle .chevron { transition: transform var(--tn-transition-fast); }
 .tasknotes-plugin .task-group .task-group-toggle .chevron,
 .tasknotes-plugin .task-group .task-group-toggle svg { transform: rotate(90deg); }

styles/task-modal.css

@@ -1122,19 +1122,38 @@ body.is-mobile .tasknotes-plugin.minimalist-task-modal.expanded .modal-button-co
 }
 
 .tasknotes-plugin .recurring-calendar__nav {
-    border: none;
+    appearance: none;
+    display: inline-flex;
+    align-items: center;
+    justify-content: center;
+    width: 20px;
+    height: 20px;
+    min-width: 20px;
+    min-height: 20px;
+    margin: 0;
+    padding: 0;
+    border: 0;
+    border-radius: var(--radius-s);
+    box-shadow: none;
     background: transparent;
     color: var(--text-muted);
     cursor: var(--cursor-link, pointer);
-    font-size: 14px;
-    padding: 2px 4px;
-    transition: color 0.1s ease;
+    line-height: 1;
+    transition: background-color 0.1s ease, color 0.1s ease;
 }
 
-.tasknotes-plugin .recurring-calendar__nav:hover {
+.tasknotes-plugin .recurring-calendar__nav:hover,
+.tasknotes-plugin .recurring-calendar__nav:focus-visible {
+    background: var(--background-modifier-hover);
     color: var(--text-normal);
 }
 
+.tasknotes-plugin .recurring-calendar__nav svg {
+    width: 16px;
+    height: 16px;
+    stroke: currentColor;
+}
+
 .tasknotes-plugin .recurring-calendar__month {
     font-size: var(--font-ui-small);
     color: var(--text-normal);