Skip to content

Transparent background of search panel makes text hard to read #414

Open
@Feuermurmel

Description

@Feuermurmel

This is how the search panel at https://tanstack.com/query/latest/docs/framework/react/overview looks in Safari 18.5 (most recent version):

Image

The search results are very hard to read for me. Compare this to an opaque background (set via web inspector):

Image

The panel does have a backdrop-filter: blur(16px). While still not as good as a white background, it helps a lot with readability. The problem seems to be that backdrop-filter is not yet enabled by default in Safari (it is still marked as Testable), resulting in the transparent background:

Image

The compatibility info at MDN is wrong. Relevant issue: mdn/browser-compat-data#25914

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions