JSFiddle - React, Tailwind, and code Playground
by SpeakeazyYT
HTML
<div class="checkbox-new-postr">
<input type="checkbox" name="aux_prem" id="aux_prem">
<label for="aux_prem">Терраса</label>
</div>
CSS
.checkbox-new-postr {
border: 2px solid #e08543;
display: inline-block;
border-radius: 10px;
overflow: hidden;
}
.checkbox-new-postr input[type=checkbox] {
position: absolute;
visibility: hidden;
display: none;
}
.checkbox-new-postr label {
color: #555;
display: inline-block;
cursor: pointer;
font-weight: bold;
padding: 5px 20px;
margin-bottom: 0px!important;
}
.checkbox-new-postr input[type=checkbox]:checked + label{
color: white;
background: #e08543;
}