Skip to content

[P1] Dialog: Close button removes focus indicator #385

@sujaypawar

Description

@sujaypawar

Summary

Dialog close button removes focus indicator - keyboard users can't see focus.

Severity: P1 (High)
WCAG: 2.4.7 Focus Visible (Level AA)
Component: Dialog
File: src/components/dialog/dialog.tsx:382

Issue

Close button uses focus:outline-none with no replacement focus style.

Fix (5 min - Quick Win)

// Replace line 382:
'focus:outline-none focus:ring-2 focus:ring-border-focus focus:ring-offset-2 rounded'

Testing

  • Update focus styles
  • Tab to close button - focus visible
  • Test contrast: 3:1 minimum
  • Verify across browsers

Related: #369
Quick Win: Yes
Priority: P1

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions