Primary Button 

<!-- Primary Cta -->
<div class="pl-spacer-s">
    <a href="#" class="primary-cta " role="button">
        Primary CTA
    </a>
</div>


<!-- Primary Cta Focus -->
<div class="pl-spacer-s">
    <a href="#" class="primary-cta  is-focus" role="button">
        Focus
    </a>
</div>


<!-- Primary Cta Active -->
<div class="pl-spacer-s">
    <a href="#" class="primary-cta  is-active" role="button">
        Active
    </a>
</div>


<!-- Primary Cta Hover -->
<div class="pl-spacer-s">
    <a href="#" class="primary-cta  is-hover" role="button">
        Hover
    </a>
</div>


<!-- Primary Cta Disabled -->
<div class="pl-spacer-s">
    <a href="#" class="primary-cta  is-disabled" role="button">
        Disabled
    </a>
</div>


{{> @button }}
 
/* Primary Cta */
{
  "theme": "default",
  "firstInstance": true,
  "url": "#",
  "text": "Primary CTA",
  "style": "primary-cta"
}


/* Primary Cta Focus */
{
  "theme": "default",
  "firstInstance": true,
  "url": "#",
  "text": "Focus",
  "style": "primary-cta",
  "isFocus": true
}


/* Primary Cta Active */
{
  "theme": "default",
  "firstInstance": true,
  "url": "#",
  "text": "Active",
  "style": "primary-cta",
  "isActive": true
}


/* Primary Cta Hover */
{
  "theme": "default",
  "firstInstance": true,
  "url": "#",
  "text": "Hover",
  "style": "primary-cta",
  "isHover": true
}


/* Primary Cta Disabled */
{
  "theme": "default",
  "firstInstance": true,
  "url": "#",
  "text": "Disabled",
  "style": "primary-cta",
  "isDisabled": true
}

No notes defined.