addressList.less 3.05 KB
@charset "UTF-8";

@padding_top_no_address: 30vh;
@width_no_address_img: 177px;
@height_no_address_img: 177px;
@color_no_address_text: #9C9C9C;
@font_size_no_address_text: 28px;
@padding_top_no_address_text: 20px;

page {
	background-color: #F1F2F6;
}

.address-list {
	.box {
		.item {
			background-color: #ffffff;
			width: 100%;
			// height: 300px;
			margin-top: 10px;
			color: #3A3A3A;
			font-size: 30px;
			.content {
				display: flex;
				flex-direction: row;
				justify-content: space-between;
				width: 670px;
				margin: 0 auto;
				.info {
					display: flex;
					flex-direction: column;
					justify-content: center;
					width: 100%;
					.base {
						display: flex;
						flex-direction: row;
						justify-content: space-between;
						align-items: center;
						padding-top: 36px;
						.left {
							display: flex;
							flex-direction: row;
							align-items: center;
							max-width: 70%;
							.title {
								padding-right: 20px;
							}
							.name {
								max-width: 70%;
								white-space: nowrap;
								text-overflow: ellipsis;
								overflow: hidden;
							}
						}
						.phone {
							white-space: nowrap;
							text-overflow: ellipsis;
							overflow: hidden;
						}
					}
					.address-box {
						display: flex;
						flex-direction: row;
						align-items: center;
						padding-top: 26px;
						padding-bottom: 36px;
						.title {
							padding-right: 20px;
						}
						.waiting {
							background-color: #FEF5E5;
							color: #F5A623;
							font-size: 26px;
							margin-right: 20px;
							padding: 0 10px;
							border-radius: 12px;
						}
						.address {
							max-width: 77%;
							white-space: nowrap;
							text-overflow: ellipsis;
							overflow: hidden;
							&.address-waiting {
								max-width: 60%;
							}
						}
					}
				}
			}
			.funcs-box {
				display: flex;
				flex-direction: row;
				justify-content: space-between;
				align-items: center;
				width: 670px;
				margin: 0 auto;
				border-top: 1px #DEDEDE solid;
				padding-top: 36px;
				padding-bottom: 24px;
				.check-group {
					display: flex;
					flex-direction: row;
					justify-content: flex-end;
					align-items: center;
					// flex: 1;
					.check-box {
						width: 36px;
						height: 36px;
					}
					.text {
						padding-left: 26px;
					}
				}
				.buttons-box {
					display: flex;
					flex-direction: row;
					justify-content: flex-end;
					align-items: center;
					flex: 2.6;
					position: unset;
					.edit-box {
						padding: 8px 30px;
						border: 1px solid #D2D2D2;
						border-radius: 12px;
					}
					.delete-box {
						color: #FF725C;
						padding: 8px 30px;
						border: 1px solid #FF725C;
						border-radius: 12px;
					}
					.buttons + .buttons {
						margin-left: 20px;
					}
				}
			}
		}
	}
}
.no-address {
	width: 100%;
	height: 100%;
	text-align: center;
	padding-top: @padding_top_no_address;
	.img {
		width: @width_no_address_img;
		height: @height_no_address_img;
	}
	.text {
		color: @color_no_address_text;
		font-size: @font_size_no_address_text;
		padding-top: @padding_top_no_address_text;
	}
}