From 137fb8ea6af2789b3238b22bac31d80bced41dfe Mon Sep 17 00:00:00 2001 From: king <18310653075@163.com> Date: 星期三, 28 七月 2021 11:39:39 +0800 Subject: [PATCH] 2021-07-28 --- src/tabviews/zshare/mutilform/checkCard/index.scss | 64 ++++++++++++++++++++++++++++++- 1 files changed, 61 insertions(+), 3 deletions(-) diff --git a/src/tabviews/zshare/mutilform/checkCard/index.scss b/src/tabviews/zshare/mutilform/checkCard/index.scss index 3d87dc7..ae18860 100644 --- a/src/tabviews/zshare/mutilform/checkCard/index.scss +++ b/src/tabviews/zshare/mutilform/checkCard/index.scss @@ -2,28 +2,48 @@ margin-top: 10px; margin-bottom: -10px; .card-cell { + position: relative; border: 1px solid #bcbcbc; border-radius: 4px; padding: 6px; margin-bottom: 12px; line-height: 1.5; - transition: all 0.3s; cursor: pointer; + transition: all 0.3s; span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; + position: relative; + z-index: 1; + } + .bg-mask { + position: absolute; + top: 0; + left: 0; + right: 0; + bottom: 0; + opacity: 0.3; + border-radius: 4px; + background-color: transparent; + transition: opacity 0.3s; } } - .card-cell:hover, .card-cell.active { + .card-cell:not(.bg-control).active { border-color: #1890ff; background: #1890ff; span { color: #ffffff!important; } } + .card-cell.bg-control.active { + .bg-mask { + opacity: 1; + } + } .card-pic-cell { + position: relative; border: 1px solid #bcbcbc; border-radius: 4px; background-size: cover; @@ -31,9 +51,47 @@ margin-bottom: 12px; line-height: 1.5; cursor: pointer; + transition: all 0.3s; } - .card-pic-cell:hover, .card-pic-cell.active { + .card-pic-cell.active { border-color: #1890ff; box-shadow: 0px 0px 4px #1890ff; } + + .card-cell:not(.bg-control).active::after { + content: ' '; + position: absolute; + display: table; + border: 2px solid #ffffff; + border-top: 0; + border-left: 0; + bottom: 0; + right: 12px; + width: 6px; + height: 12px; + transform: rotate(45deg) scale(1) translate(-50%, -50%); + } +} +.check-card-form-box:not(.readonly) { + .card-cell:not(.bg-control):hover { + border-color: #1890ff; + background: #1890ff; + span { + color: #ffffff!important; + } + } + .card-cell.bg-control:not(.active):hover { + .bg-mask { + opacity: 0.7; + } + } + .card-pic-cell:hover { + border-color: #1890ff; + box-shadow: 0px 0px 4px #1890ff; + } +} +.check-card-form-box.readonly { + .card-cell, .card-pic-cell { + cursor: not-allowed; + } } \ No newline at end of file -- Gitblit v1.8.0