Backdrop

Published on February 16, 2021, updated on June 01, 2021

Element: <ins-backdrop>

Creates an overlay to hold other components.

Complete Example

Default State

Light State

Code Snippet

<ins-backdrop>
</ins-backdrop>

Default State

Code Snippet

<ins-button 
  solid 
  label="Element Behind">
</ins-button>

<ins-backdrop>

  <div>
    <h3>Hello World</h3>
 
 </div>

</ins-backdrop>

<style>
  ins-backdrop div { position: relative; z-index: 9999; }
</style>

Light State

Code Snippet

<ins-button 
  solid 
  label="Element Behind">
</ins-button>

<ins-backdrop light>

  <div>
    <h3>Hello World</h3>
  </div>

</ins-backdrop>

<style>
  ins-backdrop div { position: relative; z-index: 9999; }
</style>

Attributes

FIELD ATTRIBUTE	TYPE	DEFAULT	OPTIONS	DESCRIPTION
light	boolean	false	true, false	Set backdrop color style to light / white.

Have a suggestion for this page?

Didn't quite find what you are looking for or have feedback on how we can make the content better then we would love to hear from you. Please provide us feedback and we will get back to you shortly.