XiaoMo/gterFang
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

4.6接接口和样式

Browse Source
This commit is contained in:
DESKTOP-RQ919RC\Pc
2025-05-14 18:52:31 +08:00
parent 4b84dd558e
commit d201c8892f
22 changed files with 1064 additions and 690 deletions
Download Patch File Download Diff File Expand all files Collapse all files

183
src/assets/styles/apartmentDetail.less
View File

@@ -290,7 +290,6 @@
background-color: rgba(235, 235, 235, 1);
border-radius: 8px;
color: #555555;
line-height: 26px;
padding: 0 8px;
font-size: 13px;
margin-right: 10px;
@@ -344,6 +343,7 @@
.more {
color: #333333;
font-size: 14px;
cursor: pointer;
.icon {
width: 6px;
height: 10px;
@@ -555,7 +555,7 @@
}
&.consult-btn {
width: 180px;
width: 138px;
background: -webkit-linear-gradient(324.854454500294deg, rgba(98, 177, 255, 1) -11%, rgba(128, 255, 255, 1) 135%);
background: -moz-linear-gradient(125.145545499706deg, rgba(98, 177, 255, 1) -11%, rgba(128, 255, 255, 1) 135%);
background: linear-gradient(125.145545499706deg, rgba(98, 177, 255, 1) -11%, rgba(128, 255, 255, 1) 135%);
@@ -590,10 +590,12 @@
.special-bj {
width: 876px;
height: 169px;
height: 100px;
position: absolute;
top: 0;
left: 0;
object-fit: cover;
border-radius: 10px;
}
.head {
@@ -861,6 +863,7 @@
.tags {
margin-bottom: 16px;
margin-bottom: 5px;
flex-wrap: wrap;
.tags-item {
width: fit-content;
@@ -1218,9 +1221,15 @@
}
&.apartment-facilities {
&.hide {
height: 820px;
overflow: hidden;
}
transition: all 0.3s;
position: relative;
.facility-box {
padding: 30px;
position: relative;
padding: 30px 30px 30px 46px;
// position: relative;
.item {
&:not(:last-of-type) {
margin-bottom: 40px;
@@ -1249,7 +1258,6 @@
}
.label {
margin-bottom: 7px;
flex-wrap: wrap;
.label-item {
font-size: 14px;
@@ -1270,11 +1278,13 @@
}
.img-box {
margin-top: 7px;
.img-item {
width: 110px;
height: 110px;
margin-right: 10px;
position: relative;
cursor: pointer;
.icon {
width: 110px;
height: 110px;
@@ -1331,6 +1341,15 @@
}
}
&.details-message {
&.hide {
height: 820px;
overflow: hidden;
}
transition: all 0.3s;
position: relative;
}
.bottom-btn {
position: absolute;
bottom: 0;
@@ -1418,16 +1437,21 @@
margin-bottom: 20px;
font-size: 18px;
color: #000000;
background: -webkit-linear-gradient(350.348166533196deg, rgba(253, 218, 85, 1) 0%, rgba(229, 215, 190, 1) 50%, rgba(203, 254, 191, 1) 100%);
background: -moz-linear-gradient(99.6518334668042deg, rgba(253, 218, 85, 1) 0%, rgba(229, 215, 190, 1) 50%, rgba(203, 254, 191, 1) 100%);
background: linear-gradient(99.6518334668042deg, rgba(253, 218, 85, 1) 0%, rgba(229, 215, 190, 1) 50%, rgba(203, 254, 191, 1) 100%);
border-radius: 12px;
width: 304px;
height: 60px;
border: 5px solid #fff;
position: relative;
// box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.11764706);
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.117647058823529);
&.like {
background: linear-gradient(-80.3481665331958deg, rgba(214, 220, 240, 1) 0%, rgba(218, 230, 242, 1) 19%, rgba(239, 242, 204, 1) 62%, rgba(239, 249, 241, 1) 100%);
.same-brand-icon {
width: 24px;
height: 24px;
}
}
&::after {
content: "";
position: absolute;
@@ -1442,148 +1466,13 @@
}
.same-brand-icon {
width: 24px;
height: 24px;
margin-right: 4px;
width: 22px;
height: 22px;
margin-right: 7px;
}
}
.same-brand-list {
.same-brand-item {
width: 304px;
background-color: rgba(255, 255, 255, 1);
border-radius: 17px;
// -moz-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.156862745098039);
// -webkit-box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.156862745098039);
// box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.156862745098039);
box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.117647058823529);
padding: 8px 0;
margin-bottom: 20px;
cursor: pointer;
&:hover {
box-shadow: 0px 0px 8px rgba(0, 0, 0, 0.25686275);
}
.same-brand-header {
width: 288px;
height: 192px;
overflow: hidden;
border-radius: 17px;
margin: 0 auto 20px;
position: relative;
.same-brand-img {
width: 288px;
height: 192px;
object-fit: none;
}
.apartment-name {
font-weight: 650;
font-style: normal;
font-size: 16px;
color: #000000;
padding: 0 15px;
height: 32px;
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background-color: rgba(255, 255, 255, 0.7);
padding: 0 15px;
border-radius: 40px;
width: max-content;
line-height: 30px;
max-width: 100%;
}
.apartment-synopsis {
width: 100%;
height: 32px;
line-height: 32px;
background-color: rgba(0, 0, 0, 0.63921568627451);
border-radius: 0 0 10px 10px;
position: absolute;
bottom: 0;
font-size: 13px;
color: #d7d7d7;
padding: 0 10px;
}
}
.site {
margin: 0 20px 20px;
color: #555555;
font-size: 14px;
.site-icon {
width: 18px;
height: 18px;
margin-right: 4px;
}
}
.price-box {
font-size: 14px;
color: #555555;
margin: 0 20px 31px;
.price-item {
justify-content: space-between;
height: 50px;
&:not(:last-of-type) {
border-bottom: 1px solid #ebebeb;
}
}
.room-name {
font-size: 15px;
color: #000000;
padding-right: 5px;
}
.unit {
font-family: "Arial-Black", "Arial Black", sans-serif;
font-weight: 900;
color: #000000;
font-size: 13px;
}
.quantity {
font-family: "Arial-Black", "Arial Black", sans-serif;
font-weight: 900;
font-size: 18px;
color: #f95d5d;
margin: 0 5px;
}
}
.same-brand-quantity {
font-size: 14px;
color: #555555;
margin: 21px auto;
.quantity {
font-weight: 650;
font-size: 14px;
color: #000000;
line-height: 18px;
height: 18px;
background-color: #fddf6d;
border-radius: 9px;
padding: 0 8px;
margin: 0 8px;
}
.same-brand-quantity-icon {
width: 7px;
height: 12px;
margin-left: 8px;
}
}
}
}
}
}