Cool yes no toggle

We have been using this little toggle and our clients like it a lot.

very simple to use and fits in with a normal form.

First part add this to you CSS file

.btn-pre-sel {
    color: #cf8083 !important;
    background-color: #ffffff;
    border-color: #c2787b !important;
}
.btn-sel {
    color: #ffffff !important;
    background-color: #c2787b !important;
    border-color: #c2787b !important;
}

.w120px {width: 120px !important}

Code to drop into your file:

<p class="mt-2 mb-2"><b>Do you already have an account with us?</b></p>
<input type="hidden" id="account" value="no">
<div class="btn-group" role="group" aria-label="Button Group">
  <button id="btn_account_no" class="btn w120px btn-pre-sel" dmx-on:click="account.setValue('no')" dmx-class:btn-sel="account.value=='no'">No</button>
  <button id="btn_account_yes" class="btn w120px btn-pre-sel" dmx-on:click="account.setValue('yes')" dmx-class:btn-sel="account.value=='yes'">Yes</button>
</div>
Community Page
Last updated: