page { background-color: #f4f4f4; } .tabs { position: fixed; top: 0; left: 0; right: 0; z-index: 99; display: flex; background-color: #ffffff; } .tabs-item { flex: 2; text-align: center; height: 90rpx; line-height: 90rpx; position: relative; } .tabs-item::after { position: absolute; width: 12%; background-color: #1d37e2; height: 6rpx; border-radius: 60rpx; content: ''; left: 44%; bottom: 0; display: none; } .tabs-item.show::after { display: block; } .tabs-item.show { color: #1d37e2; font-weight: 600; } .list { margin-top: 100rpx; padding: 30rpx; box-sizing: border-box; } .item { background-color: #ffffff; border-radius: 30rpx; margin-bottom: 30rpx; box-shadow: 0 0 5rpx rgba(0, 0, 0, .05); } .top { padding: 0 30rpx; box-sizing: border-box; line-height: 110rpx; border-bottom: 2rpx solid #eeeef0; display: flex; } .code { flex: 1; font-weight: 600; position: relative; padding-left: 30rpx; } .code::after { position: absolute; content: ''; left: 0; top: calc(50% - 7rpx); width: 14rpx; height: 14rpx; border-radius: 50%; background-color: #53c41a; } .copy { border: 2rpx solid #1d37e2; color: #1d37e2; border-radius: 10rpx; font-size: 28rpx; height: 64rpx; line-height: 62rpx; padding: 0 20rpx; box-sizing: border-box; margin-top: 26rpx; } .label { padding: 30rpx; box-sizing: border-box; display: flex; } .label-item { flex: 2; } .label-name { font-size: 30rpx; color: #9d9d9d; margin-bottom: 10rpx; }