Scott Sanders
Tim MiddlemissWOLA Condemns the Assassination of Berta Caceres, Honduran Human Rights Defender
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud.
Quick Reference
These quick guides will help you get started. For more detailed instructions check out the documentation.
Grid (_layout.scss)
| Mixin | Usage |
|---|---|
@include container()
|
Apply to an element wrapping the column structure |
@include columns($columns, $offset, $gutter)
|
@include columns(8, 0, 0)
|
@include responsive-columns($breakpoint, $columns, $offset);
|
Apply to overwrite default breakpoint columns |
Grid Settings(_variables.scss)
Grid breakpoints and settings are set in _variables.scss
Check grid examples here
Breakpoints (_variables.scss)
| Mixin | Usage |
|---|---|
@include respond-to($breakpoint-name)
|
@include respond-to('mobile') {
|
Buttons (_buttons.scss)
Social icons are achived by prefixing icon text with:<span class="icon-[socialNework]">
Forms (_forms.scss)
All HTML5 form elements are normalized to a set of core styles.
Mixins (_mixins.scss)
Base includes scss mixins for CSS3 properties, animations, gradients and some utility mixins. Check the source to see what's available.
Menus (_menus.scss)
Add .menu-primary for a horizontal menu or .menu-secondary for a vertical menu.
.menu-primary
.menu-secondary
Type (_type.scss)
Typography is controlled in _type.scss. Base provides a clean and sensible reset for heading styles, paragraphs, tables, lists and others.
Variables (_variables.scss)
Control colors and fonts across the site. Begins with:
- Heading font-family - @headingFont
- Paragraph font-family - @paragraphFont
- Text color - @textColor
- Base color - @baseColor
- Primary color - @primaryColor
- Secondary color - @secondaryColor