⚡️ Download 385 HTML, CSS, JS Components and 9 templates for $129 - Limited time offer ⏳


Progress value is 30%


Z-index options in CodyFrame.

CodyFrame includes a set of z-index custom properties in the '_base.scss' file:

:root {
  --z-index-header: 3; // e.g., main header
  --z-index-popover: 5; // e.g., tooltips and dropdown
  --z-index-fixed-element: 10; // e.g., 'back to top' button
  --z-index-overlay: 15; // e.g., modals and dialogs

Here's an example of how to use these variables:

.modal {
  z-index: var(--z-index-overlay);

Optionally, you can overwrite the default z-index variables and create your own in the 'custom-style' folder (e.g., you can create a _z-index.scss file to store them).

Utility classes #

For a full list of z-index utility classes, please refer to the Utilities page.

Project duplicated

Project created

Globals imported

There was an error while trying to export your project. Please try again or contact us.