base
csss
#{$all-text-inputs}
@css #{$all-text-inputs}() { ... }base|body
csss
body
@css body() { ... }body > header
@css body > header() { ... }body > main
@css body > main() { ... }main
@css main() { ... }base|box-model
csss
html
@css html() { ... }*, *::before, *::after
@css *, *::before, *::after() { ... }body
@css body() { ... }base|buttons
placeholders
button__generic
%button__generic { ... }Description
Generic Button Styles.
Used by
- [placeholder]
button__primary - [placeholder]
button__secondary - [css]
#{$all-buttons}
button__primary
%button__primary { ... }Description
Primary Button Styles.
Requires
- [placeholder]
button__generic
button__secondary
%button__secondary { ... }Description
Secondary Button Styles.
Requires
- [placeholder]
button__generic
csss
#{$all-buttons}
@css #{$all-buttons}() { ... }base|forms
csss
fieldset
@css fieldset() { ... }legend
@css legend() { ... }label
@css label() { ... }input, select, textarea
@css input,
+select,
+textarea() { ... }textarea
@css textarea() { ... }[type="checkbox"], [type="radio"]
@css [type="checkbox"],
+[type="radio"]() { ... }[type="file"]
@css [type="file"]() { ... }select
@css select() { ... }base|lists
csss
ul.plain, ol.plain
@css ul.plain,
+ol.plain() { ... }dl.plain
@css dl.plain() { ... }dt.plain
@css dt.plain() { ... }dd.plain
@css dd.plain() { ... }ul, ol
@css ul,
+ol() { ... }ul
@css ul() { ... }ol
@css ol() { ... }li > ul, li > ol
@css li > ul,
+li > ol() { ... }dl
@css dl() { ... }dt
@css dt() { ... }dd
@css dd() { ... }base|tables
csss
table
@css table() { ... }th
@css th() { ... }td
@css td() { ... }Typography
csss
body
@css body() { ... }#{$all-headlines}
@css #{$all-headlines}() { ... }h2
@css h2() { ... }h3
@css h3() { ... }h4
@css h4() { ... }h5
@css h5() { ... }h6
@css h6() { ... }p
@css p() { ... }blockquote, q
@css blockquote, q() { ... }address
@css address() { ... }pre
@css pre() { ... }code, kbd, tt, var
@css code, kbd, tt, var() { ... }abbr, acronym
@css abbr, acronym() { ... }del
@css del() { ... }ins
@css ins() { ... }mark
@css mark() { ... }small, .small-text
@css small,
+.small-text() { ... }big, .large-text
@css big,
+.large-text() { ... }a
@css a() { ... }