From 99b7b70cbcdd3e3f69731834212637bdda0e1dc6 Mon Sep 17 00:00:00 2001
From: Tevin <tingquanren@163.com>
Date: Wed, 23 Mar 2022 16:12:07 +0800
Subject: [PATCH] 修复CSwitchRadio在小程序中显示异常的问题
---
forms/switch/cSwitch.scss | 8 +++++++-
forms/switch/CSwitchRadio.vue | 12 ++++++------
2 files changed, 13 insertions(+), 7 deletions(-)
diff --git a/forms/switch/CSwitchRadio.vue b/forms/switch/CSwitchRadio.vue
index ae626e5..93feb20 100644
--- a/forms/switch/CSwitchRadio.vue
+++ b/forms/switch/CSwitchRadio.vue
@@ -14,25 +14,25 @@
class="c-switch-radio-item"
@tap="evt => handleChange(true)"
>
- <text
+ <view
class="c-switch-radio-icon"
:class="current === true ? 'checked' : ''"
>
<AtIcon value="check" />
- </text>
- <text>{{checkedLabel}}</text>
+ </view>
+ <view class="c-switch-radio-label">{{checkedLabel}}</view>
</view>
<view
class="c-switch-radio-item"
@tap="evt => handleChange(false)"
>
- <text
+ <view
class="c-switch-radio-icon"
:class="current === false ? 'checked' : ''"
>
<AtIcon value="check" />
- </text>
- <text>{{uncheckedLabel}}</text>
+ </view>
+ <view class="c-switch-radio-label">{{uncheckedLabel}}</view>
</view>
</view>
</view>
diff --git a/forms/switch/cSwitch.scss b/forms/switch/cSwitch.scss
index 91db6ff..0777689 100644
--- a/forms/switch/cSwitch.scss
+++ b/forms/switch/cSwitch.scss
@@ -46,13 +46,14 @@
}
.c-switch-radio-item {
display: inline-block;
- padding-left: 8px;
+ padding-left: 18px;
}
.c-switch-radio-icon {
@include flexbox(inline, center center);
width: 48px;
min-width: 48px;
height: 48px;
+ vertical-align: middle;
color: transparent;
font-size: 32px;
line-height: 1;
@@ -67,5 +68,10 @@
background-color: #2093df;
}
}
+ .c-switch-radio-label {
+ display: inline-block;
+ vertical-align: middle;
+ padding-left: 6px;
+ }
}
}
\ No newline at end of file
--
Gitblit v1.9.1