Skip to content

ui(analyse): fix tour broadcast streams list in transparent theme - #21757

Open
Simek wants to merge 1 commit into
lichess-org:masterfrom
Simek:ui-brodcast-streams-list-transparent-fix
Open

Simek wants to merge 1 commit into
lichess-org:masterfrom
Simek:ui-brodcast-streams-list-transparent-fix

Conversation

@Simek

@Simek Simek commented Sep 20, 2026

Copy link
Copy Markdown
Member

Why

Fixes #21756

How

Apply backdrop blur directly on container, no in pseudo element (that's basically the difference between dropdown and popup extend, besides slight shadow difference).

Preview

Copied over modified styles into PROD instance, since reproducing this locally is not that straight forward.

Screenshot 2026-09-20 at 16 29 07 Screenshot 2026-09-20 at 16 28 31

@PawelPlutaUek20

PawelPlutaUek20 commented Sep 20, 2026

Copy link
Copy Markdown
Contributor

Wow, that was fast 🚀👌🏿

Did you check other places where dropdown-shadow is used?

edit - Just asking because it might be possible to replace the %dropdown-shadow with %popup-shadow everywhere (there are not so many usages)

@Simek

Simek commented Sep 20, 2026

Copy link
Copy Markdown
Member Author

Usually the blur approach need to be decided on case-to-case basis, since both methods have their quirks.

Backdrop filter not always works correctly when two elements with z-index are stacked one over another, while inset background on pseudo-element does not stretch with scrollable parent. There are few more quirks, but I do not remember them out of top of my head.

So for now I would probably leave the styles as-is, and address the issues one-by one. Maybe in the future we can simplify that with more unified set of UI primitive components. Ofc if you see any similar issues, please let us know! 🙂

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

dropdown-shadow does not work on a container that can overflow

2 participants