gg-y-ui/lib/checkbox/style/style.css

An enterprise-class UI design language and Vue-based implementation for web

.y-checkbox-wrapper{display:inline-flex;align-items:center;cursor:pointer;user-select:none}.y-checkbox-wrapper .y-checkbox{width:13px;height:13px;border-radius:3px;border:1px solid #adb8be;display:inline-block;position:relative}.y-checkbox-wrapper .y-checkbox:after{content:'';position:absolute;box-sizing:content-box;border:1px solid #fff;border-left:0;border-top:0;width:4px;height:7px;top:1px;left:4px;transform:rotate(45deg) scaleY(0);border-radius:0;background-color:transparent}.y-checkbox-wrapper .y-checkbox-checked,.y-checkbox-wrapper .y-checkbox-indeterminate{border-color:#4598f0;background-color:#4598f0}.y-checkbox-wrapper .y-checkbox-indeterminate:before{content:'';position:absolute;background-color:#fff;height:1px;left:3px;right:3px;top:6px}.y-checkbox-wrapper .y-checkbox-checked:after{transform:rotate(45deg) scaleY(1)}.y-checkbox-wrapper .y-checkbox-label{font-size:14px;line-height:20px;color:#1d1d1d;margin-left:8px}.y-checkbox-wrapper-checked .y-checkbox,.y-checkbox-wrapper:hover:not(.y-checkbox-wrapper-disabled) .y-checkbox{border-color:#4598f0}.y-checkbox-wrapper-checked .y-checkbox-label,.y-checkbox-wrapper:hover:not(.y-checkbox-wrapper-disabled) .y-checkbox-label{color:#4598f0}.y-checkbox-wrapper-disabled{opacity:.5;cursor:not-allowed}