From 656bdeeb6d6643df45fe2db620f7f5d651d85774 Mon Sep 17 00:00:00 2001
From: G30 <50341825+silentoplayz@users.noreply.github.com>
Date: Sat, 24 Oct 2026 23:40:30 -0400
Subject: [PATCH] fix(a11y): the Note Menu and Delete buttons in the Notes list
 and grid are 24 pixels square when Accessibility Mode is on (#33141)

---
 src/lib/components/notes/Notes.svelte | 28 ++++++++++++++++++++++-----
 1 file changed, 23 insertions(+), 5 deletions(-)

diff --git a/src/lib/components/notes/Notes.svelte b/src/lib/components/notes/Notes.svelte
index 101acf4116..cfc3997ff7 100644
--- a/src/lib/components/notes/Notes.svelte
+++ b/src/lib/components/notes/Notes.svelte
@@ -19,7 +19,15 @@
 	const i18n = getContext<typeof import('$lib/i18n').default>('i18n');
 
 	import { goto } from '$app/navigation';
-	import { WEBUI_NAME, config, user, pinnedNotes, mobile, showSidebar } from '$lib/stores';
+	import {
+		WEBUI_NAME,
+		config,
+		user,
+		pinnedNotes,
+		mobile,
+		showSidebar,
+		settings
+	} from '$lib/stores';
 	import {
 		createNewNote,
 		deleteNoteById,
@@ -669,7 +677,9 @@
 													{#if shiftKey}
 														<Tooltip content={$i18n.t('Delete')}>
 															<button
-																class="flex size-5 shrink-0 items-center justify-center rounded-lg text-gray-400 transition hover:text-gray-700 dark:text-gray-500 dark:hover:text-gray-200"
+																class="flex {($settings?.highContrastMode ?? false)
+																	? 'size-6'
+																	: 'size-5'} shrink-0 items-center justify-center rounded-lg text-gray-400 transition hover:text-gray-700 dark:text-gray-500 dark:hover:text-gray-200"
 																type="button"
 																aria-label={$i18n.t('Delete')}
 																on:click={(e) => {
@@ -721,7 +731,9 @@
 															}}
 														>
 															<button
-																class="flex size-5 shrink-0 items-center justify-center rounded-lg text-gray-400 transition hover:text-gray-700 dark:text-gray-500 dark:hover:text-gray-200"
+																class="flex {($settings?.highContrastMode ?? false)
+																	? 'size-6'
+																	: 'size-5'} shrink-0 items-center justify-center rounded-lg text-gray-400 transition hover:text-gray-700 dark:text-gray-500 dark:hover:text-gray-200"
 																type="button"
 																aria-label={$i18n.t('Note Menu')}
 																on:click={(e) => {
@@ -762,7 +774,10 @@
 													{#if shiftKey}
 														<Tooltip content={$i18n.t('Delete')}>
 															<button
-																class="absolute right-1 top-1 flex size-5 shrink-0 items-center justify-center rounded text-gray-400 transition hover:bg-gray-50/40 hover:text-gray-600 dark:text-gray-500 dark:hover:bg-white/4 dark:hover:text-gray-400"
+																class="absolute right-1 top-1 flex {($settings?.highContrastMode ??
+																false)
+																	? 'size-6'
+																	: 'size-5'} shrink-0 items-center justify-center rounded text-gray-400 transition hover:bg-gray-50/40 hover:text-gray-600 dark:text-gray-500 dark:hover:bg-white/4 dark:hover:text-gray-400"
 																type="button"
 																aria-label={$i18n.t('Delete')}
 																on:click={(e) => {
@@ -810,7 +825,10 @@
 															}}
 														>
 															<button
-																class="absolute right-1 top-1 flex size-5 shrink-0 items-center justify-center rounded text-gray-400 transition hover:bg-gray-50/40 hover:text-gray-600 dark:text-gray-500 dark:hover:bg-white/4 dark:hover:text-gray-400"
+																class="absolute right-1 top-1 flex {($settings?.highContrastMode ??
+																false)
+																	? 'size-6'
+																	: 'size-5'} shrink-0 items-center justify-center rounded text-gray-400 transition hover:bg-gray-50/40 hover:text-gray-600 dark:text-gray-500 dark:hover:bg-white/4 dark:hover:text-gray-400"
 																type="button"
 																aria-label={$i18n.t('Note Menu')}
 															>