Skip to content

πŸ› Bug: Clear Filters button missing hover effect in dark modeΒ #1939

@tusharsingla22222-source

Description

Describe the bug

The "Clear Filters" button lacks hover effects in dark mode, while it works properly in light mode. This creates an inconsistent user experience across themes.
Current Behavior

  • Light Mode: Clear Filters button has a red/pink border and visible hover effects βœ…
  • Dark Mode: Clear Filters button appears as plain text with no hover effect or border styling ❌

Steps To Reproduce

  • Go to the JSON Schema Tools page
  • Switch to dark mode
  • Hover over the "Clear Filters" button
  • Notice the lack of hover effect compared to light mode

Expected Behavior

The Clear Filters button should have consistent hover effects in both light and dark modes, similar to how the Apply Filters button behaves.

Suggested Fix

Add proper hover states for the Clear Filters button in dark mode CSS, including:

  • Border styling (similar to light mode)
  • Hover background color change
  • Transition effects

Screenshots

https://github.com/user-attachments/assets/983358a8-5cc9-4ae5-ae1d-13e268da46c2
https://github.com/user-attachments/assets/3337ff2d-94e3-47d1-b7a0-edd321f3eaa2

Device Information [optional]

- OS:MacOS
- Browser:Chrome
- version:

Are you working on this issue?

Yes

Do you think this work might require an [Architectural Decision Record (ADR)]? (significant or noteworthy)

Yes

Metadata

Metadata

Assignees

No one assigned

    Labels

    Status: TriageThis is the initial status for an issue that requires triage.πŸ› BugIndicates that the issue is a bug or defect.

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions