Overalay separates foreground with the background content.
Background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample
Foreground sample content
import { Overlay } from "@nulogy/components";
<Text>Background content sample</Text>
<Overlay>
<Text>Foreground sample content</Text>
</Overlay>
Overlay by default assigns light theme but dark theme is also available.
Background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample background content sample
Foreground sample content
import { Overlay } from "@nulogy/components";
<Text>Background content sample</Text>
<Overlay dark>
<Card>
<Text>Foreground sample content</Text>
</Card>
</Overlay>
In addition to this props listed below the Overlay component accepts Flex's props since it is it's extension.
| Name | Type | Default | Description |
|---|---|---|---|
dark | Boolean | false | Controls the theming |