2.1 #permalink Buttons
The following button styles should be used depending on the type of action that is performed. Primary action - Used for the most important action in a given context Secondary action - Used for the secondary action in a given context
Examples
Default styling
.cf-btn-primary
Primary action
.cf-btn-secondary
Secondary action
<button class="[modifier class]">Action</button>
<button class="[modifier class] cf-is-loading">Loading</button>
<button class="[modifier class]" disabled>Disabled</button>2.2 #permalink Block button
Use .cf-block together with a button to make it a block element
Example
<p>
<button class="cf-btn-primary cf-block">Block Action Button</button>
</p>
<p>
<button class="cf-btn-secondary cf-block cf-is-loading">Loading</button>
</p>