elevation
Description
elevation subsystem block provides child elements with elevation shadows
Installation
yarn add @moki.codes/mokui-elevation
Styles
@import "@moki.codes/mokui-elevation/dist/mokui-elevation.css"
Basic Usage
<div class="elevation">
elevation variables available to all children
<div class="elevation_depth_8">
this div has elevation of depth 8
</div>
</div>
Variables
elevation block provides following shadow color umbra/penumbra/ambient variables:
-
--elevation-color-umbra
-
--elevation-color-penumbra
-
--elevation-color-ambient
shadow animation transition duration:
- --elevation-transition-duration
Modificators
| name | value | description |
|---|---|---|
| depth | n where n is | gives elevation shadow of the specified depth |
| in the range: | value | |
| [0, 24] |