UNPKG

dh-c

Version:

The front-end development engineers jimberton gulp react component

62 lines (61 loc) 1.51 kB
.dh-checkbox2 { white-space: nowrap; cursor: pointer; outline: none; display: inline-block; line-height: 1; position: relative; vertical-align: text-bottom; } .dh-checkbox2 + span { padding: 0 8px; } .dh-checkbox2-wrapper { cursor: pointer; font-size: 12px; display: inline-block; } .dh-checkbox2-input { position: absolute; left: 0; z-index: 1; cursor: pointer; opacity: 0; top: 0; bottom: 0; right: 0; width: 100%; height: 100%; } .dh-checkbox2-inner { position: relative; top: 0; left: 0; display: block; width: 14px; height: 14px; border: 1px solid #d9d9d9; border-radius: 2px; background-color: #fff; transition: all .3s; } .dh-checkbox2-inner:after { transform: rotate(45deg) scale(0); position: absolute; left: 4px; top: 1px; display: table; width: 5px; height: 8px; border: 1px solid #fff; border-top: 0; border-left: 0; content: " "; transition: all 0.1s cubic-bezier(0.71, -0.46, 0.88, 0.6); } .dh-checkbox2-checked .dh-checkbox2-inner { background-color: #23c123; border-color: #23c123; } .dh-checkbox2-checked .dh-checkbox2-inner:after { transform: rotate(45deg) scale(1); position: absolute; display: table; border: 2px solid #fff; border-top: 0; border-left: 0; content: " "; transition: all 0.2s cubic-bezier(0.12, 0.4, 0.29, 1.46) 0.1s; }