From d0addceabe10f0271d84455008ca4a6b7444a8b7 Mon Sep 17 00:00:00 2001 From: Vion Date: Mon, 24 Jan 2022 12:01:28 +0800 Subject: [PATCH] iPhone font size fixed, index mobile video player added --- rc-busness/assets/css/global.less | 30 ++++-- rc-busness/assets/css/index.less | 64 +++++++++--- rc-busness/assets/css/mypersonal.less | 3 + rc-busness/assets/css/orderquantity.less | 12 +-- rc-busness/assets/css/search.less | 2 +- rc-busness/assets/css/usermember.less | 9 +- rc-busness/assets/image/btn-close.png | Bin 0 -> 1100 bytes rc-busness/assets/image/btn-play.png | Bin 0 -> 4411 bytes rc-busness/components/header.vue | 2 +- rc-busness/pages/index.vue | 64 +++++++----- rc-busness/pages/personal/mypersonal.vue | 2 +- rc-busness/pages/personal/usermember.vue | 92 +++++++++--------- rc-busness/pages/productdetails/producted.vue | 2 +- 13 files changed, 176 insertions(+), 106 deletions(-) create mode 100644 rc-busness/assets/image/btn-close.png create mode 100644 rc-busness/assets/image/btn-play.png diff --git a/rc-busness/assets/css/global.less b/rc-busness/assets/css/global.less index f9ca05fc..555128fe 100644 --- a/rc-busness/assets/css/global.less +++ b/rc-busness/assets/css/global.less @@ -4,6 +4,12 @@ body { line-height: 1.5; color: #666; } +div[data-js-modal-menu] { + display:none; +} +aside div[data-js-modal-menu] { + display:block; +} .el-message-box .el-button--primary{ background-color: #e1001a !important; color:#fff; @@ -25,7 +31,6 @@ body { text-align: center; margin: 3rem 0; } - .ts-mask { width: 100%; height: 100%; @@ -37,7 +42,15 @@ body { justify-content: center; align-items: center; z-index: 99; - + .ts-mask-close{ + position:absolute; + top:1rem; + right:1rem; + width:1rem; + height:1rem; + background: url("../image/btn-close.png") center center no-repeat; + background-size:contain; + } .ts-mask-bg { background-color: #000; opacity: .6; @@ -53,10 +66,11 @@ input[type=checkbox]{ position:relative; cursor: pointer; border:none; - border: 1px solid #d7d7d7; + //border: 1px solid #d7d7d7; border-radius: 3px; width: 1.5rem; height: 1.5rem; + -webkit-appearance:none; &:before { top: 0; left: 0; @@ -323,12 +337,12 @@ picture { border-radius: .25rem; z-index:11; ul{ - width: 60px; - height: 181px; + width: 3.75rem; + height: 11.3rem; background-color: white; display: flex; flex-direction: column; - + justify-content: space-between; li { width: 100%; display: flex; @@ -350,7 +364,7 @@ picture { } span { - font-size: 0.12rem; + font-size: .75rem; } .tuntop { @@ -411,7 +425,7 @@ picture { } label { input[type=checkbox] { - top:.25rem; + top:0rem; } } .rc-header__nav--primary{ diff --git a/rc-busness/assets/css/index.less b/rc-busness/assets/css/index.less index 112b95dc..c8465ce9 100644 --- a/rc-busness/assets/css/index.less +++ b/rc-busness/assets/css/index.less @@ -20,6 +20,14 @@ } .ts-position-identifier{ +} +.ts-mobile-player-container { + video { + width:100%; + height:auto; + position: relative; + z-index:2; + } } .ul-zhuan,.ul-dog{ li{ @@ -83,6 +91,7 @@ } li{ margin-top:1.875rem; + margin-left:0; } } .ts-banner-swiper-container{ @@ -211,9 +220,29 @@ width: 100%; height:auto; display: block; - video{ - max-width:100%; - max-height:100%; + position:relative; + z-index:0; + &:before{ + content:""; + background:#000; + opacity:.6; + position:absolute; + width:100%; + height:100%; + left:0; + top:0; + z-index:1; + } + &:after{ + content:""; + position:absolute; + top:0; + left:0; + width:100%; + height:100%; + background:url("../image/btn-play.png") center center no-repeat; + background-size:90px 90px; + z-index:2; } } } @@ -225,19 +254,32 @@ align-items: center; border: 1px solid #d7d7d7; border-radius:4px; + img{ + object-fit: cover; + display: block; + z-index:0; + } .rc-click{ width: 100%; display: flex; flex-direction: column; justify-content: flex-start; align-items: center; + img{ + width: 100%; + height: auto; + position:relative; + } } - img{ - width: 10rem; - height: 10rem; - object-fit: cover; - display: block; - margin-top: 2.5rem; + .click-zone{ + align-items: center; + display: flex; + flex-direction: column; + img{ + width: 10rem; + height: 10rem; + margin-top: 2.5rem; + } } span{ font-size: 1.125rem; @@ -348,13 +390,13 @@ // } } .active { - font-size: 0.14rem; + font-size: .875rem; img{ border-width: 1px; } } .unactive { - font-size: 0.14rem; + font-size: .875rem; img{ border-width: 1px; } diff --git a/rc-busness/assets/css/mypersonal.less b/rc-busness/assets/css/mypersonal.less index 9b2d6dc8..5f1e2887 100644 --- a/rc-busness/assets/css/mypersonal.less +++ b/rc-busness/assets/css/mypersonal.less @@ -253,6 +253,9 @@ ul li ol li em strong i { width: 440px; height: 652px; } +.ts-crumbs { + padding-left:.25rem; +} .ts-mypersonal{ margin-left:0; .rc-column{ diff --git a/rc-busness/assets/css/orderquantity.less b/rc-busness/assets/css/orderquantity.less index 941f6a66..408f6ec0 100644 --- a/rc-busness/assets/css/orderquantity.less +++ b/rc-busness/assets/css/orderquantity.less @@ -288,12 +288,12 @@ border: 1px solid #D8D8D8; margin-left: 40px; - img { - width: 96px; - height: 96px; - display: block; - object-fit: contain; - } + img { + width: 96px; + height: 96px; + display: block; + object-fit: contain; + } } .rc-right { diff --git a/rc-busness/assets/css/search.less b/rc-busness/assets/css/search.less index 23f69fe2..bf719986 100644 --- a/rc-busness/assets/css/search.less +++ b/rc-busness/assets/css/search.less @@ -289,7 +289,7 @@ border-radius: 100px; .rc-bottom{ position: fixed; background: white; - height: 617px; + height: 21.875rem; bottom: 0; left: 0; z-index: 9; diff --git a/rc-busness/assets/css/usermember.less b/rc-busness/assets/css/usermember.less index 1d08b84a..c59d05b5 100644 --- a/rc-busness/assets/css/usermember.less +++ b/rc-busness/assets/css/usermember.less @@ -152,10 +152,11 @@ ul li ol li em strong i { } - .rc-value{ - display: flex; - justify-content: space-between; - } + .rc-value{ + display: flex; + justify-content: space-between; + cursor: pointer; + } } .usermember{ diff --git a/rc-busness/assets/image/btn-close.png b/rc-busness/assets/image/btn-close.png new file mode 100644 index 0000000000000000000000000000000000000000..7fbfe3d07fdbc91780d7df3ea9899692f71dfb82 GIT binary patch literal 1100 zcmV-S1he~zP)CK z!IR($?jmkTR1^;)5j=Vmyy#Vp#vMfj#fw|}eW81-bh@ivRaf`44aL+K8hrQp67cs-=oh5zsYg3sUr5A{6OVT6Nw4-n3T9F#`~__Y&$M zI`cJ-^aHA`3XVZ*7j#_7aEKEBpe-O2Eo2V0YJ@l3F@ZzO|79@X_Fzn62ZrA>0azP$ zVz`#NLEl=O@S?^c0(C(f3&+1i6N0_NKC{XMvjrLgW#L$9U@kzzpsEDs3X}?^fU!8# zG|5w#V*uKK^PZOGP*P*s#cOa54$KSk%d)}p0%bZClUsl_qj>PnB-bVcT90#G(48pL zDNC@Am_H*Am@gosQ)Pkq1QJ7806 zIK@#At6Xk}ygC&X4_7d+K)G`&=?Zej7K}i<5ORkd9ZucNOHL*7OA1y9kawq)s<;pR z9>cf)6%I}C>5%uFQh;`%e-KR)1)ngFcOE}{!bwgnJ|A+*1}HwRcQ9{IjzEQgd4Y<6 z4jC-{hVk*5IUf*)P2#Z7Ow0`hpiMab2}2HT$M{J!-g!*cfnjWBo?pK~rUTzI0a>Z69HUU^Sp?DEX zEA0eoSjg$VL1<cUk3*EqS2xK7@)oX#RgM0L+B#3KIlF}(SHG({3~Jq SW7t*z0000Ek+1lmp2^@1vA3o_=SBj
    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