MiCare Style Guide
Elements:
Colors
$color-primary
$color-primary-dark
$color-primary-light
$color-secondary
$color-secondary-dark
$color-secondary-light
$color-red
$color-background-light
Typography This is a link.
H1 This is a heading This is a link.
H2 This is a heading This is a link.
H2--light This is a light variant heading This is a link.
H3 This is a subheading This is a link.
H4 This is a heading This is a link.
H5 This is a heading This is a link.
H6 This is a heading This is a link.
P Lorem ipsum dolor sit amet, consectetur adipisicing elit. Assumenda delectus incidunt itaque iusto maxime This is a link.
Bold Text This is a link.
The Lead paragraph is a paragraph that is slightly larger than the rest of the content. Often it is the first paragraph of a post This is a link.
"This is a quote This is a link."A link, Hover + Visited
Buttons
Lists
- Unordered List This is a link.
- Lorem ipsum dolor sit, amet consectetur adipisicing elit This is a link.
- Lorem ipsum dolor sit, amet consectetur adipisicing elit This is a link.
- Ordered List This is a link.
- Lorem ipsum dolor sit, amet consectetur adipisicing elit This is a link.
- Lorem ipsum dolor sit, amet consectetur adipisicing elit This is a link.
Fields
Lightbox
Animation
-
FadeIn
.js-animation-fadeIn -
FadeInUp
.js-animation-fadeInUp -
FadeInDown
.js-animation-fadeInDown -
FadeInLeft
.js-animation-fadeInLeft -
FadeInRight
.js-animation-fadeInRight -
FadeInTopLeft
.js-animation-fadeInTopLeft -
FadeInTopRight
.js-animation-fadeInTopRight -
FadeInBottomLeft
.js-animation-fadeInBottomLeft -
FadeInBottomRight
.js-animation-fadeInBottomRight
