| | |
| | | margin-bottom: 12px; |
| | | line-height: 1.5; |
| | | cursor: pointer; |
| | | transition: all 0.3s; |
| | | span { |
| | | display: block; |
| | | overflow: hidden; |
| | | text-overflow: ellipsis; |
| | | white-space: nowrap; |
| | | position: relative; |
| | | z-index: 1; |
| | | } |
| | | transition: all 0.3s; |
| | | .bg-mask { |
| | | position: absolute; |
| | | top: 0; |
| | | left: 0; |
| | | right: 0; |
| | | bottom: 0; |
| | | opacity: 0.5; |
| | | border-radius: 4px; |
| | | background-color: transparent; |
| | | transition: opacity 0.3s; |
| | | } |
| | | } |
| | | .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 { |
| | |
| | | box-shadow: 0px 0px 4px #1890ff; |
| | | } |
| | | |
| | | .card-cell.active::after { |
| | | .card-cell:not(.bg-control).active::after { |
| | | content: ' '; |
| | | position: absolute; |
| | | display: table; |
| | |
| | | } |
| | | } |
| | | .check-card-form-box:not(.readonly) { |
| | | .card-cell:hover { |
| | | .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; |