Buttons

Buttons are build using Foundation. Basic styles are available when developing custom HTML to handle variations with brand consistency. See http://foundation.zurb.com/docs/v/4.3.2/components/buttons.html for more details.

Default Buttons

Default button styling provided by Foundation configuration.

<a class="button">
Default Button
<a class="button primary">
Primary Button
<a class="button secondary">
Secondary Button

Expanded buttons

Default button styling with the .expand class applied to make the button fill its grid column. Primarily used for creating mobile-friendly full-width buttons.

<a class="button expand">
Primary Button Expand
<a class="button expand secondary">
Secondary Button Expand

Extended buttons

(Additional button styles not provided by Foundation)

<a class="button tertiary">
Tertiary Button

Special-Case Alternates

(not provided by Foundation)

<a class="button primary alt-1">
Primary Button Alt 1
<a class="button secondary alt-1">
Secondary Button Alt 1
<a class="button tertiary alt-1">
Tertiary Button Alt 1
<a class="button tertiary alt-2">
Tertiary Button Alt 2

Read More/Less buttons

Exetended from base Foundation expanded buttons to include indicator icons.

<a class="button more">
Button More
<a class="button expand more">
Button More Expand
<a class="button less">
Button Less
<a class="button expand less">
Button Less Expand