Ensure link can be accessed by keyboard & mouse

Signed-off-by: Joe Fusco <[email protected]>
wp-graphql · Jan 12, 2024 · 2016df7 · 2016df7
1 parent e72ca85
commit 2016df7
Showing 1 changed file with 2 additions and 2 deletions.
diff --git a/components/FieldTypesList.jsx b/components/FieldTypesList.jsx
@@ -31,10 +31,10 @@ export function FieldTypesList({ data }) {
             <Link
               href={fieldType.uri}
               tabIndex={0}
-              className="absolute inset-0 rounded-2xl focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-zinc-900/75"
+              className="z-20 absolute inset-0 rounded-2xl focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-zinc-900/75"
               aria-label={`${fieldType.title} field type`}
             />
-            <div className="ring-zinc-900/7.5 absolute inset-0 rounded-2xl ring-1 ring-inset group-hover:ring-zinc-900/10 dark:ring-white/10 dark:group-hover:ring-white/20" />
+            <div className="absolute inset-0 rounded-2xl ring-1 ring-inset group-hover:ring-zinc-900/7.5 dark:ring-white/10 dark:group-hover:ring-white/20" />
             <div className="relative flex flex-col rounded-2xl px-4 pb-4 pt-16 h-full z-10">
               {fieldType?.featuredImage?.node && (
                 <Image