Button Cta Primary

No notes defined.

<!-- Default -->
<button type="button" class="sds-btn -btnCta -btnCtaPrimary">

    <span class="sds-btn__text">button text</span>

</button>

<!-- Full Width -->
<button type="button" class="sds-btn -btnCta -btnCtaPrimary -block">

    <span class="sds-btn__text">button text</span>

</button>

<!-- Icon Left -->
<button type="button" class="sds-btn -btnCta -btnCtaPrimary">

    <span class="sds-icon sds-icon-adviser"></span>

    <span class="sds-btn__text">button text</span>

</button>

<!-- Icon Right -->
<button type="button" class="sds-btn -btnCta -btnCtaPrimary">

    <span class="sds-btn__text">button text</span>

    <span class="sds-icon sds-icon-adviser"></span>

</button>

<!-- Disabled -->
<button type="button" class="sds-btn -btnCta -btnCtaPrimary -isDisabled" disabled>

    <span class="sds-btn__text">button text</span>

</button>

<!-- Icon Left Disabled -->
<button type="button" class="sds-btn -btnCta -btnCtaPrimary -isDisabled" disabled>

    <span class="sds-icon sds-icon-adviser"></span>

    <span class="sds-btn__text">button text</span>

</button>

<!-- Icon Right Disabled -->
<button type="button" class="sds-btn -btnCta -btnCtaPrimary -isDisabled" disabled>

    <span class="sds-btn__text">button text</span>

    <span class="sds-icon sds-icon-adviser"></span>

</button>

<!-- Big -->
<button type="button" class="sds-btn -btnCta -btnCtaPrimary -btnBig">

    <span class="sds-btn__text">button text</span>

</button>

<!-- Big Icon Left -->
<button type="button" class="sds-btn -btnCta -btnCtaPrimary -btnBig">

    <span class="sds-icon sds-icon-adviser"></span>

    <span class="sds-btn__text">button text</span>

</button>

<!-- Big Icon Right -->
<button type="button" class="sds-btn -btnCta -btnCtaPrimary -btnBig">

    <span class="sds-btn__text">button text</span>

    <span class="sds-icon sds-icon-adviser"></span>

</button>

<!-- Big Disabled -->
<button type="button" class="sds-btn -btnCta -btnCtaPrimary -btnBig -isDisabled" disabled>

    <span class="sds-btn__text">button text</span>

</button>

<!-- Big Icon Left Disabled -->
<button type="button" class="sds-btn -btnCta -btnCtaPrimary -btnBig -isDisabled" disabled>

    <span class="sds-icon sds-icon-adviser"></span>

    <span class="sds-btn__text">button text</span>

</button>

<!-- Big Icon Right Disabled -->
<button type="button" class="sds-btn -btnCta -btnCtaPrimary -btnBig -isDisabled" disabled>

    <span class="sds-btn__text">button text</span>

    <span class="sds-icon sds-icon-adviser"></span>

</button>

<!-- Small -->
<button type="button" class="sds-btn -btnCta -btnCtaPrimary -btnSmall">

    <span class="sds-btn__text">button text</span>

</button>

<!-- Small Disabled -->
<button type="button" class="sds-btn -btnCta -btnCtaPrimary -btnSmall -isDisabled" disabled>

    <span class="sds-btn__text">button text</span>

</button>

<!-- Loading -->
<button type="button" class="sds-btn -btnCta -btnCtaPrimary -isLoading">

    <span class="sds-btn__text">button text</span>

</button>

<!-- Big Bg Loading -->
<button type="button" class="sds-btn -btnCta -btnCtaPrimary -btnBig -isLoading">

    <span class="sds-btn__text">button text</span>

</button>

{% include "@button" %}