danvics/openreader
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

style(ui): update aria-labels for clarity and consistency in sidebar controls

Browse source 
Standardize aria-labels in DocumentHeaderMenu and ReaderSidebarShell to use
"Hide" and "Close" phrasing for improved accessibility and user experience.
This commit is contained in:
Richard R 2026-05-04 15:23:48 -06:00
parent 71e1472650
commit 62103ea752
2 changed files with 5 additions and 5 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
src/components/documents/DocumentHeaderMenu.tsx
View file

@ -54,7 +54,7 @@ export function DocumentHeaderMenu({
? 'border-accent text-accent bg-offbase'
: 'border-offbase text-foreground hover:bg-offbase hover:text-accent'
}`}
aria-label={isSegmentsOpen ? 'Close segments sidebar' : 'Open segments sidebar'}
aria-label={isSegmentsOpen ? 'Hide segments sidebar' : 'Open segments sidebar'}
title={isSegmentsOpen ? 'Hide Segments' : 'Segments'}
>
<ListIcon className="w-4 h-4 transform transition-transform duration-200 ease-in-out hover:scale-[1.09]" />
@ -68,7 +68,7 @@ export function DocumentHeaderMenu({
? 'border-accent text-accent bg-offbase'
: 'border-offbase text-foreground hover:bg-offbase hover:text-accent'
}`}
aria-label={isAudiobookOpen ? 'Close audiobook export' : 'Open audiobook export'}
aria-label={isAudiobookOpen ? 'Hide audiobook export' : 'Open audiobook export'}
title={isAudiobookOpen ? 'Hide Export Audiobook' : 'Export Audiobook'}
>
<DownloadIcon className="w-4 h-4 transform transition-transform duration-200 ease-in-out hover:scale-[1.09]" />
@ -81,7 +81,7 @@ export function DocumentHeaderMenu({
? 'border-accent text-accent bg-offbase'
: 'border-offbase text-foreground hover:bg-offbase hover:text-accent'
}`}
aria-label={isSettingsOpen ? 'Close settings' : 'Open settings'}
aria-label={isSettingsOpen ? 'Hide settings' : 'Open settings'}
title={isSettingsOpen ? 'Hide Settings' : 'Settings'}
>
<FileSettingsIcon className="w-4 h-4 transform transition-transform duration-200 ease-in-out hover:scale-[1.09]" />

4
src/components/reader/ReaderSidebarShell.tsx
View file

@ -47,7 +47,7 @@ export function ReaderSidebarShell({
>
<button
type="button"
aria-label={`Close ${title.toLowerCase()}`}
aria-label="Close"
onClick={onClose}
className="sm:hidden absolute inset-0 overlay-dim backdrop-blur-sm pointer-events-auto"
/>
@ -76,7 +76,7 @@ export function ReaderSidebarShell({
<button
type="button"
onClick={onClose}
aria-label={`Close ${title.toLowerCase()}`}
aria-label="Close"
title="Close"
className="inline-flex items-center justify-center w-8 h-8 rounded-lg border border-offbase bg-base text-muted hover:bg-offbase hover:text-accent transition-colors"
>