This commit is contained in:
952108534@qq.com
2022-01-20 11:52:43 +08:00
parent bfe208efb6
commit e86acd1e85
16 changed files with 27452 additions and 2508 deletions

View File

@@ -8,38 +8,17 @@ body{
.fade-leave-active {
opacity: 0;
}
.ts-no-data{
text-align: center;
margin:3rem 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 {
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;
}
@@ -69,6 +48,8 @@ body{
}
//用户光点
.rc-screen-reader{
width: 0.81rem;
height: 0.81rem;
border-radius: 50%;
position: absolute;
background-color: red;
@@ -78,13 +59,6 @@ body{
width: 0.37rem;
height: 0.37rem;
}
.rc-menu--xs .rc-screen-reader{
left: 30%;
}
.rc-list__link.ts-login--xs .rc-screen-reader{
left:16%;
}
img, picture {
display: block;
max-width: 100%;
@@ -111,8 +85,7 @@ img, picture {
li{
border: 1px solid #D7D7D7;
display: inline-flex;
border-bottom-left-radius: 4px;
border-bottom-right-radius: 4px;
border-radius: 4px;
flex-direction: column;
max-width:10rem;
.rc-column
@@ -144,7 +117,7 @@ img, picture {
}
img{
width:10rem;
min-height:10rem;
height:10rem;
object-fit: contain;
display: flex;
margin: 0 auto;
@@ -256,12 +229,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;
@@ -339,9 +313,6 @@ img, picture {
html {
//font-size:100px;
}
.rc-list__link.ts-login--xs .rc-screen-reader{
left:7%;
}
.rc-md-up {
display: none!important;
}
@@ -352,7 +323,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;
@@ -443,13 +416,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;
@@ -464,7 +432,7 @@ img, picture {
}
}
img{
width:100%;
width:21.7vw;
max-width:320px;
min-width:160px;
}
@@ -571,40 +539,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;
}
/* */
*/
}
}
@@ -626,10 +589,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;
}
}
}

View File

@@ -5,98 +5,47 @@
/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%;
}
&:first-child{
margin-left:0;
}
&.active {
.rc-ma{
.ul-zhuan{
li{
background: unset;;
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{
width:100%;
height: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;
height:100%;
width:auto;
}
}
@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;
@@ -113,14 +62,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;
@@ -150,6 +101,9 @@
}
}
.van-swipe{
z-index: 2;
}
.rc-usermessage{
span{
font-size: 1rem;
@@ -165,12 +119,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;
@@ -182,44 +134,52 @@
display: none;
}
#xxxFullScreen {
background-color: white;
margin-top: 0.40rem;
.swiper-container{
height: 6.45rem;
}
.swiper-container {
width: 100%;
height: 100%;
position: relative;
}
.swiper-container .swiper-wrapper .swiper-slide {
width: 17.25rem;
//height: 6.45rem !important; //Auto adaption
}
background-color: white;
margin-top: 0.40rem;
#swiper1 {
overflow: hidden;
}
.swiper-container{
height: 6.45rem;
}
.swiper-container, .swiper-container2 {
width: 100%;
// overflow: visible !important;
height: 100%;
position: relative;
}
#swiper1 .swiper-container .swiper-wrapper .swiper-slide {
width: 17.25rem;
//height: 6.45rem !important; //Auto adaption
}
/* 上一张 */
swiper-container .swiper-wrapper .swiper-slide-prev {
margin-top: 0.05rem;
height: 100%;
}
/* 下一张 */
.swiper-container .swiper-wrapper .swiper-slide-next {
margin-top: 0.05rem;
height: 100%;
}
.swiper-container .swiper-wrapper .swiper-slide-active {
height: 100%;
}
.uservideo{
width: 100%;
height:auto;
display: block;
video{
max-width:100%;
max-height:100%;
}
/* 上一张 */
#swiper1 .swiper-container .swiper-wrapper .swiper-slide-prev {
margin-top: 0.05rem;
height: 100%;
}
/* 下一张 */
#swiper1 .swiper-container .swiper-wrapper .swiper-slide-next {
margin-top: 0.05rem;
height: 100%;
}
.swiper-container .swiper-wrapper .swiper-slide-active {
height: 100%;
}
.uservideo{
width: 100%;
height:auto;
max-height: 15.68rem;
display: block;
video{
max-width:100%;
max-height:100%;
}
}
}
.sw-center{
width: 100%;
display: flex;
@@ -232,9 +192,8 @@
width: 100%;
display: flex;
flex-direction: column;
justify-content: flex-start;
justify-content: center;
align-items: center;
vertical-align: top;
}
img{
width: 10rem;
@@ -250,7 +209,6 @@
margin-top: 1.25rem;
}
p{
color: #666666;
font-size: .875rem;
text-overflow: -o-ellipsis-lastline;
overflow: hidden;
@@ -273,14 +231,16 @@
/* 中间的图片 */
.swiper-container .swiper-wrapper .swiper-slide-active {
height: 165px !important;
}
.swiperWrap{
height: 469px;
width: 100%;
height: 469px;
width: 100%;
img{
height: 469px;
width: 100%;
height: 469px;
width: 100%;
}
/deep/.swiper-pagination-bullet-active{
background: red;
@@ -341,22 +301,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)
@@ -364,24 +324,14 @@
.rc-selection{
display: none;
}
.sw-center{
display: none;
}
.useraimg{
width: 100%;
// height: 29.31rem;
object-fit: cover;
}
.ts-banner-swiper-container{
position:relative;
img{
margin:0 auto;
}
.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%;
@@ -400,12 +350,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 {
@@ -414,10 +367,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 {
@@ -565,18 +518,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;
}
}
@@ -591,7 +540,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%;

View File

@@ -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;
@@ -55,13 +53,11 @@
}
.container {
font-size: 0.1rem;
background-color:#fff;
.van-field__body {
border-bottom: 1px solid red;
}
.content {
margin-top: 24px;
box-shadow: unset;
}
.userfoget {
font-size: 14px;

View File

@@ -3,9 +3,7 @@
.rc-margin-bottom--lg{
margin: 0;
}
.usercontend {
display:inline-block;
}
@media screen and (max-width:768px){
.online{
@@ -48,7 +46,7 @@ color: #FFFFFF;
}
.rc-max-width--xl{
padding: 24px 20px 24px 20px;
.rc-title {
display: flex;
align-items: center;
@@ -117,6 +115,9 @@ color: #FFFFFF;
@media screen and (min-width: 769px)
{
.usercontend {
display:inline-block;
}
.usercontshow{
.rc-button{
display: none;