opensource/dify
2
0
Fork 0
mirror of https://github.com/langgenius/dify.git synced 2026-06-10 18:24:09 +08:00
Code Issues Packages Projects Releases Wiki Activity

fix(web): align viewport and overlay accessibility (#37142)

Browse Source 
Signed-off-by: yyh <yuanyouhuilyz@gmail.com>
Co-authored-by: copilot-swe-agent[bot] <198982749+Copilot@users.noreply.github.com>
This commit is contained in:
yyh 2026-06-08 09:45:39 +08:00 committed by GitHub
parent 12bd8d2aa8
commit a88c15c906
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
8 changed files with 7 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
packages/dify-ui/src/alert-dialog/__tests__/index.spec.tsx
View File

@ -26,6 +26,7 @@ describe('AlertDialog wrapper', () => {
await expect.element(screen.getByRole('alertdialog')).toHaveTextContent('Confirm Delete')
await expect.element(screen.getByRole('alertdialog')).toHaveTextContent('This action cannot be undone.')
await expect.element(document.body.querySelector('.bg-background-overlay') as HTMLElement).toHaveClass('absolute', 'inset-0', 'z-50')
})
it('should not render content when dialog is closed', async () => {

2
packages/dify-ui/src/alert-dialog/index.tsx
View File

@ -29,7 +29,7 @@ export function AlertDialogContent({
<BaseAlertDialog.Backdrop
{...backdropProps}
className={cn(
'fixed inset-0 z-50 bg-background-overlay',
'absolute inset-0 z-50 bg-background-overlay',
'transition-opacity duration-150 data-ending-style:opacity-0 data-starting-style:opacity-0 motion-reduce:transition-none',
backdropClassName,
)}

1
packages/dify-ui/src/dialog/__tests__/index.spec.tsx
View File

@ -23,6 +23,7 @@ describe('Dialog wrapper', () => {
await expect.element(screen.getByRole('dialog')).toHaveTextContent('Dialog Title')
await expect.element(screen.getByRole('dialog')).toHaveTextContent('Dialog Description')
await expect.element(document.body.querySelector('.bg-background-overlay') as HTMLElement).toHaveClass('absolute', 'inset-0', 'z-50')
})
})

2
packages/dify-ui/src/dialog/index.tsx
View File

@ -56,7 +56,7 @@ export function DialogContent({
<BaseDialog.Backdrop
{...backdropProps}
className={cn(
'fixed inset-0 z-50 bg-background-overlay',
'absolute inset-0 z-50 bg-background-overlay',
'transition-opacity duration-150 data-ending-style:opacity-0 data-starting-style:opacity-0 motion-reduce:transition-none',
backdropClassName,
)}

2
packages/dify-ui/src/drawer/__tests__/index.spec.tsx
View File

@ -49,7 +49,7 @@ describe('Drawer wrapper', () => {
expect(screen.container).not.toContainElement(dialog)
await expect.element(dialog).toHaveTextContent('Workspace controls')
await expect.element(screen.getByText('Configure the current workspace.')).toBeInTheDocument()
await expect.element(screen.getByTestId('drawer-backdrop')).toHaveClass('z-50')
await expect.element(screen.getByTestId('drawer-backdrop')).toHaveClass('absolute', 'inset-0', 'z-50')
asHTMLElement(screen.getByRole('button', { name: 'Close drawer' }).element()).click()

2
packages/dify-ui/src/drawer/index.tsx
View File

@ -32,7 +32,7 @@ export function DrawerBackdrop({
return (
<BaseDrawer.Backdrop
className={cn(
'fixed inset-0 z-50 bg-background-overlay opacity-[calc(1-var(--drawer-swipe-progress,0))]',
'absolute inset-0 z-50 bg-background-overlay opacity-[calc(1-var(--drawer-swipe-progress,0))]',
'transition-opacity duration-200 data-ending-style:opacity-0 data-starting-style:opacity-0 data-swiping:duration-0 motion-reduce:transition-none',
className,
)}

2
web/app/layout.tsx
View File

@ -21,9 +21,7 @@ import './styles/markdown.css'
export const viewport: Viewport = {
width: 'device-width',
initialScale: 1,
maximumScale: 1,
viewportFit: 'cover',
userScalable: false,
}
const LocaleLayout = async ({

1
web/app/styles/preflight.css
View File

@ -45,6 +45,7 @@ html,
body {
margin: 0; /* 1 */
line-height: inherit; /* 2 */
position: relative;
}
/*