Typography
Oh-Flex comes with a standard set of attributes to control text and font attributes.
Source:
_text.scss
, line 1
Oh Flex doesn't contain an icon pack. Instead, you should use one of the million amazing that already exist. However, universally controlling the various icon pack font sizes is a gamble. Here I try to make a general icon size controller.
f-icon-sm
f-icon-md
f-icon-lg
f-icon-xl
Source:
_text.scss
, line 174
Markdown:
- .f-t-8px
- .f-t-10px
- .f-t-12px
- .f-t-14px
- .f-t-16px
- .f-t-18px
- .f-t-20px
- .f-t-22px
- .f-t-24px
- .f-t-26px
- .f-t-28px
- .f-t-30px
- .f-t-32px
- .f-t-36px
- .f-t-40px
- .f-t-42px
Source:
_text.scss
, line 11
f-t-thin
f-t-bold
f-t-bolder
f-t-uppercase
f-t-left
f-t-right
f-t-center
f-t-spread
f-truncate This should be cut off at one line when it runs out of space
f-truncate-2 Consectetur esse id fugiat dolor non ex duis laboris labore qui nulla officia reprehenderit mollit ut aute est. Id aliquip ex et id amet qui laborum elit consequat magna. Pariatur voluptate nulla dolor commodo exercitation magna mollit eiusmod ipsum reprehenderit eiusmod ut minim dolore. Labore et reprehenderit anim minim commodo ad excepteur ea elit et. Cillum ut ipsum qui dolor ut do sit et irure officia proident..
f-truncate-3 Anim ipsum id incididunt elit ea qui aute tempor do incididunt pariatur anim sit laboris consectetur. Amet dolore labore aliqua eu do laborum elit commodo occaecat ex fugiat reprehenderit consequat fugiat sit. In commodo cillum incididunt pariatur magna non dolore et. Ea eu aute mollit incididunt laborum sit ipsum est esse voluptate in dolor minim Lorem. Adipisicing quis eu fugiat Lorem elit eiusmod velit ipsum labore fugiat culpa consequat ea..
Source:
_text.scss
, line 52
Only want the text features of Oh-flex?
<link href="https://unpkg.com/oh-flex/lib/chunks/_text.css" rel="stylesheet" />
Source:
_text.scss
, line 275