Tags

These are the tags that appear on various post cards, and individual post pages. Anywhere we need mutliple secondary categoires and quantifiers.

Making key topics visible AND interactive is such an important part of blogging that we paid extra special care to their appearnce and functionality.

<a href="#" class="punkbtn" role="button">primary</a>

.punkbtn. Thats all you need to apply to link elements to make the magic happen.

Calls to Action

These large and in charge buttons pull user focus and promote interactions! How could you not want to click something this frickin cool?!

There are a few different versions of the CTA buttons to pick from.

<div class="sqbtn sqbtn-danger">
  <button class="sqbtn-main"><span>SQBTN DANGER</span></button>
</div>

.sqbtn requires a child element of .sqbtn-main to render correctly.

<a href="/" class="pgbtn pgbtn-primary">PolyBtn</a>

.pgbtn. Is a bit simplier, that one class is all you need to make the magic happen.

Maximium Titles

using a javascript package we can generate very large 1 line 'max titles'. Simple apply one of these classes to whatever element you want maximized. Fit text will produce a 'smaller' title as it has a lower max size value.

• .fit-text
• .fit-title

<h1 class="fit-title">Test Fit Title</h1>

Color Palette

These are the various color codes and palettes being used in the current theme.

<div class="bg-purple"> ... </div>