Backdrop

Examples

This component puts a backdrop over the entire viewport.

Class	Applied to	Outcome
`.pf-c-backdrop`	`<div>`	Initiates backdrop. Required
`.pf-c-backdrop__open`	`<body>`	Lock scrolling when backdrop is active. This class should be set on `<body>` while backdrop is active and removed while backdrop is inactive. Required


	.pf-c-backdrop	--pf-c-backdrop--Position	fixed
	.pf-c-backdrop	--pf-c-backdrop--ZIndex	400
--pf-c-backdrop--ZIndex --pf-global--ZIndex--lg $pf-global--ZIndex--lg 400
	.pf-c-backdrop	--pf-c-backdrop--BackgroundColor	rgba(#030303, .62)
--pf-c-backdrop--BackgroundColor --pf-global--BackgroundColor--dark-transparent-100 $pf-global--BackgroundColor--dark-transparent-100 rgba($pf-color-black-1000, .62) rgba(#030303, .62)