Elgato_dark/docs
1
0
Fork 0
mirror of https://github.com/suitenumerique/docs synced 2026-04-21 13:37:20 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 8

♿️(frontend) add aria-hidden to decorative icons in dropdown menu

Browse source 
Mark decorative SVG icons with aria-hidden.
This commit is contained in:
Cyril 2026-03-20 12:14:55 +01:00
parent 525d8c8417
commit b8e1d12aea
No known key found for this signature in database
GPG key ID: D5E8474B0AB0064A
4 changed files with 18 additions and 18 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

1
CHANGELOG.md
View file

@ -15,6 +15,7 @@ and this project adheres to
- 💄(frontend) improve comments highlights #1961
- ♿️(frontend) improve BoxButton a11y and native button semantics #2103
- ♿️(frontend) improve language picker accessibility #2069
- ♿️(frontend) add aria-hidden to decorative icons in dropdown menu #2093
### Fixed

1
src/frontend/apps/impress/src/components/dropdown-menu/DropdownMenu.tsx
View file

@ -275,7 +275,6 @@ export const DropdownMenu = ({
<Box
$theme="neutral"
$variation={isDisabled ? 'tertiary' : 'primary'}
aria-hidden="true"
>
{option.icon}
</Box>

22
src/frontend/apps/impress/src/features/docs/doc-header/components/DocToolBox.tsx
View file

@ -118,13 +118,13 @@ export const DocToolBox = ({ doc }: DocToolBoxProps) => {
const options: DropdownMenuOption[] = [
{
label: t('Share'),
icon: <GroupSVG width={24} height={24} />,
icon: <GroupSVG width={24} height={24} aria-hidden="true" />,
callback: modalShare.open,
show: isSmallMobile,
},
{
label: t('Export'),
icon: <DownloadSVG width={24} height={24} />,
icon: <DownloadSVG width={24} height={24} aria-hidden="true" />,
callback: () => {
setIsModalExportOpen(true);
},
@ -133,9 +133,9 @@ export const DocToolBox = ({ doc }: DocToolBoxProps) => {
{
label: doc.is_favorite ? t('Unpin') : t('Pin'),
icon: doc.is_favorite ? (
<KeepOffSVG width={24} height={24} />
<KeepOffSVG width={24} height={24} aria-hidden="true" />
) : (
<KeepSVG width={24} height={24} />
<KeepSVG width={24} height={24} aria-hidden="true" />
),
callback: () => {
if (doc.is_favorite) {
@ -148,7 +148,7 @@ export const DocToolBox = ({ doc }: DocToolBoxProps) => {
},
{
label: t('Version history'),
icon: <HistorySVG width={24} height={24} />,
icon: <HistorySVG width={24} height={24} aria-hidden="true" />,
disabled: !doc.abilities.versions_list,
callback: () => {
selectHistoryModal.open();
@ -158,7 +158,7 @@ export const DocToolBox = ({ doc }: DocToolBoxProps) => {
},
{
label: t('Remove emoji'),
icon: <RemoveEmojiSVG width={24} height={24} />,
icon: <RemoveEmojiSVG width={24} height={24} aria-hidden="true" />,
callback: () => {
updateDocEmoji(doc.id, doc.title ?? '', '');
},
@ -167,7 +167,7 @@ export const DocToolBox = ({ doc }: DocToolBoxProps) => {
},
{
label: t('Add emoji'),
icon: <AddEmojiSVG width={24} height={24} />,
icon: <AddEmojiSVG width={24} height={24} aria-hidden="true" />,
callback: () => {
updateDocEmoji(doc.id, doc.title ?? '', '📄');
},
@ -176,12 +176,12 @@ export const DocToolBox = ({ doc }: DocToolBoxProps) => {
},
{
label: t('Copy link'),
icon: <AddLinkSVG width={24} height={24} />,
icon: <AddLinkSVG width={24} height={24} aria-hidden="true" />,
callback: copyDocLink,
},
{
label: t('Copy as {{format}}', { format: 'Markdown' }),
icon: <MarkdownCopySVG width={24} height={24} />,
icon: <MarkdownCopySVG width={24} height={24} aria-hidden="true" />,
callback: () => {
void copyCurrentEditorToClipboard('markdown');
},
@ -189,7 +189,7 @@ export const DocToolBox = ({ doc }: DocToolBoxProps) => {
},
{
label: t('Duplicate'),
icon: <ContentCopySVG width={24} height={24} />,
icon: <ContentCopySVG width={24} height={24} aria-hidden="true" />,
disabled: !doc.abilities.duplicate,
callback: () => {
duplicateDoc({
@ -202,7 +202,7 @@ export const DocToolBox = ({ doc }: DocToolBoxProps) => {
},
{
label: isChild ? t('Delete sub-document') : t('Delete document'),
icon: <DeleteSVG width={24} height={24} />,
icon: <DeleteSVG width={24} height={24} aria-hidden="true" />,
disabled: !doc.abilities.destroy,
callback: () => {
setIsModalRemoveOpen(true);

12
src/frontend/apps/impress/src/features/docs/docs-grid/components/DocsGridActions.tsx
View file

@ -72,9 +72,9 @@ export const DocsGridActions = ({ doc }: DocsGridActionsProps) => {
{
label: doc.is_favorite ? t('Unpin') : t('Pin'),
icon: doc.is_favorite ? (
<KeepOffSVG width={24} height={24} />
<KeepOffSVG width={24} height={24} aria-hidden="true" />
) : (
<KeepSVG width={24} height={24} />
<KeepSVG width={24} height={24} aria-hidden="true" />
),
callback: () => {
if (doc.is_favorite) {
@ -88,7 +88,7 @@ export const DocsGridActions = ({ doc }: DocsGridActionsProps) => {
},
{
label: t('Share'),
icon: <GroupSVG width={24} height={24} />,
icon: <GroupSVG width={24} height={24} aria-hidden="true" />,
callback: () => {
shareModal.open();
},
@ -97,7 +97,7 @@ export const DocsGridActions = ({ doc }: DocsGridActionsProps) => {
},
{
label: t('Move into a doc'),
icon: <DocMoveInSVG width={24} height={24} />,
icon: <DocMoveInSVG width={24} height={24} aria-hidden="true" />,
callback: () => {
importModal.open();
},
@ -106,7 +106,7 @@ export const DocsGridActions = ({ doc }: DocsGridActionsProps) => {
},
{
label: t('Duplicate'),
icon: <ContentCopySVG width={24} height={24} />,
icon: <ContentCopySVG width={24} height={24} aria-hidden="true" />,
disabled: !doc.abilities.duplicate,
callback: () => {
duplicateDoc({
@ -119,7 +119,7 @@ export const DocsGridActions = ({ doc }: DocsGridActionsProps) => {
},
{
label: t('Delete'),
icon: <DeleteSVG width={24} height={24} />,
icon: <DeleteSVG width={24} height={24} aria-hidden="true" />,
callback: () => deleteModal.open(),
disabled: !doc.abilities.destroy,
testId: `docs-grid-actions-remove-${doc.id}`,