Stylabilla

4.4.4 #Style.typography.text Text Classes

The text classes to format the text of any html element.

Browser support: IE9+, Safari6+, Firefox30+, Chrome30+

Default styling

The quick brown fox jumps over the lazy dog 0123456789

.sb-display--l

Used for single dates when visualizing data

The quick brown fox jumps over the lazy dog 0123456789

.sb-display

Used for big numbers when visualizing data

The quick brown fox jumps over the lazy dog 0123456789

.sb-title--l

Used for page titles

The quick brown fox jumps over the lazy dog 0123456789

.sb-title

Used for main titles in different page sections

The quick brown fox jumps over the lazy dog 0123456789

.sb-title--s

Used for smaller titles

The quick brown fox jumps over the lazy dog 0123456789

.sb-text

Used for buttons and empty state text

The quick brown fox jumps over the lazy dog 0123456789

.sb-text--s

Used for all input controls

The quick brown fox jumps over the lazy dog 0123456789

.sb-text--emphasis

Used for emphasizing text

The quick brown fox jumps over the lazy dog 0123456789

.sb-text--subtle

Used for not distinct text

The quick brown fox jumps over the lazy dog 0123456789

.sb-text--plain

Used for not decorated text

The quick brown fox jumps over the lazy dog 0123456789

.sb-text--uppercase

Used for uppercase text

The quick brown fox jumps over the lazy dog 0123456789

.sb-text--lowercase

Used for lowercase text

The quick brown fox jumps over the lazy dog 0123456789

.sb-text--number

Used to reset numbers to their original alignment

The quick brown fox jumps over the lazy dog 0123456789

.sb-text--smallcaps

Used to display text in small caps

The quick brown fox jumps over the lazy dog 0123456789

.sb-text--milo

Force Milo font

The quick brown fox jumps over the lazy dog 0123456789

Markup

<p class="[modifier class]">The quick brown fox jumps over the lazy dog 0123456789</p>

Source: trumps/_text.scss, line 1