Helper classes


Class name Description Code
white Define white text color [code source=”css”].white { color: $white; }[/code]
gray Define gray text color [code source=”css”].gray { color: $gray; }[/code]
black Define black text color [code source=”css”].black { color: $black; }[/code]
light-gray Define light gray text color [code source=”css”].light-gray { color: $light-gray; }[/code]
medium-gray Define medium gray text color [code source=”css”].medium-gray { color: $medium-gray; }[/code]
dark-gray Define dark gray text color [code source=”css”].dark-gray { color: $dark-gray; }[/code]
text-color Define the default text color [code source=”css”].text-color { color: $text-color; }[/code]
accent Define the accent text color [code source=”css”].accent { color: $accent; }[/code]
Remove the top margin & padding of an element [code source=”css”].hard-start, .hard-top {
padding-top: 0 !important;
margin-top: 0 !important;
Remove the bottom margin & padding of an element [code source=”css”].hard-end, .hard-bottom {
padding-bottom: 0 !important;
margin-bottom: 0 !important;
center Align an element to center [code source=”css”].center { text-align: center; margin: 0 auto; }[/code]
left Align an element to left [code source=”css”].left { text-align: left; float: left; }[/code]
right Align an element to right [code source=”css”].right { text-align: right; float: right; }[/code]
font-smoothing Controls the application of anti-aliasing when fonts are rendered [code source=”css”].font-smoothing {
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
link Give your anchors a special treatment [code source=”xhtml”][/code]
no-lazy Disable lazy loading on an image [code source=”xhtml”][/code]
fit-text New Makes scalable headlines that fill the width of a parent element. [code source=”xhtml”]