Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

[v4] Backdrop opacity

See original GitHub issue

There’s already backdrop-color variable for customization. but opacity is hard-coded in the element.style.

It would be great to give a change to modify backdrop opacity with global variable.

Issue Analytics

State:
Created 5 years ago
Reactions:6
Comments:19 (5 by maintainers)

Top GitHub Comments

4reactions

ghostcommented, Jul 30, 2019

This is a real issue for us, as we cannot change the opacity of the backdrop which conflicts with the desired designs. When changing it via SCSS it will break the fade animation. Any news on this?

3reactions

cptflammincommented, May 17, 2019

In your theme, workaround:

:root {
   ion-backdrop {
    opacity: 0.5 !important;
  }
}

Top Results From Across the Web

Bootstrap 4 - How remove or edit opacity in modal.backdrop

I am working with angular and want to create a modal. However I am having a lot of problems removing or editing modal-backdrop...

Tailwind CSS Backdrop Opacity - GeeksforGeeks

The Backdrop Opacity class is an inbuilt function that is used to apply a filter to the image to convert an image into...

Backdrop Opacity - Tailwind CSS

Controlling opacity of backdrop filters. Use the backdrop-opacity-{amount} utilities to control the opacity of other backdrop filters applied to an element.

How To Use Opacity and Transparency to Create a Modal in ...

When styling HTML with CSS, opacity can help soften a shadow, de-emphasize non-essential content during a specific task, or fade content in ...

Backdrop API - Material UI - MUI

Name Type Default open * bool false children node classes object