Text
Basic Text Styles
| global.css |
Body copy and informational text.
Scene HTML |
|---|
None |
Base selector | Optional selectors | Required child |
|---|---|---|
.palm-text-wrapper | .palm-body-text | |
.palm-body-text | ||
.palm-body-title | ||
.palm-info-text | .single |
Notes:
.palm-text-wrapper: use this wrapper to contain multiple divs of styled text for proper padding.
Capitalization
| global.css |
Some Mojo widgets and styles shift strings to uppercase or apply capitalization.
Scene HTML |
|---|
None |
Base selector | Optional selectors | Required child |
|---|---|---|
.capitalize .un-capitalize |
Notes:
Use
.capitalizefor CSS title case capitalization and.un-capitalizeto override autocapitalization in buttons, dialog box titles, and page headers.
Fonts
| global-base.css |
Mojo uses the Prelude font family.
Scene HTML |
|---|
None |
Base selector | Optional selectors | Required child |
|---|---|---|
body button input textarea | .condensed .oblique |
Truncation
| global-base.css |
Force text to fit within the available space, with an ellipsis added as needed.
Scene HTML |
|---|
None |
Base selector | Optional selectors | Required child |
|---|---|---|
.truncating-text |
Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.
Read now
Unlock full access