FileMaster
Search
Toggle Dark Mode
Home
/
.
/
assets
/
scss
/
components
Edit File: _form.scss
.cb-container { display: inline-block; position: relative; padding-left: 30px; margin-bottom: 12px; cursor: pointer; line-height: 24px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .cb-container input { position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0; } .checkmark { position: absolute; top: 1px; left: 0; height: 22px; width: 22px; background-color: transparent; background-image: url(../imgs/template/icons/check.svg); background-position: center; background-repeat: no-repeat; border-radius: 4px; } .cb-container input:checked ~ .checkmark { background-image: url(../imgs/template/icons/checked.svg); background-position: center; background-repeat: no-repeat; } .cb-container .text-small { color: $color-neutral-medium-dark; font-weight: 400; font-size: 17px; line-height: 24px; } .cb-container input:checked ~ .text-small { color: $color-neutral-dark; font-weight: 500; } .checkmark:after { content: ""; position: absolute; display: none; } .cb-container input:checked ~ .checkmark:after { display: block; } .cb-container input:checked ~ .text-lbl { color: #ccc; } // .cb-container .checkmark:after { // left: -1px; // top: -1px; // width: 22px; // height: 22px; // background: url(../imgs/template/icons/checked.svg) no-repeat center; // border-radius: 4px; // }
Save
Back