page { background: #F9F9F9; /* background: #fff; */ height: 100%; } .project-scroll-x::-webkit-scrollbar, .scroll-x::-webkit-scrollbar { display: none; /* Chrome Safari */ } .content { padding: 0 20rpx 56rpx; } .top .name { font-size: 36rpx; font-family: PingFangSC-Semibold, PingFang SC; font-weight: 600; color: #FA7D22; margin: 22rpx 0 26rpx; } .top .store { font-size: 32rpx; font-family: PingFangSC-Semibold, PingFang SC; font-weight: 600; color: #333333; } .top .address { margin: 10rpx 0; } .top .address image { width: 28rpx; height: 28rpx; border-radius: 50%; background-color: #ccc; margin-right: 10rpx; } .border-radius { background: #FFFFFF; box-shadow: 0rpx -2rpx 16rpx 0rpx rgba(0, 0, 0, 0.04); border-radius: 24rpx; margin: 20rpx 0; padding: 0 20rpx; position: relative; } .border-radius .title { font-size: 32rpx; font-family: PingFangSC-Semibold, PingFang SC; font-weight: 600; color: #333333; padding: 20rpx 0; } .border-radius .line { height: 2rpx; background: #F9F9F9; box-shadow: 0rpx -2rpx 16rpx 0rpx rgba(0, 0, 0, 0.04); border-radius: 24rpx; width: 100%; } .scroll-x { /* padding: 30rpx 0; */ /* border-top: 2rpx solid #f9f9f9; */ border-bottom: 2rpx solid #f9f9f9; } .scroll-x .item { flex-shrink: 0; /* margin-right: 16rpx; */ padding: 30rpx 20rpx; padding-top: 0; position: relative; } .scroll-x .item.active::before { content: ''; position: absolute; bottom: 0; left: 36rpx; background-color: red; width: 40rpx; height: 8rpx; background: linear-gradient(144deg, #FA7D22 0%, #FA4622 100%); border-radius: 24rpx; /* border-bottom: 4rpx solid #FA7D22; */ } .scroll-x .item.active text { font-family: PingFangSC-Medium, PingFang SC; color: #FA7D22; } .scroll-x .item text { font-size: 28rpx; color: #999; } .time-box { padding: 30rpx 0; border-bottom: 2rpx solid #f9f9f9; } .time-box .tabs-title { /* padding: 28rpx 0; */ padding-bottom: 28rpx; } .time-box .tabs-title text { color: #999999; position: relative; width: 50%; } .time-box .tabs-title text.active { font-family: PingFangSC-Semibold, PingFang SC; color: #333333; } .time-box .tabs-title text:last-child { text-align: right; } .time-box .tabs-title text:first-child::before { /* content: ""; position: absolute; right: -30%; top: 0; height: 44rpx; width: 2px; background-color: #333333; */ } /* .time-box swiper { min-height: 150px; } */ .time-box .tabs-content { /* display: flex; flex-wrap: wrap; */ display: grid; grid-gap: 30rpx 30rpx; grid-template-columns: repeat(4, 1fr); /* grid-template-rows: repeat(3, 2fr); grid-template-columns: repeat(2, 1fr); */ height: 100%; overflow-y: scroll; } .time-box .tabs-content .item { width: 136rpx; height: 60rpx; border-radius: 16rpx; background: #F9F9F9; color: #333333; font-size: 32rpx; box-sizing: border-box; } .time-box .tabs-content .item.active { font-family: PingFangSC-Medium, PingFang SC; background: #FFF0E6; border-radius: 16rpx; border: 2rpx solid #FA7D22; font-weight: 500; color: #FA7D22; } .time-box .tabs-content .item.no-change { cursor: not-allowed; pointer-events: none; background-color: #F9F9F9; color: #D3D3D3; } .custom-time { height: 120rpx; } .custom-time .input { width: 132rpx; height: 60rpx; box-sizing: border-box; background: #F9F9F9; /* background: #FFFBFC; */ border-radius: 8rpx; /* border: 2rpx solid #FFD3CE; */ font-family: PingFangSC-Medium, PingFang SC; margin-left: 20rpx; } .custom-time .input.active { font-family: PingFangSC-Medium, PingFang SC; background: #FFF0E6; border-radius: 16rpx; border: 2rpx solid #FA7D22; font-weight: 500; color: #FA7D22; } .custom-time image { width: 36rpx; height: 34rpx; /* background-color: red; */ margin-right: 8rpx; } .current-project image { width: 160rpx; height: 160rpx; /* background-color: red; */ margin-right: 20rpx; border-radius: 20rpx; } .project-scroll-x { padding-bottom: 30rpx; } .project-scroll-x .item { flex-shrink: 0; /* margin-right: 28rpx; */ width: 200rpx; } .project-scroll-x .item .project-box { width: 176rpx; height: 200rpx; border-top-left-radius: 16rpx; border-top-right-radius: 16rpx; box-shadow: 0rpx 2rpx 12rpx 0rpx rgba(0, 0, 0, 0.13); overflow: hidden; position: relative; box-sizing: border-box; } .project-scroll-x .item.no-change { opacity: 0.5; cursor: not-allowed; pointer-events: none; } .project-scroll-x .item.active .project-box { border: 2rpx solid #FA7D22; } .project-scroll-x .item .project-img { height: 174rpx; width: 100%; /* background-color: #ccc; */ } .project-scroll-x .item.active .active-img { display: block; } .project-scroll-x .project-box .active-img { width: 40rpx; height: 40rpx; position: absolute; right: 0; top: 0; display: none; } .project-scroll-x .project-box text { width: 100%; background: #FA7D22; font-size: 20rpx; font-family: PingFangSC-Regular, PingFang SC; color: #FFFFFF; text-align: center; } .project-scroll-x .item.active .name { font-family: PingFangSC-Medium, PingFang SC; } .project-scroll-x .item .name { font-size: 28rpx; margin-top: 12rpx; width: 100%; text-align: center; } .flex-column .label { height: 50rpx; font-size: 36rpx; font-family: PingFangSC-Semibold, PingFang SC; font-weight: 600; color: #333333; line-height: 50rpx; } .flex-column .label-tips { font-size: 24rpx; font-family: PingFang-SC-Medium, PingFang-SC; font-weight: 500; color: #FF3007; line-height: 34rpx; } .item-active .item-active-price { height: 100rpx; justify-content: flex-end; } .item-active-content { padding: 30rpx 0; border-bottom: 2rpx solid #F9F9F9; } .item-active-content .change-img { width: 48rpx; height: 48rpx; } .item-active-content .active-project-img { width: 160rpx; height: 160rpx; margin: 0 16rpx; border-radius: 20rpx; background-color: #efefef; } .item-active-content .right text { font-size: 26rpx; color: #999999; } .item-active-content .project-title { height: 40rpx; font-size: 28rpx; font-family: PingFangSC-Medium, PingFang SC; font-weight: 500; color: #333333; line-height: 40rpx; } .item-active-content .tags { height: 28rpx; font-size: 20rpx; font-family: PingFang-SC-Medium, PingFang-SC; font-weight: 500; color: #979797; line-height: 28rpx; } .item-active-content .price2 { font-size: 36rpx; font-family: PingFangSC-Medium, PingFang SC; font-weight: 500; text-align: right; color: #FA4622 !important; line-height: 50rpx; } .btm { height: 170rpx; position: fixed; width: 100%; left: 0; bottom: 0; /* bottom: 56rpx; */ background: #fff; /* padding: 0 28rpx; */ } .btm-btn { width: 100%; height: 84rpx; font-size: 36rpx; color: #FFFFFF; margin: 0 40rpx; background: #FA7D22; border-radius: 42rpx; /* margin-top: 64rpx; */ } /* ==================ListKer===================== */ .showIndexs { position: relative; z-index: 111; } .showSec { position: absolute; z-index: 1111; } .list_first_to { z-index: 110; top: 0rpx; position: fixed; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.7); } .insellShow { width: 390rpx; } .list_top_show { width: 100%; display: flex; align-items: center; flex-direction: column; margin-top: 270rpx; } .list_top_img { width: 40rpx; height: 40rpx; } .list_top_content { padding-top: 15rpx; margin-top: 20rpx; width: 500rpx; height: 75rpx; background: rgba(0, 0, 0, 0.3); border: 2rpx dashed #FFFFFF; } .first_and_title { width: 100%; line-height: 50rpx; text-align: center; font-size: 28rpx; font-weight: 500; color: #FFFFFF; } .first_and_title text { font-size: 32rpx; color: #FFFFFF; } .KnowBtn { margin-left: 271rpx; text-align: center; width: 208rpx; height: 76rpx; border-radius: 42rpx; border: 2rpx solid #FFFFFF; font-size: 32rpx; font-weight: 400; color: #FFFFFF; line-height: 76rpx; position: absolute; bottom: 60rpx; } .KnowBtnSec { text-align: center; width: 208rpx; height: 76rpx; border-radius: 42rpx; border: 2rpx solid #FFFFFF; font-size: 32rpx; font-weight: 400; color: #FFFFFF; line-height: 76rpx; margin-bottom: 100rpx; } .showIndexShow { position: relative; z-index: 111; } .timeSelect { margin-bottom: 15rpx; width: 170rpx; height: 92rpx; background: #FFFFFF; display: flex; align-items: center; justify-content: center; } .timeShow { text-align: center; width: 136rpx; height: 60rpx; line-height: 58rpx; background: #FFF0E6; border-radius: 16rpx; border: 2rpx solid #FA7D22; font-size: 32rpx; font-weight: 500; color: #FA7D22; } .list_Content_show { margin-top: -10rpx; left: 237rpx; z-index: 1111; position: absolute; display: flex; align-items: center; flex-direction: column; } .list_Content_img { width: 40rpx; height: 40rpx; } .list_top_contents { padding-top: 15rpx; margin-top: 20rpx; width: 416rpx; height: 75rpx; background: rgba(0, 0, 0, 0.3); border: 2rpx dashed #FFFFFF; } /* ======================================= */ .list_sec_show { width: 92%; position: absolute; margin-top: -430rpx; z-index: 111; position: absolute; display: flex; align-items: center; flex-direction: column; } .list_sec_content { padding-top: 15rpx; margin-top: 20rpx; width: 372rpx; height: 128rpx; background: rgba(0, 0, 0, 0.3); border: 2rpx dashed #FFFFFF; } .list_sec_img { margin-top: 20rpx; margin-bottom: 20rpx; width: 40rpx; height: 40rpx; } .project-list { width: 100%; height: 100rpx; display: flex; align-items: center; } .peoject-list-title { font-size: 36rpx; color: #333333; font-weight: 500; } .peoject-list-title text { font-size: 36rpx; font-weight: 500; color: #FA7D22; } .peoject-list-time { flex: 1; text-align: right; font-size: 28rpx; font-weight: 400; color: #333333; } .project-content { margin-bottom: 20rpx; width: 100%; display: flex; align-items: center; height: 120rpx; } .project-content-img { border-radius: 12rpx; width: 120rpx; height: 120rpx; } .project-content-right { display: flex; flex-direction: column; flex: 1; height: 120rpx; margin-left: 20rpx; } .item-right-time { flex: 1; width: 100%; margin-top: 10rpx; display: flex; } .item-right-title { font-size: 28rpx; font-weight: 500; color: #292929; flex: 1; } .item-right-title-time { font-size: 28rpx; font-weight: 500; color: #292929; } .item-project-add { margin-bottom: 10rpx; font-size: 24rpx; font-weight: 400; color: #999999; } .btm-down-line { width: 100%; display: flex; align-items: center; } .btm-line-tips { margin-left: 24rpx; font-size: 28rpx; font-weight: 400; color: #333333; } .btm-line-tips-red { font-size: 28rpx; font-weight: 500; color: #FF3007; } .btm-line-tips-money { margin-bottom: 20rpx; flex: 1; font-size: 56rpx; font-weight: 500; color: #FF3007; } .btm-line-submit { width: 338rpx; height: 84rpx; text-align: center; line-height: 84rpx; margin-right: 24rpx; background: #FA7D22; border-radius: 42rpx; font-size: 32rpx; font-weight: 500; color: #FFFFFF; } .storeName { flex: 1; } .open { width: 38rpx; height: 28rpx; } .inLocations { display: flex; align-items: center; } .inLocationImage { width: 24rpx; height: 24rpx; } .inLocationDistance { margin-left: 10rpx; font-size: 24rpx; font-weight: 400; color: #999999; } .inLocationDistance text { font-size: 28rpx; font-weight: 500; color: #333333; } /* 选择店铺弹窗 */ .use-popup { width: 640rpx; background: #FFFFFF; border-radius: 40rpx; padding: 60rpx 48rpx; box-sizing: border-box; position: relative; height: 850rpx; } .use-popup .close-img { width: 56rpx; height: 56rpx; position: absolute; top: 16rpx; right: 16rpx; } .use-popup .text-cotent { text-align: center; margin-top: 8rpx; overflow-y:scroll; height: 100%; overflow-x: hidden; } .list .item { width: 550rpx; background: #F7F8FA; border-radius: 16rpx; padding: 20rpx 40rpx 40rpx 30rpx; box-sizing: border-box; margin-top: 20rpx; display: flex; align-items: center; text-align: left !important; } .list .activeStore { border: 2rpx solid #FA7D22; } .list .item .right { flex-shrink: 0; margin-top: 26rpx; } .list .item .right image{ width: 48rpx; height: 48rpx; } .list .item .left .storeName{ font-weight: 600; } .list .item text:first-child { margin-right: 20rpx; font-size: 32rpx; color: #333; font-weight: 500; } .activeList { margin-top: 40rpx; } .list text:last-child { font-size: 20rpx; color: #999999; margin-top: 20rpx; } .list .adress { display: inline-block; font-size: 24rpx; color: #999999; margin-top: 20rpx; } .use-popup .text-cotent .title { font-size: 34rpx; font-weight: 400; color: #000000; } .skin-popup .wux-landscape__inner { padding: 0 !important; } .skin-popup .popup-index--wux-popup { width: 650rpx !important; max-width: 650rpx !important; }