@color_1: #fff; @color_2: #333333; @color_3: #777; @color_4: #fa4126; @color_5: #fff; @background_color_1: #fa4126; @background_color_2: #fff; .address-item-wrapper { overflow: hidden; .swipe-out { .wr-swiper-cell { margin-top: 20rpx; } .swipe-right-del { display: flex; justify-content: center; align-items: center; width: 144rpx; height: 100%; background-color: @background_color_1; color: @color_1; font-size: 28rpx; line-height: 40rpx; } } .draw-line { position: relative; &::after { content: ''; position: absolute; bottom: 0; left: 32rpx; width: calc(200% - 132rpx); bottom: 0; transform: scale(0.5); transform-origin: 0 0; box-sizing: border-box; border-bottom: #c7c7c7 2rpx solid; } } .address { display: flex; justify-content: space-between; align-items: center; padding: 32rpx; background-color: @background_color_2; .address-edit { padding: 20rpx 0 20rpx 46rpx; } .address-left { width: 80rpx; display: flex; justify-content: center; } .address-content { display: flex; flex-direction: column; flex: 1; .title { font-size: 32rpx; line-height: 48rpx; margin-bottom: 10rpx; color: @color_2; font-weight: bold; display: flex; .text-style { margin-right: 8rpx; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 280rpx; } .text-lighter { font-weight: lighter; font-size: 30rpx; } } .label-adds { display: flex; .adds { display: -webkit-box; overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; -webkit-line-clamp: 2; color: @color_3; } .tag { display: inline-block; padding: 0rpx 8rpx; min-width: 40rpx; height: 32rpx; border-radius: 18rpx; font-size: 20rpx; line-height: 32rpx; text-align: center; margin-right: 8rpx; vertical-align: text-top; } .tag-default { background: @color_4; color: #fff; } .tag-primary { background: #333; color: @color_5; } .address-text { font-size: 28rpx; line-height: 40rpx; color: @color_3; } } } } }