提交 e9b5bced 编写于 作者: Q qiang

fix: 优化 switch 组件鼠标显示效果

上级 f2bedfd9
<template>
<uni-switch
v-on="$listeners"
<uni-switch
:disabled="disabled"
v-on="$listeners"
@click="_onClick">
<div class="uni-switch-wrapper">
<div
v-show="type === 'switch'"
:class="[switchChecked ? 'uni-switch-input-checked' : '']"
<div
v-show="type === 'switch'"
:class="[switchChecked ? 'uni-switch-input-checked' : '']"
:style="{backgroundColor: switchChecked ? color : '#DFDFDF',borderColor:switchChecked ? color : '#DFDFDF'}"
class="uni-switch-input" />
<div
v-show="type === 'checkbox'"
:class="[switchChecked ? 'uni-checkbox-input-checked' : '']"
<div
v-show="type === 'checkbox'"
:class="[switchChecked ? 'uni-checkbox-input-checked' : '']"
:style="{color: color}"
class="uni-checkbox-input" />
</div>
......@@ -105,12 +106,17 @@ export default {
uni-switch {
-webkit-tap-highlight-color: transparent;
display: inline-block;
cursor: pointer;
}
uni-switch[hidden] {
display: none;
}
uni-switch[disabled] {
cursor: not-allowed;
}
uni-switch .uni-switch-wrapper {
display: -webkit-inline-flex;
display: inline-flex;
......@@ -134,6 +140,10 @@ export default {
transition: background-color 0.1s, border 0.1s;
}
uni-switch[disabled] .uni-switch-input {
opacity: .7;
}
uni-switch .uni-switch-input:before {
content: " ";
position: absolute;
......@@ -192,6 +202,10 @@ export default {
color: #007aff;
}
uni-switch:not([disabled]) .uni-checkbox-input:hover {
border-color: #007aff;
}
uni-switch .uni-checkbox-input.uni-checkbox-input-checked:before {
font: normal normal normal 14px/1 "uni";
content: "\EA08";
......@@ -211,4 +225,4 @@ export default {
uni-switch .uni-checkbox-input.uni-checkbox-input-disabled:before {
color: #ADADAD;
}
</style>
</style>
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册