[Firefox] Dropdowns have too big transparency

[BOHEUS]

Scenario:

1. Log in using Firefox or Librewolf
2. Go to Settings > Appearance
3. Select dark mode (optional but it can be also reproduced in dark mode)
4. Click on any dropdown

Actual: Dropdowns have too big transparency

Expected: Dropdowns should have no transparency

Note: Also found one in Settings > Developers > Webhook details

[Bonapara]

Working fine for me, do you experience this issue somewhere else in the app @BOHEUS?

[BOHEUS]

I'll check and report back once I have some time @Bonapara

[BOHEUS]

@Bonapara I think it's more of a browser problem as I can't reproduce it on Chromium-based browsers like Chrome or Brave but it's only on Firefox, I'm changing the title to highlight the problem with specific browser

[charlesBochet]

Good catch! We are using background-blur + opacity to compute the opacity. We should double check how background-blur looks like on Firefox.

Note that on chrome we cannot have a container with background-blur having a child with background-blur itself (in this case the background blur is not applied at all), I don't know if this is also the case in Firefox. But that's why sometimes we choose to Portal the component or to add isBackgroundBlurEnabled on some components to avoid the issue.
(However, I don't think this is related)

[Bonapara]

/oss.gg 150

[oss-gg]

Thanks for opening an issue! It's live on oss.gg!

[Bonapara]

@nganphan123, do you want to handle this issue into the OSS.GG hackathon context? If so, please sign up on OSS.GG and comment /assign, otherwise happy to assign it to you manually!

[PratikAwaik]

@Bonapara Looks like this issue is fixed? I don't see this issue happening on firefox.

[Bonapara]

Closing as can't reproduce either on Firefox