quasar icon indicating copy to clipboard operation
quasar copied to clipboard

Radial-Gradient background seems to override dark config on mobile

Open nlavalle opened this issue 1 year ago • 0 comments

What happened?

I'm still pretty new to front end so if this is user error then I apologize. I have a page with a radial-gradient background, and I've set the dark mode using the quasar config as described in the dark plugin page. On my desktop (firefox) when I add a q-select it's shown in dark mode, but when I run it in iphone 11 safari with the radial-gradient it flashbangs you with a white background. I'm not sure how it's related to the gradient but when I toggle that part of the css and use the default background it doesn't have the same issue.

What did you expect to happen?

I would expect iphone 11 safari to be the same as the desktop experience where the select respects the dark config setting and keeps the background

Reproduction URL

https://codepen.io/gloomcloud/pen/VwRWXjO

How to reproduce?

  1. Go to codepen link
  2. I personally toggled the developer design mode and selected iPhone 11 Pro iOS 14.6 to repro it
  3. Refresh
  4. Click either dropdown
  5. Change design mode back to desktop / refresh / confirm normal behavior
  6. Comment the background line in the css to confirm that affects the mobile behavior

Flavour

Quasar CLI with Vite (@quasar/cli | @quasar/app-vite)

Areas

Plugins (quasar), Style & Identity (quasar)

Platforms/Browsers

Safari, iOS, Android

Quasar info output

No response

Relevant log output

No response

Additional context

No response

nlavalle avatar Jan 21 '24 20:01 nlavalle