<template>
  <div>
		<h2>SwitchButton Style</h2>
		<div class="fitem">
			<Label for="s1">Default:</Label>
			<SwitchButton inputId="s1"></SwitchButton>
		</div>
		<div class="fitem">
			<Label for="s2">Rounded:</Label>
			<SwitchButton inputId="s2" class="rounded" :value="true"></SwitchButton>
		</div>
  </div>
</template>

<script>
export default {};
</script>
<style>
.fitem {
  margin-bottom: 20px;
}
.rounded.switchbutton {
  border-radius: 30px;
}
.rounded.switchbutton .switchbutton-handle {
  border-radius: 30px;
}
</style>