layers

v4.15.0

STATUS

Passing

DOWNLOADS

666

LICENSE

MIT

VISIBILITY

Public

PUBLISHED

5 years ago

SIZE

36 KB

The Pane and Card components are one of the most important components in Evergreen. They are used as primitives to construct layouts and compose components. In most cases you can use a Pane instead of a div element.

1 contributor

Install layers as a package?

Copied

npm i @bit/segmentio.evergreen.layers

Set Bit as a scoped registryLearn more

npm config set '@bit:registry' https://node.bit.cloud

Component Example

React

Vue

Angular

React Native

Add dependency...

Just

import

any of the 1 million components

and packages in Bit or NPM to the example.

import Button from '@bit/grommet.grommet.button';
import Lodash from 'lodash';

modifieddraft

Properties

Name	Type	Description
background	`string`	Background property. `tint1`, `tint2` etc. from `theme.colors.background` are available.
elevation	`0 \| 1 \| 2 \| 3 \| 4`	Elevation of the Pane. Values: 0, 1, 2, 3, 4.
hoverElevation	`0 \| 1 \| 2 \| 3 \| 4`	Elevation of the Pane on hover. Might get deprecated. Values: 0, 1, 2, 3, 4.
activeElevation	`0 \| 1 \| 2 \| 3 \| 4`	Elevation of the Pane on click. Might get deprecated. Values: 0, 1, 2, 3, 4.
border	`custom`	Can be a explicit border value or a boolean. Values: true, muted, default.
borderTop	`custom`	Can be a explicit border value or a boolean. Values: true, extraMuted, muted, default.
borderRight	`custom`	Can be a explicit border value or a boolean. Values: true, extraMuted, muted, default.
borderBottom	`custom`	Can be a explicit border value or a boolean. Values: true, extraMuted, muted, default.
borderLeft	`custom`	Can be a explicit border value or a boolean. Values: true, extraMuted, muted, default.
theme (required)	`object`	Theme provided by ThemeProvider.