1
0
mirror of https://github.com/phuoc-ng/csslayout.git synced 2025-10-23 10:46:13 +02:00
Files
csslayout/styles/patterns/_custom-checkbox-button.scss
2022-09-21 09:09:00 +07:00

38 lines
700 B
SCSS

.custom-checkbox-button {
/* Center the content horizontally */
align-items: center;
display: inline-flex;
/* Cursor */
cursor: pointer;
/* Demo */
margin: 0.25rem 0;
width: 8rem;
}
.custom-checkbox-button__input {
/* Hide it */
display: none;
}
.custom-checkbox-button__square {
border: 1px solid #d1d5db;
border-radius: 0.25rem;
/* Spacing */
margin-right: 0.5rem;
padding: 0.25rem;
}
.custom-checkbox-button__checkbox {
background-color: transparent;
border-radius: 0.25rem;
height: 1rem;
width: 1rem;
}
.custom-checkbox-button__checkbox--selected {
/* For selected checkbox */
background-color: #3b82f6;
}