| | |
| | | } |
| | | } |
| | | .forward-wrap { |
| | | text-align: right; |
| | | position: relative; |
| | | padding: 5px; |
| | | |
| | | .ant-radio-group { |
| | | position: absolute; |
| | | top: 5px; |
| | | right: 0px; |
| | | } |
| | | |
| | | .legend { |
| | | span { |
| | | display: inline-block; |
| | | margin-right: 20px; |
| | | position: relative; |
| | | margin-left: 60px; |
| | | } |
| | | span::before { |
| | | content: ' '; |
| | | display: block; |
| | | position: absolute; |
| | | width: 50px; |
| | | height: 6px; |
| | | left: -55px; |
| | | top: 10px; |
| | | } |
| | | span:first-child::before { |
| | | background: #8E44AD; |
| | | } |
| | | span:last-child::before { |
| | | background: rgb(38, 194, 129); |
| | | } |
| | | } |
| | | } |
| | | .fork-wrap { |
| | | padding-top: 15px; |
| | | } |
| | | .fork-wrap.fork-false { |
| | | .fork-item-wrap { |
| | | .fork-left { |
| | | .fork-item { |
| | | border-color: rgb(38, 194, 129); |
| | | color: #26c281; |
| | | } |
| | | } |
| | | .fork-right { |
| | | .fork-item { |
| | | border-color: #8E44AD; |
| | | color: #8E44AD; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | .fork-item-wrap { |
| | | display: inline-flex; |
| | | width: 50%; |
| | | margin-bottom: 15px; |
| | | margin-bottom: 20px; |
| | | |
| | | .fork-left { |
| | | position: relative; |
| | | display: flex; |
| | | width: 50%; |
| | | align-items: center; |
| | | |
| | | .fork-item { |
| | | border-color: #8E44AD; |
| | | color: #8E44AD; |
| | | } |
| | | .fork-item::before { |
| | | content: ''; |
| | | display: block; |
| | | border-top: 1px solid #bcbcbc; |
| | | position: absolute; |
| | | top: 28px; |
| | | width: 58px; |
| | | right: -58px; |
| | | } |
| | | } |
| | | .fork-right { |
| | | position: relative; |
| | | display: inline-block; |
| | | width: 50%; |
| | | padding-left: 30px; |
| | | |
| | | .fork-item { |
| | | border-color: rgb(38, 194, 129); |
| | | color: #26c281; |
| | | } |
| | | .fork-item:not(:last-child) { |
| | | margin-bottom: 10px; |
| | | } |
| | | .fork-item::before { |
| | | content: ''; |
| | | display: block; |
| | | border-top: 1px solid #bcbcbc; |
| | | position: absolute; |
| | | top: 28px; |
| | | width: 56px; |
| | | left: -56px; |
| | | } |
| | | } |
| | | .fork-right::before { |
| | | content: ''; |
| | | display: block; |
| | | border-left: 1px solid #bcbcbc; |
| | | position: absolute; |
| | | top: 29px; |
| | | bottom: 27px; |
| | | left: -26px; |
| | | } |
| | | |
| | | .fork-item { |
| | |
| | | width: 130px; |
| | | border: 1px solid #bcbcbc; |
| | | padding: 5px 10px; |
| | | height: 55px; |
| | | height: 56px; |
| | | border-radius: 4px; |
| | | color: rgba(0, 0, 0, 0.85); |
| | | span:not(.fork-tail) { |
| | | display: block; |
| | | white-space: nowrap; |
| | |
| | | .fork-tail { |
| | | display: inline-block; |
| | | position: absolute; |
| | | color: rgba(0, 0, 0, 0.85); |
| | | top: 10px; |
| | | right: 140px; |
| | | right: 135px; |
| | | max-width: 45px; |
| | | display: block; |
| | | white-space: nowrap; |
| | | overflow: hidden; |
| | | text-overflow: ellipsis; |
| | | } |
| | | } |
| | | } |