ALF Classes

There are a number of general classes in ALF, here's a categorized list:

Text alignment

• left: text-align left
• right: text-align right
• center: text-align center
• nowrap: prevent text-wrap (i.e. in tables)

Font sizes

• txt-xxs: extra extra small
• txt-xs: extra small
• txt-s: small
• txt-m: medium (like the standard paragraph size)
• txt-l: large
• txt-xl: extra large
• txt-xxl: extra extra large

Responsive

• hide: hide the element (with display: none)
• hide-phone-small: hide for phone-small
• hide-phone: hide for phone and phone-small
• hide-tablet: hide for tablet
• hide-web: hide for web and web-large
• only-phone: only show for phone and phone-small
• only-tablet: only show for tablet
• only-web: only show for web and web-large

This is hidden in phone-down

This is hidden in tablet

This is hidden in web-up

This is only in phone-down

This is only in tablet

This is only in web-up

Misc

• scroller: use in a DIV surrounding other content, to force horizontal scroll, should the content become too large for the available width. This is useful for responsive purposes (i.e. to wrap a long table).