Add Tab Indexing

Added tabIndex-ing to links to allow keyboard-only navigation of the page.
This commit is contained in:
AndrewHolloway0 2024-07-13 15:22:57 +08:00
parent 0d7072beea
commit ce8ffe1f29
2 changed files with 3 additions and 0 deletions

View File

@ -14,6 +14,7 @@ export default function Item({ bookmark }) {
href={bookmark.href} href={bookmark.href}
title={bookmark.name} title={bookmark.name}
target={bookmark.target ?? settings.target ?? "_blank"} target={bookmark.target ?? settings.target ?? "_blank"}
tabIndex={0}
className={classNames( className={classNames(
settings.cardBlur !== undefined && `backdrop-blur${settings.cardBlur.length ? "-" : ""}${settings.cardBlur}`, settings.cardBlur !== undefined && `backdrop-blur${settings.cardBlur.length ? "-" : ""}${settings.cardBlur}`,
"block w-full text-left cursor-pointer transition-all h-15 mb-3 rounded-md font-medium text-theme-700 dark:text-theme-200 dark:hover:text-theme-300 shadow-md shadow-theme-900/10 dark:shadow-theme-900/20 bg-theme-100/20 hover:bg-theme-300/20 dark:bg-white/5 dark:hover:bg-white/10", "block w-full text-left cursor-pointer transition-all h-15 mb-3 rounded-md font-medium text-theme-700 dark:text-theme-200 dark:hover:text-theme-300 shadow-md shadow-theme-900/10 dark:shadow-theme-900/20 bg-theme-100/20 hover:bg-theme-300/20 dark:bg-white/5 dark:hover:bg-white/10",

View File

@ -46,6 +46,7 @@ export default function Item({ service, group, useEqualHeights }) {
<a <a
href={service.href} href={service.href}
target={service.target ?? settings.target ?? "_blank"} target={service.target ?? settings.target ?? "_blank"}
tabIndex={0}
rel="noreferrer" rel="noreferrer"
className="flex-shrink-0 flex items-center justify-center w-12 service-icon z-10" className="flex-shrink-0 flex items-center justify-center w-12 service-icon z-10"
aria-label={service.icon} aria-label={service.icon}
@ -62,6 +63,7 @@ export default function Item({ service, group, useEqualHeights }) {
<a <a
href={service.href} href={service.href}
target={service.target ?? settings.target ?? "_blank"} target={service.target ?? settings.target ?? "_blank"}
tabIndex={0}
rel="noreferrer" rel="noreferrer"
className="flex-1 flex items-center justify-between rounded-r-md service-title-text" className="flex-1 flex items-center justify-between rounded-r-md service-title-text"
> >