diff --git a/rc-busness/assets/css/global.less b/rc-busness/assets/css/global.less index c0f8706f..8a669da3 100644 --- a/rc-busness/assets/css/global.less +++ b/rc-busness/assets/css/global.less @@ -33,10 +33,16 @@ body{ } } .userloding { + position: fixed; + left: 50%; + margin-left: -1.56rem; + top: 50%; + margin-top: -3.75rem; background: url(../image/onloading.png) center center no-repeat; width: 3.12rem; background-size: contain; - height: 3.12rem; + height: 7.5rem; + z-index: 1000; animation: rolling 4s infinite; -webkit-animation:rolling 4s infinite; } @@ -247,12 +253,13 @@ img, picture { right: 0; top: 30%; background: #FFFFFF; - box-shadow: 0 0 10px rgba(0, 0, 0, 0.16); + box-shadow: 0px 0px .62rem rgba(0, 0, 0, 0.16); border-radius: .25rem; z-index:3; ul{ width: 60px; height: 181px; + box-shadow: 0px 0px 6px rgb(0 0 0 / 10%); background-color: white; display: flex; flex-direction: column; @@ -340,7 +347,9 @@ img, picture { margin-top: 90px; } .rc-list__header { - + background: none; + padding: .5rem 0; + border-bottom: none; } .ts-right-arr { border-bottom:1px solid #E1001A; @@ -427,13 +436,8 @@ img, picture { display:block; li{ max-width:20rem; - min-width:18.75rem; - width:22.8vw; //margin-right:.875rem; - margin-left:2vw; - padding-left:1px; - padding-right:1px; - box-sizing: border-box; + margin-left:2.2vw; .rc-column{ span{ font-size:1.875rem; @@ -448,7 +452,7 @@ img, picture { } } img{ - width:100%; + width:21.7vw; max-width:320px; min-width:160px; } @@ -555,40 +559,35 @@ img, picture { } h2{ font-size:20px; - padding-bottom:1rem; } .ts-scrollable { - padding-bottom:1rem; - scrollbar-width: thin; li { margin-left: 30px; width: 8.125rem; height: 2.5rem; - //line-height: 40px; + line-height: 40px; font-size: .875rem; - padding:.375rem; } - + /* &::-webkit-scrollbar{ - height: 6px; - width:50%; - background:transparent; + background:unset; + height:4px; } &::-webkit-scrollbar-thumb{ background-color:#d7d7d7; - border-radius:10px; - width:50%; + height:2px; } &::-webkit-scrollbar-track{ - //background-color:#ddd; - background-color:transparent; + background-color:ddd; + + height:2px; } &::-webkit-scrollbar-button{ background:unset; } - /* */ + */ } } @@ -610,10 +609,10 @@ img, picture { { .ts-product-list { display:flex; - //justify-content: space-between; + justify-content: space-between; li{ - //margin-left:0; - //margin-right:0; + margin-left:0; + margin-right:0; } } } \ No newline at end of file diff --git a/rc-busness/assets/css/index.less b/rc-busness/assets/css/index.less index 77f4b563..67008c80 100644 --- a/rc-busness/assets/css/index.less +++ b/rc-busness/assets/css/index.less @@ -29,20 +29,24 @@ } &.active { img{ - border: 3px solid #E2001A; + border-radius: 50%; } - color: #E2001A; - - } - &.unactive { - color: #444444; - img{ - border: 3px solid #D7D7D7; + &.active { + img{ + border: 3px solid #E2001A; + } + color: #E2001A; + + } + &.unactive { + color: #444444; + img{ + border: 3px solid #D7D7D7; + } } } } } - .uservideo{ overflow: hidden; video{ @@ -76,24 +80,15 @@ } @media screen and (max-width:768px){ .ul-dog{ - justify-content: space-evenly; - img{ - width:4rem; - height:auto; - } - li{ - margin-top:1.875rem; - } + display: none; } - .ts-banner-swiper-container{ - margin-bottom:2.5rem; - } - .searchBara{ + .searchBara{ + position: fixed; width: 100%; position: fixed; - top:3.75rem; + top:66px; background: white; - z-index: 60; + z-index: 9999; overflow-x: auto; white-space: nowrap; overflow-y:hidden; @@ -110,14 +105,16 @@ display: inline-block; margin-left: 0.20rem; text-align: center; + background: #F6F6F6; border-radius: 50%; opacity: 1; } - } - .rc-login{ - width: 92%; - margin:0 auto; - } + } + + .rc-login{ + width: 92%; + margin:0 auto; + } .userunlogin{ width: 100%; height: 0.60rem; @@ -147,6 +144,9 @@ } } + .van-swipe{ + z-index: 2; + } .rc-usermessage{ span{ font-size: 1rem; @@ -162,12 +162,10 @@ height: auto; object-fit: cover; } - - .van-swipe{ - z-index: 2; - } + .van-swipe-item { color: #fff; + height: 26.31rem; width: 100%; font-size: 0.20px; text-align: center; @@ -236,7 +234,7 @@ width: 100%; display: flex; flex-direction: column; - justify-content: flex-start; + justify-content: center; align-items: center; } img{ @@ -253,7 +251,6 @@ margin-top: 1.25rem; } p{ - color: #666666; font-size: .875rem; text-overflow: -o-ellipsis-lastline; overflow: hidden; @@ -350,22 +347,22 @@ } } + .active { + font-size: 0.14rem; + img{ + border-width: 1px; + } + } + .unactive { + font-size: 0.14rem; + img{ + border-width: 1px; + } + } // .usermain{ // display: none; // } } -.active { - font-size: 0.14rem; - img{ - border-width: 1px; - } -} -.unactive { - font-size: 0.14rem; - img{ - border-width: 1px; - } -} @media screen and (min-width: 769px) @@ -406,12 +403,15 @@ #xxxFullScreen { background-color: white; // margin-top: 100px; - #swiper1,#swiper2 { + #swiper1 { + width: 100%; overflow: hidden; margin-top: 2.31rem; - } - h2{ - padding-bottom: 5rem; + + h2{ + padding-bottom: 5rem; + } + } .swiper-container2 { @@ -420,10 +420,10 @@ // overflow: visible !important; position: relative; } - #swiper1 .swiper-container .swiper-wrapper .swiper-slide { - width: 100%; - //height: 6.18rem; - } +#swiper1 .swiper-container .swiper-wrapper .swiper-slide { + width: 100%; + //height: 6.18rem; +} /* 上一张 */ #swiper1 .swiper-container .swiper-wrapper .swiper-slide-prev { @@ -571,18 +571,14 @@ img{ display: block; } img{ - width:100%; - height: auto; - object-fit: contain; + width: 10vw; + height: 10vw; display: block; } li{ - width: 10vw; - max-width:11rem; cursor: pointer; font-size: 16px; text-align: center; - overflow:hidden; } } @@ -597,7 +593,33 @@ img{ } .usermain{ - + .ul-dog{ + width: 100%; + display: flex; + justify-content: center; + flex-wrap: wrap; + flex-direction: row; + + span{ + margin-top: 2.5rem; + display: block; + } + img{ + width: 9.5rem; + height: 9.5rem; + display: block; + } + li{ + cursor: pointer; + font-size: 16px; + width: 9.875rem; + text-align: center; + height: 9.875rem; + background: #F6F6F6; + border-radius: 50%; + margin-left:3rem; + } + } } .rc-main{ width: 100%; diff --git a/rc-busness/assets/css/login.less b/rc-busness/assets/css/login.less index f166c777..8ba135c4 100644 --- a/rc-busness/assets/css/login.less +++ b/rc-busness/assets/css/login.less @@ -1,9 +1,7 @@ .container{ - min-height:100vh; + min-height:80vh; height:100%; background-color:#f6f6f6; - display: flex; - flex-direction: column; } .ts-max-width--460{ border-radius: 3px; diff --git a/rc-busness/assets/css/openaddress.less b/rc-busness/assets/css/openaddress.less index 689de33e..265696d3 100644 --- a/rc-busness/assets/css/openaddress.less +++ b/rc-busness/assets/css/openaddress.less @@ -1,11 +1,310 @@ -@media screen and (max-width:768px){ +.rc-margin-bottom--lg{ + margin: 0; +} + + +@media screen and (max-width:768px){ + .online{ + width:100%; + background:#d7d7d7; + margin-top:1.5rem; + height:.06rem; + &.bold{ + height:8px; + background:#f6f6f6; + } + } + .useredit{ + display: none; + } + .rc-button{ + display: flex; + align-items: center; + justify-content: center; + width: 375px; +height: 80px; +background: #FFFFFF; +box-shadow: 0px -3px 6px rgba(0, 0, 0, 0.1); +opacity: 1; +border-radius: 0px; + } + .rc-footbutton { + width: 164px; +height: 48px; +border: 2px solid #E2001A; +opacity: 1; +border-radius: 30px; +background: #E2001A; +display: flex; +justify-content: center; +align-items: center; +font-size: 16px; +color: #FFFFFF; + + + } +.rc-max-width--xl{ + padding: 24px 20px 24px 20px; + .rc-title { + display: flex; + align-items: center; + color: #333333; + font-size: 14px; + em { + font-style: normal; + font-size: 14px; + } + span { + display: block; + margin-left: 8px; + } + } + .rc-center{ + padding-top: 24px; + } + +} + + + + .rc-address { + margin-top: 8px; + text-overflow: -o-ellipsis-lastline; + overflow: hidden; + text-overflow: ellipsis; + display: -webkit-box; + -webkit-line-clamp: 2; + line-clamp: 2; + -webkit-box-orient: vertical; + font-size: 14px; + color: #333333; + } + .rc-footer { + display: flex; + justify-content: space-between; + align-items: center; + margin-top: 20px; + display: flex; + align-items: center; + .rc-right { + span { + border-bottom: 1px solid #666666; + } + span:first-child { + margin-right: 16px; + } + } + img{ + width: 43px; + } + .rc-foot{ + display: flex; + align-items: center; + color: #333333; + font-size: 14px; + span{ + margin-left: 8px; + } + } + } + } @media screen and (min-width: 769px) + { + .usercontend { + display:inline-block; +} + .usercontshow{ + .rc-button{ + display: none; + } + } + + .usercontend{ + margin-top: 40px; + } + .online{ + display: none; + } + .rc-button{ + display: none; + } + .useredit{ + width: 680px; +height: 164px; +background: #FFFFFF; +border: 1px solid #D7D7D7; +opacity: 1; +border-radius: 3px; +display: flex; +align-items: center; +justify-content: center; +img{ + width: 31px; + height: 31px; +} +span{ + color: #333333; + font-size: 18px; +} + } + .usercontend{ + .useradd{ + width: 680px; +height: 164px; +background: #FFFFFF; +border-radius: 3px; +img{ + width: 31px; + height: 31px; + display: block; +} + } + +} + .rc-max-width--xl{ + + .rc-center{ + margin-top: 24px; + margin-left: 24px; + } + .rc-cat{ + width: 640px; + border: 1px solid #D7D7D7; + border-radius: 3px; + position: relative; + margin-left: 40px; + height: 164px; + } + .rc-title { + display: flex; + align-items: center; + color: #333333; + font-size: 20px; + em { + font-style: normal; + } + span { + display: block; + margin-left: 32px; + font-size: 20px; + } + } + .rc-footer { + display: flex; + justify-content: space-between; + align-items: center; + margin-top: 20px; + display: flex; + align-items: center; + .rc-right { + position: absolute; + right: 24px; + top: 24px; + span { + border-bottom: 1px solid #666666; + } + span:first-child { + margin-right: 16px; + } + } + img{ + width: 43px; + } + .rc-foot{ + display: flex; + align-items: center; + color: #333333; + font-size: 16px; + margin-top: 16px; + span{ + margin-left: 8px; + } + } + } + + } + .rc-max-width--xl{ + + + .rc-button { + height: 80px; + background: #ffffff; + box-shadow: 0px -3px 6px rgba(0, 0, 0, 0.1); + opacity: 1; + display: flex; + align-items: center; + justify-content: center; + display: block; + + .rc-footbutton { + width: 164px; + height: 48px; + border: 2px solid #e2001a; + opacity: 1; + border-radius: 30px; + display: flex; + align-items: center; + background: #e2001a; + span { + display: block; + text-align: center; + color: white; + font-size: 16px; + width: 100%; + } + } + } + .rc-header { + display: flex; + align-items: center; + color: #333333; + em { + font-style: normal; + font-size: 14px; + } + span { + display: block; + margin-left: 8px; + } + } + .rc-address { + margin-top: 16px; + text-overflow: -o-ellipsis-lastline; + overflow: hidden; + text-overflow: ellipsis; + display: -webkit-box; + -webkit-line-clamp: 2; + line-clamp: 2; + -webkit-box-orient: vertical; + font-size: 20px; + color: #333333; + + } + .rc-footer { + display: flex; + justify-content: space-between; + align-items: center; + padding-bottom: 20px; + margin-top: 8px; + .rc-right { + span { + border-bottom: 1px solid #666666; + } + span:first-child { + margin-right: 16px; + } + } + } + + + } + } \ No newline at end of file diff --git a/rc-busness/assets/image/Forms-Switch-Off@3x.png b/rc-busness/assets/image/userselect.png similarity index 100% rename from rc-busness/assets/image/Forms-Switch-Off@3x.png rename to rc-busness/assets/image/userselect.png diff --git a/rc-busness/components/header.vue b/rc-busness/components/header.vue index 3c121957..7c10461f 100644 --- a/rc-busness/components/header.vue +++ b/rc-busness/components/header.vue @@ -58,6 +58,11 @@ --> + + + translations.feature.headerbar.pin + + @@ -70,16 +75,16 @@
+ + + + +