Card

Updated on 24 April 2018

Docs are work in progress, check open issues and see how you can help!

Card component is a container with a drop shadow and border radius. It can contain other elements such as Image, Button and many more. Default Card uses default shadow property from Shadow.

Styles

There’s style option for card component, which brings card “up” on z axis and uses lifted or elevated property from Shadow.

Specifications

// Base
$card-fill                   : palette(cg9);
$card-radius                 : radius(default);

$card-default-shadow         : %shadow-default;
$card-lifted-shadow          : %shadow-lifted;
$card-elevated-shadow        : %shadow-elevated;

API

name type default
style default / lifted / elevated default