diff --git a/pages/rentHouse/rentDetail.css b/pages/rentHouse/rentDetail.css new file mode 100644 index 0000000..382ab72 --- /dev/null +++ b/pages/rentHouse/rentDetail.css @@ -0,0 +1,225 @@ +.container { + box-sizing: border-box; + background-color: #f4f4f4; + font-family: PingFangSC-Light, helvetica, 'Heiti SC'; +} + +view, +image, +text, +navigator { + box-sizing: border-box; + padding: 0; + margin: 0; +} + +view, +text { + font-family: PingFangSC-Light, helvetica, 'Heiti SC'; + font-size: 29rpx; + color: #333; +} + +.banner { + width: 750rpx; + height: 417rpx; +} + +.banner image { + width: 100%; + height: 417rpx; +} + +.m-menu { + background: #fff; + display: flex; + align-items: center; + flex-wrap: wrap; + padding-bottom: 0rpx; + padding-top: 25rpx; +} + +.m-menu .item { + width: 150rpx; + height: 126rpx; +} + +.m-menu image { + display: block; + width: 68rpx; + height: 68rpx; + margin: 0 auto; + margin-bottom: 22rpx; + border-radius: 50%; +} + +.m-menu text { + display: block; + font-size: 24rpx; + text-align: center; + margin: 0 auto; + line-height: 1; + color: #333; +} + +.phone { + width: 64rpx; + height: 64rpx; + margin-left: 14rpx; +} + +.rent-price { + background: #fff; + width=750rpx; + padding: 30rpx 30rpx; +} + +.rent-left { + float: left; +} + +.rent-house { + display: block; + font-size: 36rpx; + padding-bottom: 10rpx; +} + +.rent-pay { + display: block; + font-size: 28rpx; + color: #999; +} + +.rent-right { + float: right; + line-height: 80rpx; +} + +.rent-price { + font-size: 36rpx; + color: #ff0000; +} + +.rent-properties { + display: flex; + flex-direction: row; + flex-wrap: nowrap; + justify-content: space-between; + margin-top: 2rpx; + height: 150rpx; + background: #fff; + wight: 750rpx; + padding: 20rpx 30rpx; +} + +.rent-properties-box { + padding: 5rpx; +} + +.rent-properties-title { + font-size: 32rpx; + text-align: center; + margin: 5rpx 0rpx; +} + +.rent-properties-type { + font-size: 28rpx; + margin: 15rpx 0rpx; + color: #999; + text-align: center; +} + +.rent-lable { + font-size: 28rpx; + color: #999; +} + +.rent-spec { + padding: 20rpx 30rpx; + margin-top: 4rpx; + width: 750rpx; + height: 74rpx; + background: #fff; + font-size: 28rpx; +} + +.rent-contact-box { + position: fixed:bottom:0; + width: 750rpx; + background: #fff; + padding: 20rpx 30rpx; + height: 150rpx; +} + +.rent-contact-item { + float: left; + text-align: center; +} + +.rent-contact-box button { + border-radius: 20rpx; + float: right; + color: #fff; + font-size: 32rpx; + background: #f8b551; + height: 83rpx; + width: 45%; + text-align: center; + line-height: 83rpx; +} + +.rent-contact-box image { + display: block; + width: 58rpx; + height: 58rpx; + margin: 0 auto; +} + +.rent-contact-box text { + font-size: 28rpx; + display: block; + text-align: center; +} + +.rent-description { + width: 750rpx; + background: #fff; + margin-top: 4rpx; + padding: 20rpx 30rpx; +} + +.rent-desc-header { + display: block; + font-size: 32rpx; + margin-bottom: 10rpx; +} + +.rent-summary { + font-size: 24rpx; + line-height: 28rpx; +} + +.rent-location { + width: 750rpx; + background: #fff; + margin-top: 4rpx; + padding: 20rpx 30rpx; +} + +.rent-location text { + font-size: 30rpx; +} + +.rent-location map { + margin-top: 10rpx; +} + +sup { + font-size: 20rpx; + vertical-align: text-top; +} + +sub { + font-size: 20rpx; + vertical-align: text-bottom; +} diff --git a/pages/rentHouse/rentDetail.vue b/pages/rentHouse/rentDetail.vue new file mode 100644 index 0000000..0ee1bad --- /dev/null +++ b/pages/rentHouse/rentDetail.vue @@ -0,0 +1,84 @@ + + + + +