优化checkbox
parent
9ca9aa55ea
commit
be857d0f45
|
@ -77,11 +77,11 @@
|
||||||
:host([type='info']) label {
|
:host([type='info']) label {
|
||||||
color: var(--color-blue-1);
|
color: var(--color-blue-1);
|
||||||
.dot {
|
.dot {
|
||||||
border-color: var(--color-bule-1);
|
border-color: var(--color-blue-1);
|
||||||
}
|
}
|
||||||
|
|
||||||
&.checked .dot {
|
&.checked .dot {
|
||||||
background: var(--color-bule-1);
|
background: var(--color-blue-1);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
:host([type='info']:focus-within) .dot {
|
:host([type='info']:focus-within) .dot {
|
||||||
|
@ -152,7 +152,6 @@ import $ from '../utils'
|
||||||
|
|
||||||
export default class Checkbox {
|
export default class Checkbox {
|
||||||
props = {
|
props = {
|
||||||
color: '',
|
|
||||||
value: '',
|
value: '',
|
||||||
checked: false,
|
checked: false,
|
||||||
readonly: false,
|
readonly: false,
|
||||||
|
@ -190,15 +189,7 @@ export default class Checkbox {
|
||||||
|
|
||||||
set checked(val) {
|
set checked(val) {
|
||||||
this.props.checked = !!val
|
this.props.checked = !!val
|
||||||
var { checked, color } = this.props
|
this.__SWITCH__.classList.toggle('checked', this.props.checked)
|
||||||
this.__SWITCH__.classList.toggle('checked', checked)
|
|
||||||
this.__ICO__.setAttribute('is', 'checkbox-' + (checked ? 'on' : 'off'))
|
|
||||||
|
|
||||||
if (checked) {
|
|
||||||
this.__ICO__.setAttribute('color', color)
|
|
||||||
} else {
|
|
||||||
this.__ICO__.removeAttribute('color')
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
get readOnly() {
|
get readOnly() {
|
||||||
|
@ -282,7 +273,6 @@ export default class Checkbox {
|
||||||
watch() {
|
watch() {
|
||||||
switch (name) {
|
switch (name) {
|
||||||
case 'value':
|
case 'value':
|
||||||
case 'color':
|
|
||||||
this.props[name] = val
|
this.props[name] = val
|
||||||
break
|
break
|
||||||
|
|
||||||
|
|
Reference in New Issue