diff --git a/rc-busness/assets/css/addaddress.less b/rc-busness/assets/css/addaddress.less new file mode 100644 index 00000000..471c5f6f --- /dev/null +++ b/rc-busness/assets/css/addaddress.less @@ -0,0 +1,212 @@ + + + +@media screen and (max-width:768px){ + .usercontend{ + display: flex; + align-items: center; + justify-content: center; + flex-direction: column; + .rc-useaddress{ + textarea{ + display: none; + } + } + .rc-button{ + display: flex; + justify-content: center; + font-size: 14px; + width: 100%; + box-shadow: 0px -3px 6px rgba(0, 0, 0, 0.1); + height: 80px; + align-items: center; + padding:0 20px 0 20px; + span + { + width: 160px; + height: 48px; + border: 2px solid #E2001A; + border-radius: 30px; + display: flex; + align-items: center; + justify-content: center; + color: #E2001A; + } + em{ + font-style: normal; + width: 164px; + height: 48px; + background: #E2001A; + cursor: pointer; + border-radius: 30px; + display: flex; + align-items: center; + justify-content: center; + color: #FFFFFF; + margin-left: 40px; + } + } + .rc-max-width--xl{ + h2{ + display: none; + } + } + + } + +.rc-max-width--xl{ + margin-top: 16px; + input{ + width: 258px; + height: 34px; + border: none; + border-bottom: 1px solid #808285; + color: #999999; + font-size: 16px; + margin-left: 2px; + } + span{ + font-size: 16px; + font-weight: bold; + width: 22%; + text-align: center; + color: #333333; + margin-top: 2px; + } + .rc-people{ + width: 100%; + display: flex; + align-items: center; + span{ + text-align: left; + } + } +// .rc-phone{ + +// } +// .rc-address{ + +// } +// .rc-useaddress{ + +// } + + + +} + + +} + +@media screen and (min-width: 769px) +{ + .usercontend{ + display: flex; + align-items: center; + justify-content: center; + position: relative; + flex-direction: column; + .rc-button{ + display: flex; + justify-content: center; + font-size: 14px; + width: 100%; + box-shadow: 0px -3px 6px rgba(0, 0, 0, 0.1); + height: 80px; + align-items: center; + + padding:0 20px 0 20px; + span + { + width: 160px; + height: 48px; + border: 2px solid #E2001A; + border-radius: 30px; + display: flex; + align-items: center; + justify-content: center; + color: #E2001A; + } + em{ + font-style: normal; + width: 164px; + height: 48px; + background: #E2001A; + cursor: pointer; + border-radius: 30px; + display: flex; + align-items: center; + justify-content: center; + color: #FFFFFF; + margin-left: 40px; + } + } + h2{ + font-size: 26px; + color: #333333; + text-align: center; + font-weight: bold; + } + .rc-useaddress{ + display: flex; + align-items: center; + textarea{ + width: 680px; + height: 118px; + background: #FFFFFF; + border: 1px solid #808285; + opacity: 1; + border-radius: 0px; + padding-top: 12px; + padding-left: 16px; + } + +.userinput{ + display: none; +} + } + } + + +.rc-max-width--xl{ + margin-top: 16px; + input{ + width: 680px; + height: 45px; + border: 1px solid #808285; + color: #999999; + font-size: 16px; + margin-left: 2px; + padding-left: 16px; + } + span{ + font-size: 16px; + font-weight: bold; + width: 10%; + text-align: center; + color: #333333; + margin-top: 2px; + } + .rc-people{ + width: 100%; + display: flex; + align-items: center; + + } + +// .rc-phone{ + +// } +// .rc-address{ + +// } +// .rc-useaddress{ + +// } + + + +} + + +} \ No newline at end of file diff --git a/rc-busness/assets/css/editaddress.less b/rc-busness/assets/css/editaddress.less new file mode 100644 index 00000000..269b6de2 --- /dev/null +++ b/rc-busness/assets/css/editaddress.less @@ -0,0 +1,89 @@ +@media screen and (max-width:768px){ + .rc-button{ + display: flex; + justify-content: center; + font-size: 14px; + width: 100%; + box-shadow: 0px -3px 6px rgba(0, 0, 0, 0.1); + height: 80px; + align-items: center; + position: absolute; + bottom: 0; + padding:0 20px 0 20px; + span + { + width: 160px; + height: 48px; + border: 2px solid #E2001A; + border-radius: 30px; + display: flex; + align-items: center; + justify-content: center; + color: #E2001A; + } + em{ + font-style: normal; + width: 164px; + height: 48px; + background: #E2001A; + cursor: pointer; + border-radius: 30px; + display: flex; + align-items: center; + justify-content: center; + color: #FFFFFF; + margin-left: 40px; + } + } +.rc-max-width--xl{ + margin-top: 16px; + input{ + width: 258px; + height: 34px; + border: none; + border-bottom: 1px solid #808285; + color: #999999; + font-size: 16px; + margin-left: 2px; + } + span{ + font-size: 16px; + font-weight: bold; + width: 22%; + text-align: center; + color: #333333; + margin-top: 2px; + } + .rc-people{ + width: 100%; + display: flex; + align-items: center; + span{ + text-align: left; + } + + + } +// .rc-phone{ + +// } +// .rc-address{ + +// } +// .rc-useaddress{ + +// } + + + +} + + +} + +@media screen and (min-width: 769px) +{ + + + +} \ No newline at end of file diff --git a/rc-busness/assets/css/global.less b/rc-busness/assets/css/global.less index c0f8706f..903d422d 100644 --- a/rc-busness/assets/css/global.less +++ b/rc-busness/assets/css/global.less @@ -8,30 +8,6 @@ body{ .fade-leave-active { opacity: 0; } - -.ts-mask{ - width:100%; - height:100%; - position: fixed; - top:0; - left:0; - display:flex; - flex-direction: column; - justify-content: center; - align-items: center; - z-index:99; - - .ts-mask-bg{ - background-color:#000; - opacity:.6; - width:100%; - height:100%; - z-index:0; - position:absolute; - left:0; - top:0; - } -} .userloding { background: url(../image/onloading.png) center center no-repeat; width: 3.12rem; @@ -393,12 +369,15 @@ img, picture { } .ts-scrollable{ li{ - // width: 4.125rem; + width: 6rem; + overflow: hidden; padding: 0 0.62rem; height: 1.625rem; margin-left: .5rem; font-size:.75rem; - line-height: 1.375rem; + text-overflow:ellipsis; + white-space:nowrap; + line-height: 1.625rem; } &::-webkit-scrollbar{ display:none; @@ -410,6 +389,7 @@ img, picture { /* pc端 */ @media screen and (min-width: 769px) { + /deep/.van-tabs__wrap { max-width: 768px; diff --git a/rc-busness/assets/css/index.less b/rc-busness/assets/css/index.less index 77f4b563..063e45a2 100644 --- a/rc-busness/assets/css/index.less +++ b/rc-busness/assets/css/index.less @@ -5,29 +5,10 @@ /deep/.van-swipe__indicator--active{ background-color: #E1001A; } - -.ts-carousel-indicator{ - /deep/.swiper-pagination-bullet{ - margin-left:.5rem; - } - /deep/.swiper-pagination-bullet-active{ - background:#E2001A; - } - &.center{ - width:100%; - text-align: center; - } -} -.ts-position-identifier{ - -} -.ul-zhuan,.ul-dog{ - li{ - background: unset; - img{ - border-radius: 50%; - } - &.active { +.rc-ma{ + .ul-zhuan{ + li{ + background: unset;; img{ border: 3px solid #E2001A; } @@ -50,30 +31,6 @@ width:auto; } } -.ul-dog{ - width: 100%; - display: flex; - justify-content: center; - flex-wrap: wrap; - flex-direction: row; - - span{ - margin-top: .5rem; - display: block; - } - img{ - width: 9.5rem; - height: auto; - display: block; - } - li{ - cursor: pointer; - font-size: 16px; - text-align: center; - margin-top:3rem; - margin-left:3rem; - } -} @media screen and (max-width:768px){ .ul-dog{ justify-content: space-evenly; @@ -217,6 +174,7 @@ .uservideo{ width: 100%; height:auto; + max-height: 15.68rem; display: block; video{ max-width:100%; @@ -264,10 +222,6 @@ -webkit-box-orient: vertical; max-width: 60%; text-align: center; - word-break: keep-all; - height: 2.625rem; - display: flex; - align-items: center; } em{ font-style: normal; @@ -373,21 +327,14 @@ .rc-selection{ display: none; } - .sw-center{ - display: none; - } - .useraimg{ - width: 100%; - // height: 29.31rem; - object-fit: cover; - } - .ts-banner-swiper-container{ - position:relative; - .ts-carousel-indicator{ - position:absolute; - bottom:.4rem; - } - } + .sw-center{ + display: none; + } +.useraimg{ +width: 100%; +// height: 29.31rem; +object-fit: cover; +} .van-swipe-item { color: #fff; height: 100%; diff --git a/rc-busness/assets/css/integral.less b/rc-busness/assets/css/integral.less index e461175d..cf1c9309 100644 --- a/rc-busness/assets/css/integral.less +++ b/rc-busness/assets/css/integral.less @@ -26,10 +26,7 @@ span{ } } } -.rc-usermain{ - width: 92%; - margin: 0 auto; - +.rc-max-width--xl{ ul{ height: 70px; display: block; diff --git a/rc-busness/assets/css/product-list.less b/rc-busness/assets/css/product-list.less index cf1e3bef..b1fd2b92 100644 --- a/rc-busness/assets/css/product-list.less +++ b/rc-busness/assets/css/product-list.less @@ -9,10 +9,18 @@ ul li ol li em strong i { //rc-main start margin-top:.23rem; .usersearch { + .ts-scrollable-container{ + h2{ + font-weight: bold; + color: #333333; + } + } + margin: 0 auto; overflow: hidden; } + //rc-main end } @@ -24,6 +32,53 @@ ul li ol li em strong i { .usercontentshow{ position: relative; + .rc-productcat { + display: flex; + align-items: center; + flex-wrap: nowrap; + ol{ + display: flex; + align-items: center; + flex-flow: row; + .ts-standard-btn{ + width: 7.87rem; + height: 2.25rem; + background: #FFFFFF; + border-radius: 6.25rem; + background: none; + display: flex; + align-items: center; + justify-content: center; + margin-left: 1rem; + color: #999999; + img { + height: 1rem; + } + span { + margin-left: 0.18rem; + } + } + } + .userrccat{ + width: 32%; + height: 34px; + background: #ffffff; + border-radius: 100px; + display: flex; + align-items: center; + justify-content: center; + margin-left: 0; + font-size: 14px; + span { + margin-left: 3px; + } + img { + width: 24px; + height: 16px; + } + border: 2px solid #E2001A; + } + } .userrccat{ width: 32%; height: 34px; @@ -93,48 +148,7 @@ ul li ol li em strong i { height: 617px; background: white; z-index: 999; - .rc-productcat { - display: flex; - align-items: center; - flex-wrap: nowrap; - .rc-cat { - width: 32%; - height: 34px; - background: #ffffff; - border-radius: 100px; - display: flex; - align-items: center; - justify-content: center; - margin-left: 0; - font-size: 14px; - span { - margin-left: 3px; - } - img { - width: 24px; - height: 16px; - } - } - .userrccat{ - width: 32%; - height: 34px; - background: #ffffff; - border-radius: 100px; - display: flex; - align-items: center; - justify-content: center; - margin-left: 0; - font-size: 14px; - span { - margin-left: 3px; - } - img { - width: 24px; - height: 16px; - } - border: 2px solid #E2001A; - } - } + } @@ -219,6 +233,7 @@ ul li ol li em strong i { justify-content: center; font-size: .14rem; margin-right:.2rem; + margin-left: 16px; span { margin-left: 3px; } @@ -303,6 +318,7 @@ ul li ol li em strong i { //pc端 @media screen and (min-width: 768px){ + .userrccat{ width: 327px; height: 48px; @@ -328,6 +344,7 @@ ul li ol li em strong i { } .online{ width:100%; + margin-top: 17px; &.bold{ height:0.5rem; margin-top: 5rem; @@ -378,7 +395,13 @@ ul li ol li em strong i { } .rc-bottom{ - .rc-productcat { + .rc-productcat { + ol{ + display: flex; + align-items: center; + flex-flow: row; + + } display: flex; align-items: center; flex-wrap: nowrap; @@ -485,7 +508,7 @@ border-radius: 30px; margin-left: 16px; } span { - margin-left: 0px; + margin-left: 4px; } img { width: 24px; @@ -542,18 +565,38 @@ border-radius: 30px; } */ .ts-scrollable-container{ - overflow-y: hidden; - overflow-x: clip; + width: 100%; + margin-top: 18px; h2{ display: flex; align-items: center; width: 4%; } .ts-scrollable{ - overflow-y: hidden; - overflow-x: clip; width: 100%; + ol{ + display: flex; + align-items: center; + } + .ts-standard-btn{ + width: 237px; + height: 48px; +background: #FFFFFF; +border-radius: 30px; +background: none; +display: flex; +align-items: center; +justify-content: center; +margin-left: 40px; +img { +width: 24px; +height: 24px; +} +span { +margin-left: 8px; +} + } } } diff --git a/rc-busness/assets/css/search.less b/rc-busness/assets/css/search.less index 27cce00e..e843f622 100644 --- a/rc-busness/assets/css/search.less +++ b/rc-busness/assets/css/search.less @@ -14,15 +14,6 @@ ul li ol li em strong i { position: relative; margin-top: 5.25rem; - .usersearch { - width: 100%; - margin: 0 auto; - overflow: hidden; - margin-top: 20px; - .rc-padding--md{ - padding: 0; - } - } .active{ border: 2px solid #E2001A; color: #E2001A; @@ -38,6 +29,22 @@ ul li ol li em strong i { } //手机端 @media screen and (max-width: 768px) { + .usersearch { + width: 100%; + margin: 0 auto; + overflow: hidden; + margin-top: 20px; + .ts-scrollable-container{ + h2{ + font-weight: bold; + color: #333333; + +} +} + .rc-padding--md{ + padding: 0; + } + } .rc-button { display: flex; @@ -47,6 +54,9 @@ ul li ol li em strong i { box-shadow: 0px -3px 6px rgba(0, 0, 0, 0.1); height: 80px; align-items: center; + position: absolute; + bottom: 0; + padding:0 20px 0 20px; span { width: 160px; @@ -129,8 +139,9 @@ strong{ color: #333333; margin-top: 1.5rem; h2{ - font-size: 18px; + font-size: 16px; font-weight: bold; + color: #333333; } span { font-size: 14px; @@ -168,6 +179,9 @@ strong{ // 我想搜 .usercontentshow{ position: relative; + .rc-column{ + padding-bottom: 0; + } .rc-productcat { display: flex; align-items: center; @@ -189,13 +203,15 @@ justify-content: center; margin-left: 1rem; color: #999999; img { -width: 1.5rem; height: 1rem; } span { margin-left: 0.18rem; } } + li:first-child{ + margin-left: 0; + } } //筛选 .userselect{ @@ -220,7 +236,7 @@ margin-left: 0.18rem; } .ts-scrollable-container{ - margin-top: 0.93rem; + margin-top: 1rem; } } @@ -236,6 +252,7 @@ margin-left: 0.18rem; } h2{ margin-left: 0; + font-weight: bold; } } @@ -275,22 +292,10 @@ border-radius: 100px; .rc-bottom{ position: fixed; background: white; + height: 617px; bottom: 0; left: 0; z-index: 9; - ol li{ - background: none; - width: 7.87rem; - height: 2.25rem; - background: #FFFFFF; - border-radius: 6.25rem; - background: none; - display: flex; - align-items: center; - justify-content: center; - margin-left: 1rem; - } - } .rc-bottoma{ @@ -376,7 +381,25 @@ border-radius: 100px; } //pc端 @media screen and (min-width: 768px){ + .usersearch { + width: 100%; + margin: 0 auto; + overflow: hidden; + margin-top: 40px; + .ts-scrollable-container{ + h2{ + font-weight: bold; + color: #333333; +} +} + .rc-padding--md{ + padding: 0; + } + } + .online{ + margin-top: 47px; + } /deep/.el-dialog__header { padding: 0; margin: 0; @@ -392,6 +415,7 @@ border-radius: 100px; display: flex; align-items: center; width: 6%; + color: #333333; } .ts-scrollable{ // overflow-y: hidden; @@ -501,9 +525,10 @@ margin-left: 8px; color: #333333; margin-top: 12px; h2 { - font-size: 18px; + font-size: 26px; + font-weight: bold; color: #333333; - margin-left: 12px; + margin: 0; } span { font-size: 14px; @@ -597,13 +622,16 @@ border-radius: 30px; /deep/.van-search__content--square{ background: white; } + /deep/.van-search{ + padding-left: 0; + } .van-search__content--square{ display: flex; align-items: center; justify-content: center; background: white; border: 1px solid #D7D7D7; - height: 80px; + height: 50px; width: 1200px; border-radius: 200px; } @@ -648,9 +676,11 @@ border-radius: 30px; } .rc-product { h2 { - font-size: 18px; + font-size: 26px; + font-weight: bold; color: #333333; - margin-left: 12px; + margin: 0; + } } .rc-productcat { diff --git a/rc-busness/pages/productdetails/productlist.vue b/rc-busness/pages/productdetails/productlist.vue index 8c8ed82c..862c457d 100644 --- a/rc-busness/pages/productdetails/productlist.vue +++ b/rc-busness/pages/productdetails/productlist.vue @@ -11,17 +11,19 @@