From a165f3223e9362e5cececdc963dab30e8ca8e657 Mon Sep 17 00:00:00 2001 From: Tevin <tingquanren@163.com> Date: Fri, 07 Mar 2025 13:01:10 +0800 Subject: [PATCH] 知识库文档,改写控制层基类主要方法列表 --- forms/switch/cSwitch.scss | 72 ++++++++++++++++++++++++++++++++--- 1 files changed, 65 insertions(+), 7 deletions(-) diff --git a/forms/switch/cSwitch.scss b/forms/switch/cSwitch.scss index 91db6ff..3288c4c 100644 --- a/forms/switch/cSwitch.scss +++ b/forms/switch/cSwitch.scss @@ -6,6 +6,42 @@ @import "../../common/sassMixin"; .c-switch { + &.read-only { + pointer-events: none; + background-color: #f6f6f6; + .at-switch { + background-color: transparent; + } + .at-switch__container { + background-color: transparent; + } + .at-switch__title { + &::before { + display: block; + position: absolute; + top: 50%; + left: -23px; + width: 12px; + height: 12px; + content: " "; + border: #777 1PX solid; + border-radius: 50%; + transform: translateY(-50%); + } + &::after { + display: block; + position: absolute; + top: 50%; + left: -23px; + width: 14px; + height: 0px; + margin-top: 0px; + content: " "; + border-bottom: #777 1PX solid; + transform: rotate(-45deg); + } + } + } .at-switch__title { font-size: 36px; } @@ -33,26 +69,32 @@ } &.c-switch-radio { position: relative; + .at-switch { + padding-top: 18px; + padding-bottom: 18px; + } .at-switch__title { - flex: 4; + flex: unset; + width: 162px; + margin-right: 20px; } .at-switch__container { - visibility: hidden; + display: none; } .c-switch-radio-group { - @include position(absolute, 50% n n 0); - padding: 24px 32px 24px 0; - transform: translateY(-50%); + @include flexbox(flex, flex-end center, n wrap); + flex: 1; } .c-switch-radio-item { - display: inline-block; - padding-left: 8px; + @include flexbox(flex, flex-start center); + padding: 6px 0 6px 26px; } .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 +109,21 @@ background-color: #2093df; } } + .c-switch-radio-label { + display: inline-block; + padding-left: 6px; + vertical-align: middle; + white-space: pre-wrap; + } + } + &.c-switch-radio-left { + .c-switch-radio-group { + @include flexbox(flex, flex-start center, n wrap); + padding-right: 0; + .c-switch-radio-item { + padding-left: 0; + padding-right: 24px; + } + } } } \ No newline at end of file -- Gitblit v1.9.1