|
|
@@ -18,12 +18,12 @@
|
|
|
display: flex;
|
|
|
justify-content: center;
|
|
|
align-items: center;
|
|
|
- padding: 40px 0;
|
|
|
+ padding: 80rpx 0;
|
|
|
}
|
|
|
|
|
|
.loading-icon {
|
|
|
- width: 32px;
|
|
|
- height: 32px;
|
|
|
+ width: 64rpx;
|
|
|
+ height: 64rpx;
|
|
|
color: #fa4126;
|
|
|
}
|
|
|
|
|
|
@@ -35,7 +35,7 @@
|
|
|
/* 地址项 */
|
|
|
.address-item {
|
|
|
background-color: #ffffff;
|
|
|
- margin-bottom: 8px;
|
|
|
+ margin-bottom: 16rpx;
|
|
|
position: relative;
|
|
|
overflow: hidden;
|
|
|
}
|
|
|
@@ -71,10 +71,10 @@
|
|
|
|
|
|
.swipe-actions {
|
|
|
position: absolute;
|
|
|
- right: -144px;
|
|
|
+ right: -288rpx;
|
|
|
top: 0;
|
|
|
bottom: 0;
|
|
|
- width: 144px;
|
|
|
+ width: 288rpx;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
justify-content: center;
|
|
|
@@ -95,7 +95,7 @@
|
|
|
background-color: #fa4126;
|
|
|
color: #ffffff;
|
|
|
border: none;
|
|
|
- font-size: 16px;
|
|
|
+ font-size: 32rpx;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
justify-content: center;
|
|
|
@@ -107,43 +107,43 @@
|
|
|
|
|
|
/* 地址内容 */
|
|
|
.address-content {
|
|
|
- padding: 16px;
|
|
|
+ padding: 32rpx;
|
|
|
}
|
|
|
|
|
|
/* 地址头部 */
|
|
|
.address-header {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
- margin-bottom: 8px;
|
|
|
+ margin-bottom: 16rpx;
|
|
|
}
|
|
|
|
|
|
.address-name {
|
|
|
- font-size: 16px;
|
|
|
+ font-size: 32rpx;
|
|
|
font-weight: 500;
|
|
|
color: #333333;
|
|
|
- margin-right: 12px;
|
|
|
+ margin-right: 24rpx;
|
|
|
}
|
|
|
|
|
|
.address-phone {
|
|
|
- font-size: 14px;
|
|
|
+ font-size: 28rpx;
|
|
|
color: #999999;
|
|
|
- margin-right: 12px;
|
|
|
+ margin-right: 24rpx;
|
|
|
}
|
|
|
|
|
|
.default-tag {
|
|
|
- font-size: 12px;
|
|
|
+ font-size: 24rpx;
|
|
|
color: #fa4126;
|
|
|
background-color: #ffece8;
|
|
|
- padding: 2px 6px;
|
|
|
- border-radius: 2px;
|
|
|
+ padding: 4rpx 12rpx;
|
|
|
+ border-radius: 4rpx;
|
|
|
}
|
|
|
|
|
|
/* 地址详情 */
|
|
|
.address-detail {
|
|
|
- font-size: 14px;
|
|
|
+ font-size: 28rpx;
|
|
|
color: #666666;
|
|
|
line-height: 1.5;
|
|
|
- margin-bottom: 12px;
|
|
|
+ margin-bottom: 24rpx;
|
|
|
}
|
|
|
|
|
|
/* 地址操作区域 */
|
|
|
@@ -151,8 +151,8 @@
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
|
align-items: center;
|
|
|
- padding-top: 12px;
|
|
|
- border-top: 1px solid #f0f0f0;
|
|
|
+ padding-top: 24rpx;
|
|
|
+ border-top: 2rpx solid #f0f0f0;
|
|
|
}
|
|
|
|
|
|
.address-actions:only-child {
|
|
|
@@ -161,16 +161,16 @@
|
|
|
|
|
|
.action-buttons {
|
|
|
display: flex;
|
|
|
- gap: 16px;
|
|
|
+ gap: 32rpx;
|
|
|
}
|
|
|
|
|
|
.set-default-btn,
|
|
|
.edit-btn {
|
|
|
- font-size: 14px;
|
|
|
+ font-size: 28rpx;
|
|
|
color: #666666;
|
|
|
background: none;
|
|
|
border: none;
|
|
|
- padding: 0;
|
|
|
+ padding: 8rpx 16rpx;
|
|
|
}
|
|
|
|
|
|
.set-default-btn:hover,
|
|
|
@@ -182,9 +182,9 @@
|
|
|
background-color: #fa4126;
|
|
|
color: #ffffff;
|
|
|
border: none;
|
|
|
- border-radius: 4px;
|
|
|
- padding: 8px 16px;
|
|
|
- font-size: 14px;
|
|
|
+ border-radius: 8rpx;
|
|
|
+ padding: 16rpx 32rpx;
|
|
|
+ font-size: 28rpx;
|
|
|
font-weight: 500;
|
|
|
}
|
|
|
|
|
|
@@ -198,15 +198,15 @@
|
|
|
flex-direction: column;
|
|
|
align-items: center;
|
|
|
justify-content: center;
|
|
|
- padding: 80px 0;
|
|
|
+ padding: 160rpx 0;
|
|
|
}
|
|
|
|
|
|
.no-address-icon {
|
|
|
- width: 80px;
|
|
|
- height: 80px;
|
|
|
+ width: 160rpx;
|
|
|
+ height: 160rpx;
|
|
|
background-color: #f0f0f0;
|
|
|
- border-radius: 40px;
|
|
|
- margin-bottom: 16px;
|
|
|
+ border-radius: 80rpx;
|
|
|
+ margin-bottom: 32rpx;
|
|
|
position: relative;
|
|
|
}
|
|
|
|
|
|
@@ -216,14 +216,14 @@
|
|
|
top: 50%;
|
|
|
left: 50%;
|
|
|
transform: translate(-50%, -50%);
|
|
|
- width: 40px;
|
|
|
- height: 40px;
|
|
|
+ width: 80rpx;
|
|
|
+ height: 80rpx;
|
|
|
background-color: #cccccc;
|
|
|
- border-radius: 20px;
|
|
|
+ border-radius: 40rpx;
|
|
|
}
|
|
|
|
|
|
.no-address-text {
|
|
|
- font-size: 16px;
|
|
|
+ font-size: 32rpx;
|
|
|
color: #999999;
|
|
|
}
|
|
|
|
|
|
@@ -234,18 +234,18 @@
|
|
|
left: 0;
|
|
|
right: 0;
|
|
|
background-color: #ffffff;
|
|
|
- padding: 16px;
|
|
|
- box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.1);
|
|
|
+ padding: 32rpx;
|
|
|
+ box-shadow: 0 -4rpx 16rpx rgba(0, 0, 0, 0.1);
|
|
|
}
|
|
|
|
|
|
.address-btn {
|
|
|
width: 100%;
|
|
|
- height: 44px;
|
|
|
+ height: 88rpx;
|
|
|
background-color: #fa4126;
|
|
|
color: #ffffff;
|
|
|
border: none;
|
|
|
- border-radius: 22px;
|
|
|
- font-size: 16px;
|
|
|
+ border-radius: 44rpx;
|
|
|
+ font-size: 32rpx;
|
|
|
font-weight: 500;
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
@@ -263,27 +263,27 @@
|
|
|
}
|
|
|
|
|
|
.limit-tip {
|
|
|
- font-size: 12px;
|
|
|
+ font-size: 24rpx;
|
|
|
color: #999999;
|
|
|
text-align: center;
|
|
|
- margin-top: 8px;
|
|
|
+ margin-top: 16rpx;
|
|
|
}
|
|
|
|
|
|
/* 响应式适配 */
|
|
|
@media (max-width: 375px) {
|
|
|
.address-content {
|
|
|
- padding: 12px;
|
|
|
+ padding: 24rpx;
|
|
|
}
|
|
|
|
|
|
.address-name {
|
|
|
- font-size: 15px;
|
|
|
+ font-size: 30rpx;
|
|
|
}
|
|
|
|
|
|
.address-phone {
|
|
|
- font-size: 13px;
|
|
|
+ font-size: 26rpx;
|
|
|
}
|
|
|
|
|
|
.address-detail {
|
|
|
- font-size: 13px;
|
|
|
+ font-size: 26rpx;
|
|
|
}
|
|
|
}
|