| 1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495 |
- .requirements-container {
- width: 1100px;
- padding-top: 50px;
- padding-bottom: 80px;
- background: #ffffff;
- border-radius: 8px;
- margin-left: auto;
- margin-right: auto;
- }
- .requirements-title {
- text-align: center;
- height: 40px;
- font-size: 28px;
- font-weight: 500;
- color: #0b121a;
- line-height: 40px;
- }
- .requirements-step-container {
- width: 462px;
- margin-left: auto;
- margin-right: auto;
- margin-top: 40px;
- display: flex;
- height: 80px;
- }
- .requirements-step {
- flex: 1;
- height: 32px;
- position: relative;
- &:nth-last-child(1) {
- flex: 0;
- }
- }
- .requirements-step-status {
- height: 32px;
- position: relative;
- }
- .requirements-step-icon {
- position: relative;
- z-index: 5;
- width: 32px;
- height: 32px;
- background: #ebeced;
- border-radius: 100%;
- transition: all .3s;
- &.success {
- background: url("~@/assets/img/account/step_cur.png") no-repeat 50% 50%;
- background-size: 32px auto;
- }
- &.wait {
- background: #ebeced;
- }
- &.process {
- background: #45c47a;
- }
- }
- .requirements-step-line {
- position: absolute;
- z-index: 2;
- left: 0;
- right: 0;
- top: 50%;
- transform: translateY(-50%);
- height: 6px;
- background: #ebeced;
- transition: all .3s;
- &.success {
- background: #d0f2de;
- }
- &.wait {
- background: #ebeced;
- }
- &.process {
- background: #d0f2de;
- }
- }
- .requirements-step-tips {
- position: absolute;
- margin-top: 14px;
- font-size: 14px;
- font-family: PingFangSC-Regular, PingFang SC;
- font-weight: 400;
- color: #828c99;
- line-height: 20px;
- transform: translateX(-50%);
- left: 50%;
- top: 46px;
- white-space: nowrap;
- }
- .requirements-type-submit {
- text-align: center;
- margin-top: 80px;
- }
|