12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970 |
- .list {
- margin-top: 40px;
- .item {
- padding: 28px 75px 28px 124px;
- display: flex;
- justify-content: space-between;
- margin-bottom: 18px;
- background: #ffffff;
- box-shadow: 0px 0px 8px 14px rgba(0, 0, 0, 0.03);
- border-radius: 12px;
- align-items: center;
- }
- .status {
- width: 134px;
- height: 134px;
- font-size: 36px;
- font-weight: 400;
- color: #000000;
- text-align: center;
- line-height: 134px;
- background: url('@/assets/circle-success.png') no-repeat center;
- background-size: 100% 100%;
- }
- .statusError {
- background-image: url('@/assets/circle-error.png');
- }
- .info {
- flex: 1;
- padding-left: 100px;
- i {
- width: 14px;
- height: 14px;
- display: inline-block;
- vertical-align: middle;
- border-radius: 50%;
- margin-right: 14px;
- background-color: rgba(74, 144, 226, 1);
- }
- }
- .time {
- font-size: 24px;
- font-weight: 400;
- color: #4a4a4a;
- line-height: 34px;
- }
- .desc {
- font-size: 32px;
- font-weight: 400;
- color: #4a4a4a;
- line-height: 44px;
- .number {
- font-size: 54px;
- font-weight: 500;
- color: #f5a623;
- line-height: 76px;
- margin-left: 12px;
- }
- span {
- font-size: 28px;
- color: #000000;
- }
- }
- .btn {
- width: 23px;
- height: 35px;
- background: url('@/assets/arr-right.png') no-repeat center;
- background-size: 100% 100%;
- }
- }
|