fix: add visually hidden DialogTitle to resolve a11y warning and fix modal background

This commit is contained in:
sagitchu
2026-04-22 09:21:47 +08:00
parent a03c320b89
commit 6e60f5cfbd
3 changed files with 4 additions and 2 deletions
+1 -1
View File
@@ -5383,7 +5383,7 @@ export default function ForwardPage() {
<Modal
backdrop="blur"
classNames={{
base: "!w-[calc(100%-32px)] !mx-auto sm:!w-full rounded-2xl overflow-hidden",
base: "!w-[calc(100%-32px)] !mx-auto sm:!w-full rounded-2xl overflow-hidden [&>div]:bg-content1 [&>div]:dark:bg-content1",
}}
isOpen={diagnosisModalOpen}
placement="center"
+1 -1
View File
@@ -3201,7 +3201,7 @@ export default function TunnelPage() {
<Modal
backdrop="blur"
classNames={{
base: "!w-[calc(100%-32px)] !mx-auto sm:!w-full rounded-2xl overflow-hidden",
base: "!w-[calc(100%-32px)] !mx-auto sm:!w-full rounded-2xl overflow-hidden [&>div]:bg-content1 [&>div]:dark:bg-content1",
}}
isOpen={diagnosisModalOpen}
placement="center"
@@ -3,6 +3,7 @@ import * as React from "react";
import {
Dialog,
DialogContent as BaseDialogContent,
DialogTitle,
} from "@/components/ui/dialog";
import { cn } from "@/lib/utils";
@@ -159,6 +160,7 @@ export function ModalContent({
showCloseButton={false}
{...props}
>
<DialogTitle className="sr-only">Modal Dialog</DialogTitle>
{renderedChildren}
</BaseDialogContent>
);