Skip to content

H
h5-base
Commit 11946771 authored by chenyishuai@singsingenglish.com's avatar chenyishuai@singsingenglish.com
Browse files
Options

ss

parent ec6bf7ce
Hide whitespace changes
Inline Side-by-side
Showing with 1274 additions and 1276 deletions
.babelrc
View file @ 11946771
......@@ -10,6 +10,6 @@
"stage-2"
],
"plugins": ["transform-vue-jsx", "transform-runtime",
["import", [{ "libraryName": "vant","libraryDirectory":"es","style": true },{ "libraryName": "mint-ui","libraryDirectory":"es","style": true }]]
["import", [{ "libraryName": "vant","libraryDirectory":"es","style": true }]]
]
}
index.html
View file @ 11946771
......@@ -8,11 +8,11 @@
<meta name="x5-orientation" content="portrait"><!-- QQ强制竖屏 -->
<title>唱唱启蒙英语</title>
<script>
// setSize();
// addEventListener('resize',setSize);
// function setSize() {
// document.documentElement.style.fontSize = document.documentElement.clientWidth/375*10+'px';
// }
setSize();
addEventListener('resize',setSize);
function setSize() {
document.documentElement.style.fontSize = document.documentElement.clientWidth/375+'px';
}
</script>
<link rel="stylesheet" href="https://at.alicdn.com/t/font_822651_g9r2j7kybxu.css">
<style>
......
src/components/activity/liuyi.vue
View file @ 11946771
......@@ -273,22 +273,22 @@ export default {
background: #fff5e5;
overflow: hidden;
width: 100%;
// padding-top: 203 * @toVw;
// padding-top: 203rem;
.news {
position: absolute;
width: 170 * @toVw;
height: 19 * @toVw;
top: 10 * @toVw;
line-height: 19 * @toVw;
border-radius: 19 * @toVw;
width: 170rem;
height: 19rem;
top: 10rem;
line-height: 19rem;
border-radius: 19rem;
overflow: hidden;
text-align: center;
left: 102 * @toVw;
font-size: 10 * @toVw;
left: 102rem;
font-size: 10rem;
.shadow {
position: absolute;
width: 170 * @toVw;
height: 19 * @toVw;
width: 170rem;
height: 19rem;
top: 0;
left: 0;
background: rgba(25, 38, 99, 1);
......@@ -301,7 +301,7 @@ export default {
// display: flex;
.name {
display: inline-block;
max-width: 50 * @toVw;
max-width: 50rem;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
......@@ -317,55 +317,55 @@ export default {
.luckBox {
width: 100%;
position: absolute;
top: 203 * @toVw;
top: 203rem;
text-align: center;
overflow: hidden;
img {
width: 320 * @toVw;
width: 320rem;
}
.radius{-webkit-transform:rotate(30deg); }
.point {
position: absolute;
top: 103 * @toVw;
width: 98 * @toVw;
// height: 102 * @toVw;
left: 139 * @toVw;
top: 103rem;
width: 98rem;
// height: 102rem;
left: 139rem;
}
.text {
position: absolute;
top: 137 * @toVw;
width: 98 * @toVw;
left: 139 * @toVw;
font-size: 19 * @toVw;
top: 137rem;
width: 98rem;
left: 139rem;
font-size: 19rem;
color: white;
font-weight: bold;
}
.imgLight {
width: 318 * @toVw;
width: 318rem;
position: absolute;
top: 2 * @toVw;
left: 30 * @toVw;
top: 2rem;
left: 30rem;
}
}
.textBox1 {
color: #b4513e;
font-size: 14 * @toVw;
font-size: 14rem;
position: absolute;
top: 533 * @toVw;
top: 533rem;
width: 100%;
text-align: center;
}
.textBox2 {
position: absolute;
top: 669 * @toVw;
top: 669rem;
text-align: left;
width: 100%;
font-size: 12 * @toVw;
font-size: 12rem;
color: #424242;
p {
width: 277 * @toVw;
margin-bottom: 16 * @toVw;
line-height: 18 * @toVw;
width: 277rem;
margin-bottom: 16rem;
line-height: 18rem;
}
}
.van-popup {
......@@ -373,36 +373,36 @@ export default {
width: 100%;
.close {
position: absolute;
right: 40 * @toVw;
width: 25 * @toVw;
top: 70 * @toVw;
right: 40rem;
width: 25rem;
top: 70rem;
}
.main {
width: 100%;
}
.price {
position: absolute;
left: 150 * @toVw;
top: 290 * @toVw;
left: 150rem;
top: 290rem;
color: #eb4e2c;
font-weight: bold;
span {
font-size: 50 * @toVw;
font-size: 50rem;
}
}
.btn {
display: inline-block;
position: absolute;
left: 84 * @toVw;
top: 440 * @toVw;
width: 205 * @toVw;
height: 42 * @toVw;
left: 84rem;
top: 440rem;
width: 205rem;
height: 42rem;
text-align: center;
line-height: 42 * @toVw;
line-height: 42rem;
background: #f9ea7e;
font-weight: bold;
color: #eb4e2c;
border-radius: 90 * @toVw;
border-radius: 90rem;
}
}
}
......
src/components/bindMobile.vue
View file @ 11946771
......@@ -193,17 +193,17 @@
@import "../util/public";
.banner-block{
text-align: center;
margin: 40 * @toVw auto;
margin: 40rem auto;
img{
width: 142 * @toVw;
width: 142rem;
}
}
.form-block{
padding: 20 * @toVw;
padding: 20rem;
.input-block{
height: 60 * @toVw;
height: 60rem;
border-bottom: 1*@toVw solid #cccccc;
margin-bottom: 20 * @toVw;
margin-bottom: 20rem;
position: relative;
.right-btn{
position: absolute;
......@@ -211,7 +211,7 @@
top: 17*@toVw;
}
input{
padding: 10 * @toVw 0;
padding: 10rem 0;
font-size:14*@toVw;
background: transparent;
font-family:PingFangSC-Semibold;
......@@ -262,9 +262,9 @@
.btn-block{
text-align: center;
.btn{
width: 236 * @toVw;
height: 37 * @toVw;
line-height: 37 * @toVw;
width: 236rem;
height: 37rem;
line-height: 37rem;
background:rgba(96,173,240,1);
border-radius:4*@toVw;font-size:14*@toVw;
font-family:PingFangSC-Semibold;
......@@ -292,6 +292,6 @@
left: 0;
right: 0;
bottom: 0;
width: 375 * @toVw;
width: 375rem;
}
</style>
src/components/buy/activity.vue
View file @ 11946771
......@@ -404,20 +404,20 @@
}
.inviteContainer {
position: relative;
margin: 128 / 2 * @toVh 29 / 2 * @toVw 30 * @toVw 29 / 2 * @toVw;
margin: 128 / 2 * @toVh 29 / 2rem 30rem 29 / 2rem;
min-height: 100px;
text-align: center;
background-color: #fff;
border-radius: @borderRadius;
padding-top: 110 / 2 * @toVw;
padding-top: 110 / 2rem;
padding-bottom: 38 / 2 * @toVh;
}
.invite-title {
position: absolute;
width: 450 / 2 * @toVw;
width: 450 / 2rem;
left: 50%;
margin-left: -450 / 4 * @toVw;
top: -50 / 2 * @toVw;
margin-left: -450 / 4rem;
top: -50 / 2rem;
height: auto;
}
.invite-icon{
......@@ -427,8 +427,8 @@
right: -15*@toVw;
}
.invite-list {
margin-left: 32 / 2 * @toVw;
margin-right: 32 / 2 * @toVw;
margin-left: 32 / 2rem;
margin-right: 32 / 2rem;
padding: 28 / 2 * @toVh;
border: 2*@toVw solid #f6234e;
border-radius: @borderRadius;
......@@ -456,7 +456,7 @@
color: #f6234e;
}
.p-list {
margin: 0 32 / 2 * @toVw;
margin: 0 32 / 2rem;
padding: 0;
li {
display: flex;
......@@ -464,10 +464,10 @@
justify-content: space-between;
align-items: center;
margin: 0;
padding: 8 * @toVw;
padding: 8rem;
img {
width: 74 / 2 * @toVw;
height: 74 / 2 * @toVw;
width: 74 / 2rem;
height: 74 / 2rem;
margin-right: 5px;
border-radius: 50%;
}
......@@ -477,19 +477,19 @@
margin: 0;
}
.moreBtn {
width: 220 / 2 * @toVw;
width: 220 / 2rem;
height: auto;
}
.invite-btn {
position: fixed;
bottom: 0;
width: 100%;
padding-top: 10 * @toVw;
padding-top: 10rem;
box-sizing: content-box;
text-align: center;
background-color: #fff;
img {
width: 504 / 2 * @toVw;
width: 504 / 2rem;
height: auto;
}
}
......
src/components/buy/activityInvite.vue
View file @ 11946771
......@@ -405,7 +405,7 @@
.marquee {
display: block;
width: 100%;
top: 12 * @toVw;
top: 12rem;
left: 0;
text-align: center;
position: absolute;
......@@ -423,27 +423,27 @@
z-index: 1;
}
.tips {
width: 230 * @toVw;
margin-left: 163 / 2 * @toVw;
margin-top: 10 * @toVw;
width: 230rem;
margin-left: 163 / 2rem;
margin-top: 10rem;
}
.img-cvs{
position: absolute;
background: rgb(253, 168, 19);
width: 518 / 2 * @toVw;
width: 518 / 2rem;
top: 25 * @toVh;
left: 113 / 2 * @toVw;
left: 113 / 2rem;
.avatar-container {
position: absolute;
top: 8 * @toVh;
left: 8 * @toVw;
font-size: 12 * @toVw;
left: 8rem;
font-size: 12rem;
display: flex;
justify-content: center;
align-items: center;
color: #fff;
img {
width: 30 * @toVw;
width: 30rem;
margin-right: 5px;
border-radius: 50%;
}
......@@ -453,27 +453,27 @@
}
.qrcode{
position: absolute;
top: 690 / 2 * @toVw;
left: 15 * @toVw;
width: 60 * @toVw !important;
top: 690 / 2rem;
left: 15rem;
width: 60rem !important;
/deep/ canvas{
width: 60 * @toVw !important;
width: 60rem !important;
height: 60*@toVw !important;
}
/deep/ img{
width: 60 * @toVw !important;
height: 60 * @toVw !important;
width: 60rem !important;
height: 60rem !important;
}
}
}
#avatarImg{
max-height: 415 * @toVw;
max-height: 415rem;
}
.cvs-img{
position: absolute;
width: 518 / 2 * @toVw;
width: 518 / 2rem;
top: 25 * @toVh;
left: 113 / 2 * @toVw;
left: 113 / 2rem;
z-index: 10;
}
.inviteBtn {
......@@ -484,28 +484,28 @@
.i-btn {
position: relative;
width: 642 / 2 * @toVw;
height: 92 / 2 * @toVw;
width: 642 / 2rem;
height: 92 / 2rem;
text-align: left;
font-size: 14 * @toVw;
font-size: 14rem;
color: #fff;
// background: url('../../assets/activity/red-bg.png') no-repeat center;
background: #f5c10c;
border-radius: 25 * @toVw;
border-radius: 25rem;
box-shadow: 2px 2px 2px #888888;
background-size: cover;
box-sizing: border-box;
padding: 2px 58/2*@toVw;
overflow: hidden;
.i-env {
width: 36 / 2 * @toVw;;
width: 36 / 2rem;;
height: auto;
margin-right: 5px;
margin-left: 0;
z-index: 2;
}
.i-env-title {
font-size: 16 * @toVw;
font-size: 16rem;
margin:0;
z-index: 2;
}
......@@ -522,25 +522,25 @@
flex-flow: row nowrap;
justify-content: space-around;
align-items: center;
width: 642 / 2 * @toVw;
margin-top: 30 / 2 * @toVw;
font-size: 14 * @toVw;
width: 642 / 2rem;
margin-top: 30 / 2rem;
font-size: 14rem;
color: #fff;
img {
width: 96 / 2 * @toVw;
height: 96 / 2 * @toVw;
width: 96 / 2rem;
height: 96 / 2rem;
}
}
.copyBtn {
background: url('../../assets/activity/yellow-bg.png') no-repeat center;
background-size: cover;
box-sizing: border-box;
width: 567 / 2 * @toVw;
height: 92 / 2 * @toVw;
width: 567 / 2rem;
height: 92 / 2rem;
text-align: center;
line-height: 92 / 2 * @toVw;
line-height: 92 / 2rem;
color: #fff;
font-size: 20 * @toVw;
font-size: 20rem;
}
.flex-bt {
display: flex;
......@@ -550,20 +550,20 @@
}
.p-tips {
color: #999;
font-size: 15 * @toVw;
font-size: 15rem;
}
.p-envelope {
width: 22 * @toVw;
height: 22 * @toVw;
margin-right: 12 * @toVw;
width: 22rem;
height: 22rem;
margin-right: 12rem;
}
.p-switch {
width: 15 * @toVw;
height: 15 * @toVw;
width: 15rem;
height: 15rem;
}
.p-comments {
margin: 15px 0;
// height: 220 * @toVw;
// height: 220rem;
overflow-y: scroll;
p {
line-height: 2;
......@@ -573,16 +573,16 @@
margin: 0;
}
.ref-content{
width: 299 * @toVw;
height: 564 * @toVw;
width: 299rem;
height: 564rem;
background-size: 100% 100%;
position: relative;
.tips{
font-size: 12px;
position: absolute;
color: #666;
right: 10 * @toVw;
top: 250 * @toVw;
right: 10rem;
top: 250rem;
width: 1em;
}
}
......@@ -775,7 +775,7 @@
}
.pop-fill{
width: 705 / 2 * @toVw;
width: 705 / 2rem;
padding:30/7.5vw 30/7.5vw;
box-sizing: border-box;
font-size: 16px;
......@@ -783,13 +783,13 @@
.close {
position: absolute;
width: 100%;
bottom: -60 * @toVw;
bottom: -60rem;
left: 0;
text-align: center;
}
.close-pop {
width: 75 / 2 * @toVw;
height: 75 / 2 * @toVw;
width: 75 / 2rem;
height: 75 / 2rem;
}
.btn-block{
margin-top: 30/7.5vw;
......@@ -810,12 +810,12 @@
}
}
.content-text{
margin-bottom: 15 * @toVw;
margin-bottom: 15rem;
h3{
margin-bottom: 5 * @toVw;
margin-bottom: 5rem;
};
p{
font-size: 16 * @toVw;
font-size: 16rem;
}
}
......
src/components/buy/buy.vue
View file @ 11946771
......@@ -399,20 +399,20 @@
font-family:PingFang-SC-Medium;
font-weight:500;
color:rgba(0,0,0,1);
line-height: 40 * @toVw;
line-height: 40rem;
margin-top: 10*@toVw;
height: 40 * @toVw;
padding: 5*@toVw 15 * @toVw;
height: 40rem;
padding: 5*@toVw 15rem;
background: white;
img{
width: 16 * @toVw;
margin-left: 8 * @toVw;
width: 16rem;
margin-left: 8rem;
vertical-align: middle;
}
.you-content{
float: right;
color: #999999;
font-size: 14 * @toVw;
font-size: 14rem;
}
}
.orderCancel{
......@@ -429,8 +429,8 @@
font-size: 25* @toVw;
color: #6C6C6C;
}
p{font-size: 14* @toVw;color: #999999;margin: 20 * @toVw 0 0;}
.warn{font-size: 15* @toVw;color: #EC612A;margin: 10 * @toVw 0 25* @toVw;font-weight: bold;}
p{font-size: 14* @toVw;color: #999999;margin: 20rem 0 0;}
.warn{font-size: 15* @toVw;color: #EC612A;margin: 10rem 0 25* @toVw;font-weight: bold;}
.btnbox{
display: flex;
.btn{width: 118* @toVw;height: 40* @toVw;line-height: 40* @toVw;font-size: 14* @toVw;color: white;border-radius: 20* @toVw;font-weight:bold; }
......@@ -449,17 +449,17 @@
opacity: 0;
}
.phone-block{
padding: 10 * @toVw;
padding: 10rem;
text-align: center;
background: #f8f8f8;
}
.phone-input{
width: 280 * @toVw;
width: 280rem;
height: 30*@toVw;
border-radius: 8 * @toVw;
border-radius: 8rem;
outline: none;
padding:0 10 * @toVw;
padding:0 10rem;
border: 1px solid #e8e8e8;
text-align: center;
}
......
src/components/buy/buySuccess.vue
View file @ 11946771
......@@ -132,19 +132,19 @@
}
.buy-success{
background: #FFFEF9;
padding-top: 20 * @toVw;
padding-top: 20rem;
.banner{
padding: 20 * @toVw;
padding: 20rem;
background: white;
text-align: center;
margin-bottom: 10 * @toVw;
margin-bottom: 10rem;
img{
width: 100%;
}
}
.shop-block{
background: white;
margin-top: 20 * @toVw;
margin-top: 20rem;
.shop{
padding: 20/7.5vw;
border-bottom: 1px solid #d8d8d8;
......@@ -189,9 +189,9 @@
}
}
.button-block{
margin-top: 60 * @toVw;
width: 315 * @toVw;
padding: 0 30 * @toVw;
margin-top: 60rem;
width: 315rem;
padding: 0 30rem;
border-radius: 100px;
overflow: hidden;
button{
......
src/components/buy/index.vue
View file @ 11946771
......@@ -619,34 +619,34 @@ video {
}
.img-cvs {
position: absolute;
width: 233 * @toVw;
top: 176 * @toVw;
left: 29 * @toVw;
width: 233rem;
top: 176rem;
left: 29rem;
.qrcode {
position: absolute;
top: 305 * @toVw;
left: 15 * @toVw;
width: 60 * @toVw;
top: 305rem;
left: 15rem;
width: 60rem;
}
}
.cvs-img {
position: absolute;
width: 233 * @toVw;
top: 176 * @toVw;
left: 29 * @toVw;
width: 233rem;
top: 176rem;
left: 29rem;
z-index: 10;
}
.ref-content {
width: 299 * @toVw;
height: 564 * @toVw;
width: 299rem;
height: 564rem;
background-size: 100% 100%;
position: relative;
.tips {
font-size: 12px;
position: absolute;
color: #666;
right: 10 * @toVw;
top: 250 * @toVw;
right: 10rem;
top: 250rem;
width: 1em;
}
}
......@@ -749,7 +749,7 @@ video {
}
}
.qa-block {
padding-bottom: 50 * @toVw;
padding-bottom: 50rem;
img,
video {
max-width: 100%;
......@@ -779,12 +779,12 @@ video {
.couponBox {
position: fixed;
width: 100%;
height: 25 * @toVw;
height: 25rem;
background: #FFE83C;
bottom: 70 * @toVw;
bottom: 70rem;
text-align: center;
color: #FF4D4F;
line-height: 25 * @toVw;
line-height: 25rem;
font-size: 12px;
}
footer {
......@@ -834,7 +834,7 @@ video {
&.full {
background: #dddddd;
border-color: #dddddd;
line-height: 50 * @toVw;
line-height: 50rem;
}
}
}
......
src/components/buy/inviteList.vue
View file @ 11946771
......@@ -76,24 +76,24 @@
position: relative;
text-align: center;
border-radius: @borderRadius;
padding-top: 10 / 2 * @toVw;
padding-top: 10 / 2rem;
padding-bottom: 38 / 2 * @toVh;
}
.invite-title {
position: relative;
width: 60%;
height: auto;
margin: 20 * @toVw 0;
margin: 20rem 0;
}
.invite-list {
margin-left: 32 / 2 * @toVw;
margin-right: 32 / 2 * @toVw;
margin-left: 32 / 2rem;
margin-right: 32 / 2rem;
padding: 28 / 2 * @toVh;
border: 1px solid @red;
border-radius: @borderRadius;
.i-title {
font-size: 14px;
margin: 10 * @toVw;
margin: 10rem;
}
.i-num {
font-size: 18px;
......@@ -130,10 +130,10 @@
justify-content: space-between;
align-items: center;
margin: 0;
padding: 8 * @toVw;
padding: 8rem;
img {
width: 74 / 2 * @toVw;
height: 74 / 2 * @toVw;
width: 74 / 2rem;
height: 74 / 2rem;
border-radius: 50%;
margin-right: 5px;
}
......
src/components/buy/login.vue
View file @ 11946771
......@@ -233,7 +233,7 @@
line-height:47*@toVw;
text-indent: 10*@toVw;
// border: 1*@toVw solid #cccccc;
// margin-bottom: 26 * @toVw;
// margin-bottom: 26rem;
display: -webkit-flex;
justify-content:space-between;
position: relative;
......@@ -261,7 +261,7 @@
input{
flex: 1;
width: 20vw;
padding: 10 * @toVw 0;
padding: 10rem 0;
font-size:14*@toVw;
background: transparent;
font-family:PingFangSC-Semibold;
......
src/components/buy/mpShop.vue
View file @ 11946771
......@@ -375,34 +375,34 @@
}
.img-cvs{
position: absolute;
width: 233 * @toVw;
top: 176 * @toVw;
left: 29 * @toVw;
width: 233rem;
top: 176rem;
left: 29rem;
.qrcode{
position: absolute;
top: 305 * @toVw;
left: 15 * @toVw;
width: 60 * @toVw;
top: 305rem;
left: 15rem;
width: 60rem;
}
}
.cvs-img{
position: absolute;
width: 233 * @toVw;
top: 176 * @toVw;
left: 29 * @toVw;
width: 233rem;
top: 176rem;
left: 29rem;
z-index: 10;
}
.ref-content{
width: 299 * @toVw;
height: 564 * @toVw;
width: 299rem;
height: 564rem;
background-size: 100% 100%;
position: relative;
.tips{
font-size: 12px;
position: absolute;
color: #666;
right: 10 * @toVw;
top: 250 * @toVw;
right: 10rem;
top: 250rem;
width: 1em;
}
}
......
src/components/buy/sale.vue
View file @ 11946771
......@@ -84,29 +84,29 @@
position: fixed;
top: 0;
bottom: 0;
padding: 10 * @toVw;
padding: 10rem;
left: 0;
right: 0;
z-index: 2;
background: #eee;
.sale-block{
width: 342 * @toVw;
height: 129 * @toVw;
width: 342rem;
height: 129rem;
background-size: 100% 100%;
color: white;
margin-bottom: 15 * @toVw;
margin-bottom: 15rem;
position: relative;
.money{
.price-icon{
font-size: 30 * @toVw;
font-size: 30rem;
}
height:67 * @toVw;
font-size:48 * @toVw;
height:67rem;
font-size:48rem;
font-family:PingFang-SC-Bold;
color:rgba(255,255,255,1);
line-height:67* @toVw;
position: absolute;
top: 20 * @toVw;
top: 20rem;
right: 179* @toVw;
}
.tips{
......@@ -118,31 +118,31 @@
color:rgba(255,255,255,1);
line-height:22* @toVw;
position: absolute;
top: 33 * @toVw;
right: 15 * @toVw;
top: 33rem;
right: 15rem;
}
.btn{
width: 106 * @toVw;
height: 32 * @toVw;
width: 106rem;
height: 32rem;
border-radius: 1000* @toVw;
background: white;
color: #F24364;
text-align: center;
line-height: 32 * @toVw;
line-height: 32rem;
position: absolute;
top: 72 * @toVw;
right: 16 * @toVw;
top: 72rem;
right: 16rem;
}
}
.cleanBtn{
position: absolute;
text-align: center;
width: 350 * @toVw;
height: 40 * @toVw;
line-height: 40 * @toVw;
width: 350rem;
height: 40rem;
line-height: 40rem;
background: white;
border-radius: 4px;
bottom: 20 * @toVw;
bottom: 20rem;
color: #666666;
}
}
......
src/components/buy/saleSuccess.vue
View file @ 11946771
......@@ -130,9 +130,9 @@
}
}
.banner{
margin: 0 0 10 * @toVw 0;
margin: 0 0 10rem 0;
background: white;
padding: 10 * @toVw;
padding: 10rem;
img{
width: 100%;
}
......
src/components/buy/success.vue
View file @ 11946771
......@@ -307,10 +307,10 @@
height: 60 *@toVw;
}
.banner {
padding: 10 * @toVw;
padding: 10rem;
background: white;
text-align: center;
margin-bottom: 10 * @toVw;
margin-bottom: 10rem;
img {
width: 100%;
display: block;
......@@ -320,10 +320,10 @@
width: 100%;
text-align: center;
.btn{
margin: 0 20 * @toVw;
margin: 0 20rem;
background: #FF7171;
height: 38 * @toVw;
line-height: 38 * @toVw;
height: 38rem;
line-height: 38rem;
border-radius: 1000px;
font-size:16px;
font-family:PingFangSC-Regular;
......
src/components/collection/audio.vue
View file @ 11946771
......@@ -82,7 +82,6 @@
<script>
import { Toast } from "vant";
// import {Popup} from 'mint-ui'
import tapToVideo from "../../assets/tapToVideo.png";
import closeUrl from "../../assets/newLesson/audio-close.png";
import {
......@@ -94,7 +93,6 @@ export default {
name: "fun",
props: ["showObj", "sc"],
components: {
// [Popup.name]: Popup
},
data() {
return {
......@@ -369,122 +367,122 @@ export default {
display: inline-block;
}
._282918034425091245 {
height: 8 * @toVw;
width: 9 * @toVw;
height: 8rem;
width: 9rem;
background-position: 0 0;
}
._154722344142123489 {
height: 5 * @toVw;
width: 9 * @toVw;
background-position: 0 -8 * @toVw;
height: 5rem;
width: 9rem;
background-position: 0 -8rem;
vertical-align: bottom;
}
.next {
height: 16 * @toVw;
width: 16 * @toVw;
background-position: 0 -13 * @toVw;
height: 16rem;
width: 16rem;
background-position: 0 -13rem;
}
.listPlay {
height: 16 * @toVw;
width: 16 * @toVw;
background-position: 0 -29 * @toVw;
height: 16rem;
width: 16rem;
background-position: 0 -29rem;
}
.replay {
height: 16 * @toVw;
width: 16 * @toVw;
background-position: 0 -45 * @toVw;
height: 16rem;
width: 16rem;
background-position: 0 -45rem;
}
.toBig {
height: 16 * @toVw;
width: 16 * @toVw;
background-position: 0 -61 * @toVw;
height: 16rem;
width: 16rem;
background-position: 0 -61rem;
}
.replayAll {
height: 16 * @toVw;
width: 16 * @toVw;
background-position: 0 -77 * @toVw;
height: 16rem;
width: 16rem;
background-position: 0 -77rem;
}
.collectDefault {
height: 16 * @toVw;
width: 16 * @toVw;
background-position: 0 -93 * @toVw;
height: 16rem;
width: 16rem;
background-position: 0 -93rem;
}
.collect {
height: 16 * @toVw;
width: 16 * @toVw;
und-position: 0 -109 * @toVw;
height: 16rem;
width: 16rem;
und-position: 0 -109rem;
}
.last {
height: 16 * @toVw;
width: 16 * @toVw;
background-position: 0 -125 * @toVw;
height: 16rem;
width: 16rem;
background-position: 0 -125rem;
}
.list {
height: 16 * @toVw;
width: 16 * @toVw;
background-position: 0 -141 * @toVw;
height: 16rem;
width: 16rem;
background-position: 0 -141rem;
}
.close {
height: 17 * @toVw;
width: 17 * @toVw;
background-position: 0 -157 * @toVw;
height: 17rem;
width: 17rem;
background-position: 0 -157rem;
}
.zDefaultIcon {
height: 18 * @toVw;
width: 18 * @toVw;
background-position: 0 -174 * @toVw;
height: 18rem;
width: 18rem;
background-position: 0 -174rem;
float: right;
}
.zIcon {
height: 18 * @toVw;
width: 18 * @toVw;
background-position: 0 -192 * @toVw;
height: 18rem;
width: 18rem;
background-position: 0 -192rem;
float: right;
}
.iconfont {
color: #cccccc;
}
.icon-icon_stop {
font-size: 50 * @toVw;
font-size: 50rem;
color: #69c0ff;
}
.icon-icon_begin {
font-size: 50 * @toVw;
font-size: 50rem;
color: #69c0ff;
}
.icon-icon_left {
height: 37 * @toVw;
width: 37 * @toVw;
font-size: 32 * @toVw;
height: 37rem;
width: 37rem;
font-size: 32rem;
color: #69c0ff;
}
.icon-icon_right {
height: 37 * @toVw;
width: 37 * @toVw;
font-size: 32 * @toVw;
height: 37rem;
width: 37rem;
font-size: 32rem;
color: #69c0ff;
}
.icon-icon_list {
font-size: 20 * @toVw;
font-size: 20rem;
}
.icon-icon_change1 {
font-size: 21 * @toVw;
width: 20 * @toVw;
font-size: 21rem;
width: 20rem;
}
.icon-icon_change {
font-size: 20 * @toVw;
width: 20 * @toVw;
font-size: 20rem;
width: 20rem;
}
.icon-icon_changge {
font-size: 19 * @toVw;
width: 20 * @toVw;
font-size: 19rem;
width: 20rem;
}
.hp-left {
position: relative;
.collect {
position: absolute;
right: 64 * @toVw;
bottom: 48 * @toVw;
right: 64rem;
bottom: 48rem;
}
}
.icon-icon_like1 {
......@@ -519,15 +517,15 @@ export default {
animation: none !important;
}
.collect-block {
padding: 10 * @toVw;
border-radius: 4 * @toVw;
padding: 10rem;
border-radius: 4rem;
background: white;
}
.colse-btn {
position: absolute;
top: 15 * @toVw;
right: 15 * @toVw;
width: 20 * @toVw;
top: 15rem;
right: 15rem;
width: 20rem;
}
.content {
background: white;
......@@ -542,44 +540,44 @@ export default {
margin: auto;
display: block;
height: 100vh;
width: 375 * @toVw;
border-radius: 8 * @toVw;
width: 375rem;
border-radius: 8rem;
text-align: center;
.image-block {
width: 188 * @toVw;
height: 188 * @toVw;
margin-top: 20 * @toVw;
box-shadow: 0 0 30 * @toVw 5 * @toVw #ddd;
width: 188rem;
height: 188rem;
margin-top: 20rem;
box-shadow: 0 0 30rem 5rem #ddd;
overflow: hidden;
border-radius: 999 * @toVw;
border-radius: 999rem;
box-shadow: 0px 0px 4px 0px rgba(96, 173, 240, 1);
border: 4px solid rgba(255, 255, 255, 1);
img {
width: 100%;
border-radius: 999 * @toVw;
border-radius: 999rem;
}
}
.title-block {
margin-top: 24 * @toVw;
margin-top: 24rem;
.title {
font-size: 16 * @toVw;
font-size: 16rem;
font-family: PingFang-SC-Medium;
font-weight: 500;
color: rgba(102, 102, 102, 1);
}
.tips {
font-size: 14 * @toVw;
margin-top: 6 * @toVw;
font-size: 14rem;
margin-top: 6rem;
font-family: PingFang-SC-Medium;
font-weight: 500;
color: rgba(153, 153, 153, 1);
}
}
.range-block {
width: 250 * @toVw;
margin-top: 16 * @toVw;
width: 250rem;
margin-top: 16rem;
.time-block {
font-size: 12 * @toVw;
font-size: 12rem;
font-family: PingFang-SC-Medium;
font-weight: 500;
color: rgba(102, 102, 102, 1);
......@@ -603,14 +601,14 @@ export default {
background: -webkit-linear-gradient(#69c0ff, #69c0ff) no-repeat, #d8d8d8;
background-size: 75% 100%; /*设置左右宽度比例*/
width: 100%;
border-radius: 10 * @toVw; /*这个属性设置使填充进度条时的图形为圆角*/
border-radius: 10rem; /*这个属性设置使填充进度条时的图形为圆角*/
}
input[type="range"]::-webkit-slider-thumb {
-webkit-appearance: none;
}
input[type="range"]::-webkit-slider-runnable-track {
height: 4 * @toVw;
border-radius: 2 * @toVw;
height: 4rem;
border-radius: 2rem;
}
input[type="range"]:focus {
outline: none;
......@@ -620,15 +618,15 @@ export default {
outline: none;
-webkit-appearance: none;
border-radius: 50%; /*外观设置为圆形*/
height: 16 * @toVw;
width: 16 * @toVw;
margin-top: -6 * @toVw; /*使滑块超出轨道部分的偏移量相等*/
height: 16rem;
width: 16rem;
margin-top: -6rem; /*使滑块超出轨道部分的偏移量相等*/
background: #69c0ff;
}
}
.btn-group {
margin-top: 30 * @toVw;
width: 280 * @toVw;
margin-top: 30rem;
width: 280rem;
display: flex;
justify-content: space-around;
&.hp {
......@@ -637,73 +635,73 @@ export default {
}
}
.list-popup {
width: 375 * @toVw;
max-height: 345 * @toVw;
width: 375rem;
max-height: 345rem;
overflow: auto;
border-radius: 8 * @toVw 8 * @toVw 0 0;
border-radius: 8rem 8rem 0 0;
background: white;
padding-top: 20 * @toVw;
padding-top: 20rem;
.list-block {
display: block;
width: auto;
margin: 0 20 * @toVw;
padding: 12 * @toVw 36 * @toVw;
border-bottom: 1 * @toVw solid #dddddd;
margin: 0 20rem;
padding: 12rem 36rem;
border-bottom: 1rem solid #dddddd;
&.active {
color: #49e2a5;
}
}
.close-btn {
text-align: center;
padding: 20 * @toVw;
padding: 20rem;
}
}
.imgPop-block {
max-height: 500 * @toVw;
max-height: 500rem;
overflow: auto;
img {
max-width: 300 * @toVw;
max-width: 300rem;
}
}
.btn-block {
position: relative;
margin-top: 28 * @toVw;
margin-top: 28rem;
text-align: center;
.age-block {
height: 28 * @toVw;
line-height: 28 * @toVw;
border: 1 * @toVw solid #666;
height: 28rem;
line-height: 28rem;
border: 1rem solid #666;
position: absolute;
padding: 0 13 * @toVw;
border-radius: 100 * @toVw;
font-size: 12 * @toVw;
padding: 0 13rem;
border-radius: 100rem;
font-size: 12rem;
font-family: PingFang-SC-Medium;
font-weight: 500;
color: rgba(102, 102, 102, 1);
}
.age-change-block {
position: absolute;
top: 37 * @toVw;
top: 37rem;
left: 0;
width: 66 * @toVw;
border-radius: 8 * @toVw;
border: 1 * @toVw solid #666666;
font-size: 12 * @toVw;
width: 66rem;
border-radius: 8rem;
border: 1rem solid #666666;
font-size: 12rem;
font-family: PingFang-SC-Medium;
font-weight: 500;
color: rgba(102, 102, 102, 1);
& > div {
padding: 6 * @toVw 11 * @toVw;
padding: 6rem 11rem;
text-align: left;
&:first-child {
border-bottom: 1 * @toVw solid #eee;
border-bottom: 1rem solid #eee;
}
}
}
.change-block {
border-radius: 1000 * @toVw;
width: 144 * @toVw;
border: 1 * @toVw solid #40a9ff;
border-radius: 1000rem;
width: 144rem;
border: 1rem solid #40a9ff;
&:after {
content: "";
display: block;
......@@ -712,10 +710,10 @@ export default {
div {
float: left;
width: 50%;
border-radius: 100 * @toVw;
font-size: 12 * @toVw;
height: 28 * @toVw;
line-height: 28 * @toVw;
border-radius: 100rem;
font-size: 12rem;
height: 28rem;
line-height: 28rem;
font-family: PingFang-SC-Medium;
font-weight: 500;
color: rgba(204, 204, 204, 1);
......@@ -735,139 +733,139 @@ export default {
.playImage {
background: url("https://static-cdn.changchangenglish.com/new-sing/static/images/playImage.png?v=2")
no-repeat;
background-size: 40 * @toVw 225 * @toVw;
background-size: 40rem 225rem;
display: inline-block;
}
._154722344142123489 {
height: 5 * @toVw;
width: 9 * @toVw;
height: 5rem;
width: 9rem;
background-position: 0 0;
}
._282918034425091245 {
height: 8 * @toVw;
width: 9 * @toVw;
background-position: 0 -4 * @toVw;
height: 8rem;
width: 9rem;
background-position: 0 -4rem;
vertical-align: bottom;
}
.last {
height: 16 * @toVw;
width: 16 * @toVw;
background-position: 0 -13 * @toVw;
height: 16rem;
width: 16rem;
background-position: 0 -13rem;
}
.listPlay {
height: 16 * @toVw;
width: 16 * @toVw;
background-position: 0 -29 * @toVw;
height: 16rem;
width: 16rem;
background-position: 0 -29rem;
}
.replay {
height: 16 * @toVw;
width: 16 * @toVw;
background-position: 0 -45 * @toVw;
height: 16rem;
width: 16rem;
background-position: 0 -45rem;
}
.next {
height: 16 * @toVw;
width: 16 * @toVw;
background-position: 0 -61 * @toVw;
height: 16rem;
width: 16rem;
background-position: 0 -61rem;
}
.replayAll {
height: 16 * @toVw;
width: 16 * @toVw;
background-position: 0 -77 * @toVw;
height: 16rem;
width: 16rem;
background-position: 0 -77rem;
}
.list {
height: 16 * @toVw;
width: 16 * @toVw;
background-position: 0 -93 * @toVw;
height: 16rem;
width: 16rem;
background-position: 0 -93rem;
}
.zDefaultIcon {
height: 18 * @toVw;
width: 18 * @toVw;
background-position: 0 -109 * @toVw;
height: 18rem;
width: 18rem;
background-position: 0 -109rem;
float: right;
}
.zIcon {
height: 18 * @toVw;
width: 18 * @toVw;
background-position: 0 -127 * @toVw;
height: 18rem;
width: 18rem;
background-position: 0 -127rem;
float: right;
}
.play {
height: 40 * @toVw;
width: 40 * @toVw;
background-position: 0 -145 * @toVw;
height: 40rem;
width: 40rem;
background-position: 0 -145rem;
}
.stop {
height: 40 * @toVw;
width: 40 * @toVw;
background-position: 0 -185 * @toVw;
height: 40rem;
width: 40rem;
background-position: 0 -185rem;
}
.icon-icon_stop {
height: 50 * @toVw;
width: 50 * @toVw;
font-size: 48 * @toVw;
height: 50rem;
width: 50rem;
font-size: 48rem;
color: #69c0ff;
}
.icon-icon_begin {
height: 50 * @toVw;
width: 50 * @toVw;
font-size: 48 * @toVw;
height: 50rem;
width: 50rem;
font-size: 48rem;
color: #69c0ff;
}
.icon-icon_left {
height: 37 * @toVw;
width: 37 * @toVw;
font-size: 32 * @toVw;
height: 37rem;
width: 37rem;
font-size: 32rem;
color: #69c0ff;
}
.icon-icon_right {
height: 37 * @toVw;
width: 37 * @toVw;
font-size: 32 * @toVw;
height: 37rem;
width: 37rem;
font-size: 32rem;
color: #69c0ff;
}
.icon-icon_list {
font-size: 20 * @toVw;
font-size: 20rem;
}
.icon-icon_change1 {
font-size: 21 * @toVw;
font-size: 21rem;
}
.icon-icon_change {
font-size: 20 * @toVw;
font-size: 20rem;
}
.icon-icon_changge {
font-size: 19 * @toVw;
font-size: 19rem;
}
.audio-page {
position: absolute;
top: 5 * @toVw;
bottom: 5 * @toVw;
left: 5 * @toVw;
right: 5 * @toVw;
top: 5rem;
bottom: 5rem;
left: 5rem;
right: 5rem;
overflow: auto;
border-radius: 8 * @toVw;
border-radius: 8rem;
.content {
position: static;
height: 100%;
width: 100%;
display: flex;
border-radius: 8 * @toVw;
border-radius: 8rem;
padding: 0;
.hp-left {
flex: 1;
margin-right: 20 * @toVw;
margin-right: 20rem;
.hp-top {
display: flex;
width: 100%;
}
}
.image-block {
width: 150 * @toVw;
height: 150 * @toVw;
box-shadow: 0 0 30 * @toVw 5 * @toVw #ddd;
width: 150rem;
height: 150rem;
box-shadow: 0 0 30rem 5rem #ddd;
overflow: hidden;
display: block;
margin: auto;
border-radius: 999 * @toVw;
border-radius: 999rem;
box-shadow: 0px 0px 4px 0px rgba(96, 173, 240, 1);
border: 4px solid rgba(255, 255, 255, 1);
img {
......@@ -875,16 +873,16 @@ export default {
}
}
.title-block {
margin-top: 24 * @toVw;
margin-top: 24rem;
.title {
font-size: 16 * @toVw;
font-size: 16rem;
font-family: PingFang-SC-Medium;
font-weight: 500;
color: rgba(102, 102, 102, 1);
}
.tips {
font-size: 14 * @toVw;
margin-top: 6 * @toVw;
font-size: 14rem;
margin-top: 6rem;
font-family: PingFang-SC-Medium;
font-weight: 500;
color: rgba(153, 153, 153, 1);
......@@ -892,9 +890,9 @@ export default {
}
.range-block {
width: auto;
margin-top: 16 * @toVw;
margin-top: 16rem;
.time-block {
font-size: 12 * @toVw;
font-size: 12rem;
font-family: PingFang-SC-Medium;
font-weight: 500;
color: rgba(102, 102, 102, 1);
......@@ -919,14 +917,14 @@ export default {
#d8d8d8;
background-size: 75% 100%; /*设置左右宽度比例*/
width: 100%;
border-radius: 10 * @toVw; /*这个属性设置使填充进度条时的图形为圆角*/
border-radius: 10rem; /*这个属性设置使填充进度条时的图形为圆角*/
}
input[type="range"]::-webkit-slider-thumb {
-webkit-appearance: none;
}
input[type="range"]::-webkit-slider-runnable-track {
height: 4 * @toVw;
border-radius: 2 * @toVw;
height: 4rem;
border-radius: 2rem;
}
input[type="range"]:focus {
outline: none;
......@@ -934,53 +932,53 @@ export default {
input[type="range"]::-webkit-slider-thumb {
-webkit-appearance: none;
border-radius: 50%; /*外观设置为圆形*/
height: 16 * @toVw;
width: 16 * @toVw;
margin-top: -6 * @toVw; /*使滑块超出轨道部分的偏移量相等*/
height: 16rem;
width: 16rem;
margin-top: -6rem; /*使滑块超出轨道部分的偏移量相等*/
background: #69c0ff;
}
}
.btn-group {
margin-top: 15vh;
display: none;
width: 200 * @toVw;
width: 200rem;
&.hp {
display: flex;
}
}
}
.list-popup {
width: 375 * @toVw;
max-height: 345 * @toVw;
width: 375rem;
max-height: 345rem;
overflow: auto;
border-radius: 8 * @toVw 8 * @toVw 0 0;
border-radius: 8rem 8rem 0 0;
background: white;
padding-top: 20 * @toVw;
padding-top: 20rem;
.list-block {
display: block;
width: auto;
margin: 0 20 * @toVw;
padding: 12 * @toVw 36 * @toVw;
border-bottom: 1 * @toVw solid #dddddd;
margin: 0 20rem;
padding: 12rem 36rem;
border-bottom: 1rem solid #dddddd;
&.active {
color: #49e2a5;
}
}
.close-btn {
text-align: center;
padding: 20 * @toVw;
padding: 20rem;
}
}
.imgPop-block {
max-height: 500 * @toVw;
max-height: 500rem;
overflow: auto;
img {
max-width: 300 * @toVw;
max-width: 300rem;
}
}
.btn-block {
position: relative;
min-width: 90 * @toVw;
min-width: 90rem;
margin-top: 0;
display: block;
height: 100%;
......@@ -988,31 +986,31 @@ export default {
display: block;
position: static;
padding: 0;
height: 28 * @toVw;
width: 88 * @toVw;
line-height: 28 * @toVw;
border: 1 * @toVw solid #666;
border-radius: 100 * @toVw;
font-size: 12 * @toVw;
height: 28rem;
width: 88rem;
line-height: 28rem;
border: 1rem solid #666;
border-radius: 100rem;
font-size: 12rem;
font-family: PingFang-SC-Medium;
font-weight: 500;
color: rgba(102, 102, 102, 1);
}
.age-change-block {
position: static;
width: 80 * @toVw;
margin-top: 10 * @toVw;
border-radius: 8 * @toVw;
border: 1 * @toVw solid #666666;
font-size: 12 * @toVw;
width: 80rem;
margin-top: 10rem;
border-radius: 8rem;
border: 1rem solid #666666;
font-size: 12rem;
font-family: PingFang-SC-Medium;
font-weight: 500;
color: rgba(102, 102, 102, 1);
& > div {
padding: 6 * @toVw 11 * @toVw;
padding: 6rem 11rem;
text-align: left;
&:first-child {
border-bottom: 1 * @toVw solid #eee;
border-bottom: 1rem solid #eee;
}
}
}
......@@ -1020,7 +1018,7 @@ export default {
position: absolute;
top: ~"calc(100vh - 12.5vw)";
display: block;
width: 78 * @toVw;
width: 78rem;
img {
width: 100%;
}
......@@ -1036,121 +1034,121 @@ export default {
.playImage {
background: url("https://static-cdn.changchangenglish.com/new-sing/static/images/playImage.png?v=2")
no-repeat;
background-size: 40 * @toVw 225 * @toVw;
background-size: 40rem 225rem;
display: inline-block;
}
._154722344142123489 {
height: 5 * @toVw;
width: 9 * @toVw;
height: 5rem;
width: 9rem;
background-position: 0 0;
}
._282918034425091245 {
height: 8 * @toVw;
width: 9 * @toVw;
background-position: 0 -4 * @toVw;
height: 8rem;
width: 9rem;
background-position: 0 -4rem;
vertical-align: bottom;
}
.last {
height: 16 * @toVw;
width: 16 * @toVw;
background-position: 0 -13 * @toVw;
height: 16rem;
width: 16rem;
background-position: 0 -13rem;
}
.listPlay {
height: 16 * @toVw;
width: 16 * @toVw;
background-position: 0 -29 * @toVw;
height: 16rem;
width: 16rem;
background-position: 0 -29rem;
}
.replay {
height: 16 * @toVw;
width: 16 * @toVw;
background-position: 0 -45 * @toVw;
height: 16rem;
width: 16rem;
background-position: 0 -45rem;
}
.next {
height: 16 * @toVw;
width: 16 * @toVw;
background-position: 0 -61 * @toVw;
height: 16rem;
width: 16rem;
background-position: 0 -61rem;
}
.replayAll {
height: 16 * @toVw;
width: 16 * @toVw;
background-position: 0 -77 * @toVw;
height: 16rem;
width: 16rem;
background-position: 0 -77rem;
}
.list {
height: 16 * @toVw;
width: 16 * @toVw;
background-position: 0 -93 * @toVw;
height: 16rem;
width: 16rem;
background-position: 0 -93rem;
}
.zDefaultIcon {
height: 18 * @toVw;
width: 18 * @toVw;
background-position: 0 -109 * @toVw;
height: 18rem;
width: 18rem;
background-position: 0 -109rem;
float: right;
}
.zIcon {
height: 18 * @toVw;
width: 18 * @toVw;
background-position: 0 -127 * @toVw;
height: 18rem;
width: 18rem;
background-position: 0 -127rem;
float: right;
}
.play {
height: 40 * @toVw;
width: 40 * @toVw;
background-position: 0 -145 * @toVw;
height: 40rem;
width: 40rem;
background-position: 0 -145rem;
}
.stop {
height: 40 * @toVw;
width: 40 * @toVw;
background-position: 0 -185 * @toVw;
height: 40rem;
width: 40rem;
background-position: 0 -185rem;
}
.audio-page {
position: absolute;
top: 5 * @toVw;
bottom: 5 * @toVw;
left: 5 * @toVw;
right: 5 * @toVw;
top: 5rem;
bottom: 5rem;
left: 5rem;
right: 5rem;
overflow: auto;
border-radius: 8 * @toVw;
border-radius: 8rem;
.content {
position: static;
height: 100%;
width: 100%;
display: flex;
border-radius: 8 * @toVw;
border-radius: 8rem;
padding: 0;
.hp-left {
flex: 1;
margin-right: 20 * @toVw;
margin-right: 20rem;
.hp-top {
display: flex;
width: 100%;
}
}
.image-block {
width: 150 * @toVw;
height: 150 * @toVw;
box-shadow: 0 0 30 * @toVw 5 * @toVw #ddd;
width: 150rem;
height: 150rem;
box-shadow: 0 0 30rem 5rem #ddd;
overflow: hidden;
display: block;
margin: auto;
border-radius: 999 * @toVw;
border-radius: 999rem;
box-shadow: 0px 0px 4px 0px rgba(96, 173, 240, 1);
border: 4px solid rgba(255, 255, 255, 1);
img {
width: 100%;
border-radius: 999 * @toVw;
border-radius: 999rem;
}
}
.title-block {
margin-top: 24 * @toVw;
margin-top: 24rem;
.title {
font-size: 16 * @toVw;
font-size: 16rem;
font-family: PingFang-SC-Medium;
font-weight: 500;
color: rgba(102, 102, 102, 1);
}
.tips {
font-size: 14 * @toVw;
margin-top: 6 * @toVw;
font-size: 14rem;
margin-top: 6rem;
font-family: PingFang-SC-Medium;
font-weight: 500;
color: rgba(153, 153, 153, 1);
......@@ -1158,9 +1156,9 @@ export default {
}
.range-block {
width: auto;
margin-top: 16 * @toVw;
margin-top: 16rem;
.time-block {
font-size: 12 * @toVw;
font-size: 12rem;
font-family: PingFang-SC-Medium;
font-weight: 500;
color: rgba(102, 102, 102, 1);
......@@ -1185,14 +1183,14 @@ export default {
#d8d8d8;
background-size: 75% 100%; /*设置左右宽度比例*/
width: 100%;
border-radius: 10 * @toVw; /*这个属性设置使填充进度条时的图形为圆角*/
border-radius: 10rem; /*这个属性设置使填充进度条时的图形为圆角*/
}
input[type="range"]::-webkit-slider-thumb {
-webkit-appearance: none;
}
input[type="range"]::-webkit-slider-runnable-track {
height: 4 * @toVw;
border-radius: 2 * @toVw;
height: 4rem;
border-radius: 2rem;
}
input[type="range"]:focus {
outline: none;
......@@ -1200,53 +1198,53 @@ export default {
input[type="range"]::-webkit-slider-thumb {
-webkit-appearance: none;
border-radius: 50%; /*外观设置为圆形*/
height: 16 * @toVw;
width: 16 * @toVw;
margin-top: -6 * @toVw; /*使滑块超出轨道部分的偏移量相等*/
height: 16rem;
width: 16rem;
margin-top: -6rem; /*使滑块超出轨道部分的偏移量相等*/
background: #49e2a5;
}
}
.btn-group {
margin-top: 15vh;
display: none;
width: 200 * @toVw;
width: 200rem;
&.hp {
display: flex;
}
}
}
.list-popup {
width: 375 * @toVw;
max-height: 345 * @toVw;
width: 375rem;
max-height: 345rem;
overflow: auto;
border-radius: 8 * @toVw 8 * @toVw 0 0;
border-radius: 8rem 8rem 0 0;
background: white;
padding-top: 20 * @toVw;
padding-top: 20rem;
.list-block {
display: block;
width: auto;
margin: 0 20 * @toVw;
padding: 12 * @toVw 36 * @toVw;
border-bottom: 1 * @toVw solid #dddddd;
margin: 0 20rem;
padding: 12rem 36rem;
border-bottom: 1rem solid #dddddd;
&.active {
color: #49e2a5;
}
}
.close-btn {
text-align: center;
padding: 20 * @toVw;
padding: 20rem;
}
}
.imgPop-block {
max-height: 500 * @toVw;
max-height: 500rem;
overflow: auto;
img {
max-width: 300 * @toVw;
max-width: 300rem;
}
}
.btn-block {
position: relative;
min-width: 90 * @toVw;
min-width: 90rem;
margin-top: 0;
display: block;
height: 100%;
......@@ -1254,31 +1252,31 @@ export default {
display: block;
position: static;
padding: 0;
height: 28 * @toVw;
width: 88 * @toVw;
line-height: 28 * @toVw;
border: 1 * @toVw solid #666;
border-radius: 100 * @toVw;
font-size: 12 * @toVw;
height: 28rem;
width: 88rem;
line-height: 28rem;
border: 1rem solid #666;
border-radius: 100rem;
font-size: 12rem;
font-family: PingFang-SC-Medium;
font-weight: 500;
color: rgba(102, 102, 102, 1);
}
.age-change-block {
position: static;
width: 80 * @toVw;
margin-top: 10 * @toVw;
border-radius: 8 * @toVw;
border: 1 * @toVw solid #666666;
font-size: 12 * @toVw;
width: 80rem;
margin-top: 10rem;
border-radius: 8rem;
border: 1rem solid #666666;
font-size: 12rem;
font-family: PingFang-SC-Medium;
font-weight: 500;
color: rgba(102, 102, 102, 1);
& > div {
padding: 6 * @toVw 11 * @toVw;
padding: 6rem 11rem;
text-align: left;
&:first-child {
border-bottom: 1 * @toVw solid #eee;
border-bottom: 1rem solid #eee;
}
}
}
......@@ -1286,7 +1284,7 @@ export default {
position: absolute;
top: ~"calc(100vh - 12.5vw)";
display: block;
width: 78 * @toVw;
width: 78rem;
img {
width: 100%;
}
......
src/components/exChange.vue
View file @ 11946771
......@@ -215,17 +215,17 @@
@import "../util/public";
.banner-block{
text-align: center;
margin: 40 * @toVw auto;
margin: 40rem auto;
img{
width: 142 * @toVw;
width: 142rem;
}
}
.form-block{
padding: 20 * @toVw;
padding: 20rem;
.input-block{
height: 60 * @toVw;
height: 60rem;
border-bottom: 1*@toVw solid #cccccc;
margin-bottom: 20 * @toVw;
margin-bottom: 20rem;
position: relative;
.right-btn{
position: absolute;
......@@ -233,7 +233,7 @@
top: 17*@toVw;
}
input{
padding: 10 * @toVw 0;
padding: 10rem 0;
font-size:14*@toVw;
background: transparent;
font-family:PingFangSC-Semibold;
......@@ -284,9 +284,9 @@
.btn-block{
text-align: center;
.btn{
width: 236 * @toVw;
height: 37 * @toVw;
line-height: 37 * @toVw;
width: 236rem;
height: 37rem;
line-height: 37rem;
background:rgba(96,173,240,1);
border-radius:4*@toVw;font-size:14*@toVw;
font-family:PingFangSC-Semibold;
......@@ -314,6 +314,6 @@
left: 0;
right: 0;
bottom: 0;
width: 375 * @toVw;
width: 375rem;
}
</style>
src/components/index.vue
View file @ 11946771
......@@ -723,12 +723,12 @@ export default {
@import "../util/public";
.index {
background: #F5F5F9;
padding-bottom: 50 * @toVw;
padding-bottom: 50rem;
}
.couponActivity{
padding:0 20 * @toVw 12 * @toVw;
padding:0 20rem 12rem;
background: white;
margin: 0 0 10 * @toVw;
margin: 0 0 10rem;
position: relative;
.textBox{
width: 290* @toVw;
......@@ -873,8 +873,8 @@ export default {
}
}
.banner-block {
width: 335 * @toVw;
height: 246 * @toVw;
width: 335rem;
height: 246rem;
position: relative;
background: white;
padding:14*@toVw 20*@toVw 0*@toVw;
......@@ -882,81 +882,81 @@ export default {
// box-sizing: border-box;
.bgimg {
position: absolute;
width: 335 * @toVw;
width: 335rem;
z-index: 0;
}
.canvas{width: 336 * @toVw;z-index: 2;}
.canvas{width: 336rem;z-index: 2;}
.content {
position: absolute;
z-index: 1;
height: 246 * @toVw;
width:335 * @toVw;
border-radius: 16 * @toVw;
height: 246rem;
width:335rem;
border-radius: 16rem;
overflow: hidden;
}
.Banner{
border-radius: 16 * @toVw;
border-radius: 16rem;
overflow: hidden;
position: relative;
// background: white;
height: 246 * @toVw;
width:335 * @toVw;
box-shadow: 1 * @toVw 2 * @toVw 5 * @toVw 0 * @toVw rgba(0,0,0,0.2);
.qr{width: 126 * @toVw;
height: 246rem;
width:335rem;
box-shadow: 1rem 2rem 5rem 0rem rgba(0,0,0,0.2);
.qr{width: 126rem;
position: absolute;left: 104* @toVw;top:20* @toVw ;z-index: 2;
}
.text{font-size: 16 * @toVw;color: #FF4D4F;text-align: center;position: absolute;top: 153* @toVw;width: 100%;font-weight:600;
.text{font-size: 16rem;color: #FF4D4F;text-align: center;position: absolute;top: 153* @toVw;width: 100%;font-weight:600;
}
.date{color: white;text-align: center;position: absolute;bottom: 8*@toVw;width: 100%;font-size: 12 * @toVw;}
.data_only{color: white;text-align: center;position: absolute;bottom: 11*@toVw;width: 100%;font-size: 19 * @toVw;}
.date{color: white;text-align: center;position: absolute;bottom: 8*@toVw;width: 100%;font-size: 12rem;}
.data_only{color: white;text-align: center;position: absolute;bottom: 11*@toVw;width: 100%;font-size: 19rem;}
.triangle{background: #FFC53D;width:104* @toVw ;height: 104* @toVw;position: absolute;right: -46* @toVw; top: -62* @toVw; transform:rotate(-50deg);z-index: 3;
span{color: white;font-size: 14 * @toVw;transform:rotate(91deg);position: absolute;top: 52* @toVw;font-size: 13 * @toVw;}
span{color: white;font-size: 14rem;transform:rotate(91deg);position: absolute;top: 52* @toVw;font-size: 13rem;}
}
}
.unBanner{
border-radius: 25 * @toVw;
border-radius: 25rem;
overflow: hidden;
height: 246 * @toVw;
width:335 * @toVw;
height: 246rem;
width:335rem;
position: relative;
box-shadow: 1 * @toVw 2 * @toVw 5 * @toVw 0 * @toVw rgba(0,0,0,0.2);
box-shadow: 1rem 2rem 5rem 0rem rgba(0,0,0,0.2);
.title{
position: absolute;color: white;top: 35* @toVw;left: 20* @toVw;
.title1{font-size:20 * @toVw;}
.title2{font-size:36 * @toVw;}
.title1{font-size:20rem;}
.title2{font-size:36rem;}
}
.date{color: white;text-align: center;position: absolute;bottom: 30*@toVw;padding-top: 10* @toVw;border-radius:28 * @toVw;
.date{color: white;text-align: center;position: absolute;bottom: 30*@toVw;padding-top: 10* @toVw;border-radius:28rem;
box-sizing: border-box;background:#FFC53D;
-webkit-animation:myfirst 3s linear infinite;
left: 20* @toVw;font-size: 14 * @toVw;width: 152* @toVw;height:56* @toVw ;
.date1{font-size:12 * @toVw;}
.date2{font-size:16 * @toVw;}
left: 20* @toVw;font-size: 14rem;width: 152* @toVw;height:56* @toVw ;
.date1{font-size:12rem;}
.date2{font-size:16rem;}
}
.triangle{background: #FFC53D;width:104* @toVw ;height: 104* @toVw;position: absolute;right: -46* @toVw; top: -62* @toVw; transform:rotate(-50deg);
span{color: white;font-size: 14 * @toVw;transform:rotate(85deg);position: absolute;top: 54* @toVw;font-size: 13 * @toVw;bottom: 74* @toVw;}
span{color: white;font-size: 14rem;transform:rotate(85deg);position: absolute;top: 54* @toVw;font-size: 13rem;bottom: 74* @toVw;}
}
}
}
.contentBox{
padding: 10 * @toVw 20 * @toVw;
padding: 10rem 20rem;
background: white;
margin: 10 * @toVw 0;
margin: 10rem 0;
.commonTitle{
display: flex;
display: -webkit-flex;
vertical-align: top;
.line{height: 20 * @toVw;width: 4 * @toVw;border-radius:2 * @toVw;margin-right: 10 * @toVw;margin:auto 10 * @toVw auto 0;}
.more{height: 33 * @toVw;line-height:43 * @toVw;font-size: 12 * @toVw;color: #666666;flex:1;text-align:right;overflow: hidden;
.iconfont{font-size: 14 * @toVw;color: #666666;}
.line{height: 20rem;width: 4rem;border-radius:2rem;margin-right: 10rem;margin:auto 10rem auto 0;}
.more{height: 33rem;line-height:43rem;font-size: 12rem;color: #666666;flex:1;text-align:right;overflow: hidden;
.iconfont{font-size: 14rem;color: #666666;}
}
.title{font-size: 24 * @toVw;height: 33 * @toVw;line-height: 33 * @toVw;display: inline-block;margin-right: 10 * @toVw;font-weight: bold;}
.tip{font-size: 12 * @toVw;color: #999999;height: 33 * @toVw;display: inline-block;line-height: 43 * @toVw;overflow: hidden;}
.title{font-size: 24rem;height: 33rem;line-height: 33rem;display: inline-block;margin-right: 10rem;font-weight: bold;}
.tip{font-size: 12rem;color: #999999;height: 33rem;display: inline-block;line-height: 43rem;overflow: hidden;}
}
.lookData{font-size: 12 * @toVw;
.iconfont{font-size: 12 * @toVw;}
.lookData{font-size: 12rem;
.iconfont{font-size: 12rem;}
}
}
.zb{height: 265 * @toVw;overflow: hidden;}
.zb{height: 265rem;overflow: hidden;}
.med{
.commonTitle{
.line{
......@@ -968,28 +968,28 @@ export default {
display: -webkit-flex;
text-align: center;
flex-wrap:wrap;
height: 212 * @toVw;
height: 212rem;
overflow: hidden;
.contentItem{
width: 48%;
height: 191 * @toVw;
margin-top: 18 * @toVw;
height: 191rem;
margin-top: 18rem;
margin-left: 1%;
margin-right: 1%;
position: relative;
img{width: 107 * @toVw;height:107 * @toVw;position: absolute;top: 0;left: 27 * @toVw;border-radius:53 * @toVw ; }
.white{position: absolute;background: white;width: 20 * @toVw;height: 20 * @toVw;border-radius: 10 * @toVw;top:43.5 * @toVw ; left: 70.5 * @toVw;}
img{width: 107rem;height:107rem;position: absolute;top: 0;left: 27rem;border-radius:53rem ; }
.white{position: absolute;background: white;width: 20rem;height: 20rem;border-radius: 10rem;top:43.5rem ; left: 70.5rem;}
.text{
width: 161 * @toVw;
height: 161 * @toVw;
margin-top: 30 * @toVw;
width: 161rem;
height: 161rem;
margin-top: 30rem;
color: #999999;
padding-top: 90 * @toVw;
box-shadow: 1 * @toVw 2 * @toVw 5 * @toVw 0 * @toVw rgba(0,0,0,0.2);
border-radius:16 * @toVw;
padding-top: 90rem;
box-shadow: 1rem 2rem 5rem 0rem rgba(0,0,0,0.2);
border-radius:16rem;
box-sizing: border-box;
.title{font-size: 14 * @toVw;color: black;}
.enTitle{font-size: 12 * @toVw;line-height: 17 * @toVw;}
.title{font-size: 14rem;color: black;}
.enTitle{font-size: 12rem;line-height: 17rem;}
}
}
}
......@@ -1003,23 +1003,23 @@ export default {
.content{
text-align: center;
.contentItem{
margin-top: 18 * @toVw;
margin-top: 18rem;
position: relative;
box-shadow: 1 * @toVw 2 * @toVw 5 * @toVw 0 * @toVw rgba(0,0,0,0.2);
border-radius:16 * @toVw;
box-shadow: 1rem 2rem 5rem 0rem rgba(0,0,0,0.2);
border-radius:16rem;
overflow: hidden;
img{width: 335 * @toVw;height:150 * @toVw; }
img{width: 335rem;height:150rem; }
.text{
display: flex;
display: -webkit-flex;
width: 335 * @toVw;
width: 335rem;
color: #999999;
padding: 19 * @toVw 15 * @toVw;
padding: 19rem 15rem;
box-sizing: border-box;
.title{font-size: 12 * @toVw;color: black;}
.line{border-right:1 * @toVw solid #999999;height: 20 * @toVw;margin: 0 10 * @toVw; }
.title{font-size: 12rem;color: black;}
.line{border-right:1rem solid #999999;height: 20rem;margin: 0 10rem; }
.lookData{flex: 1;text-align: right;}
.enTitle{font-size: 12 * @toVw;}
.enTitle{font-size: 12rem;}
}
}
}
......@@ -1045,24 +1045,24 @@ export default {
justify-content: space-between;
.contentItem{
width: 162*@toVw;
margin-top: 18 * @toVw;
margin-top: 18rem;
position: relative;
box-shadow: 1 * @toVw 2 * @toVw 5 * @toVw 0 * @toVw rgba(0,0,0,0.2);
border-radius:16 * @toVw;
box-shadow: 1rem 2rem 5rem 0rem rgba(0,0,0,0.2);
border-radius:16rem;
overflow: hidden;
padding-bottom: 18 * @toVw;
padding-bottom: 18rem;
img{width:100%; }
.text{
color: #999999;
box-sizing: border-box;
padding: 10 * @toVw 15 * @toVw 0;
padding: 10rem 15rem 0;
display: flex;
display: -webkit-flex;
justify-content: space-between;
.title{font-size: 14 * @toVw;color: black;text-align: left;width: 50%;}
.title{font-size: 14rem;color: black;text-align: left;width: 50%;}
.lookData{}
}
.tip{color: #999999;padding: 0 15 * @toVw ;text-align: left;margin-top: 4 * @toVw;font-size: 12 * @toVw;}
.tip{color: #999999;padding: 0 15rem ;text-align: left;margin-top: 4rem;font-size: 12rem;}
}
}
}
......@@ -1070,58 +1070,58 @@ export default {
.btn-block {
display: flex;
display: -webkit-flex;
padding: 12 * @toVw 20 * @toVw ;
padding: 12rem 20rem ;
background: white;
justify-content: space-around;
-webkit-justify-content: space-around;
width: 335 * @toVw;
width: 335rem;
.btn {
width: 105 * @toVw;
height:44 * @toVw;
border-radius: 12 * @toVw;
box-shadow: 1 * @toVw 2 * @toVw 5 * @toVw 0 * @toVw rgba(0,0,0,0.2);
width: 105rem;
height:44rem;
border-radius: 12rem;
box-shadow: 1rem 2rem 5rem 0rem rgba(0,0,0,0.2);
position: relative;
.nolook{position: absolute;top: -5 * @toVw;left: -5 * @toVw; background: #ff4d4f;width: 16 * @toVw;height: 16 * @toVw;
color: white;border-radius: 8 * @toVw;text-align: center;font-size: 12 * @toVw;line-height: 16 * @toVw;}
.nolook{position: absolute;top: -5rem;left: -5rem; background: #ff4d4f;width: 16rem;height: 16rem;
color: white;border-radius: 8rem;text-align: center;font-size: 12rem;line-height: 16rem;}
img {
width: 105* @toVw;
height: 44* @toVw;
}
}
.toPreview{
background:url('https://static-cdn.changchangenglish.com/new-sing/static/images/index_icon_min.png') 0 -63 * @toVw;background-size:100% ;
background:url('https://static-cdn.changchangenglish.com/new-sing/static/images/index_icon_min.png') 0 -63rem;background-size:100% ;
}
.toBbda{
background:url('https://static-cdn.changchangenglish.com/new-sing/static/images/index_icon_min.png') ;background-size:100%;
}
.toCollection{
background:url('https://static-cdn.changchangenglish.com/new-sing/static/images/index_icon_min.png') 0 -128 * @toVw ;background-size:100%;
background:url('https://static-cdn.changchangenglish.com/new-sing/static/images/index_icon_min.png') 0 -128rem ;background-size:100%;
}
.toTeacher{
background:url('https://static-cdn.changchangenglish.com/new-sing/static/images/index_icon_min.png') 0 -191 * @toVw ;background-size:100%;
background:url('https://static-cdn.changchangenglish.com/new-sing/static/images/index_icon_min.png') 0 -191rem ;background-size:100%;
}
}
.orderBox{
position: relative;
padding: 12 * @toVw 20 * @toVw 12 * @toVw;
padding: 12rem 20rem 12rem;
background: white;
margin-top: 10* @toVw;
.item:first-child{position: relative;z-index: 2000;background: white; }
.item{
box-shadow:1px 2px 7px 0px rgba(255,210,207,1);
border-radius: 16* @toVw;
.top{display: flex;padding: 15* @toVw 10 * @toVw;
img{width: 74 * @toVw;height: 74 * @toVw ;border-radius:10* @toVw; }
.top{display: flex;padding: 15* @toVw 10rem;
img{width: 74rem;height: 74rem ;border-radius:10* @toVw; }
.info{
padding-left: 10 * @toVw;
h3{font-size: 15 * @toVw;color: #333333;}
p{font-size: 13 * @toVw;color:#666666;
padding-left: 10rem;
h3{font-size: 15rem;color: #333333;}
p{font-size: 13rem;color:#666666;
span{color: #FF7171;}
}
}
}
.line{height: 0;border-bottom: 1px solid #E2E2E2;}
.bottom{padding: 4* @toVw 8 * @toVw;
.bottom{padding: 4* @toVw 8rem;
display: flex;
justify-content: space-between;
.text{height: 34* @toVw;line-height: 34* @toVw;color: #333333;font-size: 13* @toVw;}
......@@ -1140,46 +1140,46 @@ export default {
.item:first-child{position: relative;z-index: 10;background: white; }
}
.lesson-block {
padding-bottom: 20 * @toVw;
padding-bottom: 20rem;
.goods-block {
position: relative;
width: 335 * @toVw;
width: 335rem;
.tips {
display: inline-block;
font-size: 12 * @toVw;
font-size: 12rem;
font-family: PingFang-SC-Bold;
font-weight: normal;
color: rgba(255, 255, 255, 1);
line-height: 17 * @toVw;
padding: 2 * @toVw 5 * @toVw;
line-height: 17rem;
padding: 2rem 5rem;
position: absolute;
right: 10 * @toVw;
top: 12 * @toVw;
right: 10rem;
top: 12rem;
background: rgba(245, 166, 35, 1);
border-radius: 11 * @toVw;
border-radius: 11rem;
}
img {
width: 335 * @toVw;
height: 236 * @toVw;
border-radius: 8 * @toVw;
width: 335rem;
height: 236rem;
border-radius: 8rem;
}
}
}
.class-block {
margin-top: 10 * @toVw;
margin-top: 10rem;
font-family: PingFang-SC-Medium;
font-size: 18 * @toVw;
font-size: 18rem;
color: #333333;
text-align: center;
background: white;
.title {
padding: 8 * @toVw;
padding: 8rem;
position: relative;
.more {
position: absolute;
width: 30 * @toVw;
bottom: 10 * @toVw;
right: 20 * @toVw;
width: 30rem;
bottom: 10rem;
right: 20rem;
}
}
}
......@@ -1187,27 +1187,27 @@ export default {
@toVw:100/1024vw;
.index {
background: #F5F5F9;
padding-bottom: 50 * @toVw;
padding-bottom: 50rem;
}
.padTop{display: flex;justify-content: space-around;display: -webkit-flex;-webkit-justify-content: space-around;
background: white;
.btn-block {
display: block;
padding: 15* @toVw 42 * @toVw 0 30 * @toVw;
padding: 15* @toVw 42rem 0 30rem;
background: white;
-webkit-justify-content: space-around;
width: 268 * @toVw;
width: 268rem;
box-sizing: border-box;
.btn {
width: 196 * @toVw;
height:161 * @toVw;
border-radius: 24 * @toVw;
box-shadow: 1 * @toVw 2 * @toVw 5 * @toVw 0 * @toVw rgba(0,0,0,0.2);
margin-bottom: 20 * @toVw;
width: 196rem;
height:161rem;
border-radius: 24rem;
box-shadow: 1rem 2rem 5rem 0rem rgba(0,0,0,0.2);
margin-bottom: 20rem;
position: relative;
background: #ff9c6e;
.nolook{position: absolute;top: -5 * @toVw;left: -5 * @toVw; background: #ff4d4f;width: 26 * @toVw;height: 26 * @toVw;
color: white;border-radius: 13 * @toVw;text-align: center;font-size: 12 * @toVw;line-height: 26 * @toVw;}
.nolook{position: absolute;top: -5rem;left: -5rem; background: #ff4d4f;width: 26rem;height: 26rem;
color: white;border-radius: 13rem;text-align: center;font-size: 12rem;line-height: 26rem;}
img {
width: 196* @toVw;
height: 161* @toVw;
......@@ -1217,18 +1217,18 @@ export default {
background:url('https://static-cdn.changchangenglish.com/new-sing/static/images/index_icon_max.png') 0 0 ;background-size:100% ;
}
.toBbda{
background:url('https://static-cdn.changchangenglish.com/new-sing/static/images/index_icon_max.png') 0 -540 * @toVw;background-size:100% ;
background:url('https://static-cdn.changchangenglish.com/new-sing/static/images/index_icon_max.png') 0 -540rem;background-size:100% ;
}
.toCollection{
background:url('https://static-cdn.changchangenglish.com/new-sing/static/images/index_icon_max.png') 0 -180 * @toVw;background-size:100% ;
background:url('https://static-cdn.changchangenglish.com/new-sing/static/images/index_icon_max.png') 0 -180rem;background-size:100% ;
}
.toTeacher{
background:url('https://static-cdn.changchangenglish.com/new-sing/static/images/index_icon_max.png') 0 -360 * @toVw;background-size:100% ;
background:url('https://static-cdn.changchangenglish.com/new-sing/static/images/index_icon_max.png') 0 -360rem;background-size:100% ;
}
}
.banner-block{
width:756* @toVw;
height: 525 * @toVw;
height: 525rem;
position: relative;
background: white;
padding:14*@toVw 30*@toVw 20*@toVw 42*@toVw;
......@@ -1237,77 +1237,77 @@ export default {
// box-sizing: border-box;
.bgimg {
position: absolute;
width: 714 * @toVw;
width: 714rem;
z-index: 2;
}
.content {
position: absolute;
z-index: 3;
height: 525 * @toVw;
width:714 * @toVw;
border-radius: 30 * @toVw;
height: 525rem;
width:714rem;
border-radius: 30rem;
overflow: hidden;
}
.Banner{
border-radius: 33 * @toVw;
border-radius: 33rem;
overflow: hidden;
position: relative;
// background: white;
height: 525 * @toVw;
width:714 * @toVw;
box-shadow: 1 * @toVw 2 * @toVw 5 * @toVw 0 * @toVw rgba(0,0,0,0.2);
.qr{width: 257 * @toVw;
height: 525rem;
width:714rem;
box-shadow: 1rem 2rem 5rem 0rem rgba(0,0,0,0.2);
.qr{width: 257rem;
position: absolute;left: 230* @toVw;top:60* @toVw ;z-index: 2;
}
.text{font-size: 26 * @toVw;color: #FF4D4F;text-align: center;position: absolute;top: 331* @toVw;width: 100%;font-weight:500;
.text{font-size: 26rem;color: #FF4D4F;text-align: center;position: absolute;top: 331* @toVw;width: 100%;font-weight:500;
// font-size:
}
.date{color: white;text-align: center;position: absolute;bottom: 30*@toVw;width: 100%;font-size: 22 * @toVw;}
.date{color: white;text-align: center;position: absolute;bottom: 30*@toVw;width: 100%;font-size: 22rem;}
.triangle{background: #FFC53D;width:144* @toVw ;height: 144* @toVw;position: absolute;right: -78* @toVw; top: -64* @toVw; transform:rotate(-41deg);z-index: 3;
span{color: white;font-size: 18 px;transform:rotate(91deg);position: absolute;top: 62* @toVw;font-size: 18 * @toVw;}
span{color: white;font-size: 18 px;transform:rotate(91deg);position: absolute;top: 62* @toVw;font-size: 18rem;}
}
.data_only{bottom: 12*@toVw;}
}
.unBanner{
border-radius: 33 * @toVw;
border-radius: 33rem;
overflow: hidden;
height: 525 * @toVw;
width:714 * @toVw;
height: 525rem;
width:714rem;
position: relative;
background: #ff7d77;
box-shadow: 1 * @toVw 2 * @toVw 5 * @toVw 0 * @toVw rgba(0,0,0,0.2);
box-shadow: 1rem 2rem 5rem 0rem rgba(0,0,0,0.2);
.title{position: absolute;color: white;top: 35* @toVw;left: 20* @toVw;
}
.date{color: white;text-align: center;position: absolute;bottom: 66*@toVw;padding-top: 10* @toVw;border-radius:56 * @toVw;
.date{color: white;text-align: center;position: absolute;bottom: 66*@toVw;padding-top: 10* @toVw;border-radius:56rem;
box-sizing: border-box;background:#FFC53D;
left: 45* @toVw;font-size: 14 * @toVw;width: 324* @toVw;height:116* @toVw;
.date1{font-size: 30 * @toVw;}
.date2{font-size: 34 * @toVw;}
left: 45* @toVw;font-size: 14rem;width: 324* @toVw;height:116* @toVw;
.date1{font-size: 30rem;}
.date2{font-size: 34rem;}
}
.triangle{background: #FFC53D;width:144* @toVw ;height: 144* @toVw;position: absolute;right: -78* @toVw; top: -64* @toVw; transform:rotate(-41deg);z-index: 3;
span{color: white;transform:rotate(91deg);position: absolute;top: 68* @toVw;font-size: 18 * @toVw; }
span{color: white;transform:rotate(91deg);position: absolute;top: 68* @toVw;font-size: 18rem; }
}
}
.canvas{width: 716 * @toVw;z-index: 2;}
.canvas{width: 716rem;z-index: 2;}
}
}
.contentBox{
padding: 20 * @toVw 42 * @toVw 20 * @toVw;
padding: 20rem 42rem 20rem;
background: white;
margin: 10 * @toVw 0;
margin: 10rem 0;
.commonTitle{
display: flex;
display: -webkit-flex;
vertical-align: top;
.line{height: 20 * @toVw;width: 4 * @toVw;border-radius:2 * @toVw;margin-right: 10 * @toVw;margin:auto 10 * @toVw auto 0;}
.more{height: 33 * @toVw;line-height:43 * @toVw;font-size: 12 * @toVw;color: #666666;flex:1;text-align:right;overflow: hidden;
.iconfont{font-size: 14 * @toVw;color: #666666;}
.line{height: 20rem;width: 4rem;border-radius:2rem;margin-right: 10rem;margin:auto 10rem auto 0;}
.more{height: 33rem;line-height:43rem;font-size: 12rem;color: #666666;flex:1;text-align:right;overflow: hidden;
.iconfont{font-size: 14rem;color: #666666;}
}
.title{font-size: 24 * @toVw;height: 33 * @toVw;line-height: 33 * @toVw;display: inline-block;margin-right: 10 * @toVw;font-weight: bold;}
.tip{font-size: 12 * @toVw;color: #999999;height: 33 * @toVw;display: inline-block;line-height: 43 * @toVw;overflow: hidden;}
.title{font-size: 24rem;height: 33rem;line-height: 33rem;display: inline-block;margin-right: 10rem;font-weight: bold;}
.tip{font-size: 12rem;color: #999999;height: 33rem;display: inline-block;line-height: 43rem;overflow: hidden;}
}
.lookData{font-size: 12 * @toVw;
.iconfont{font-size: 12 * @toVw;}
.lookData{font-size: 12rem;
.iconfont{font-size: 12rem;}
}
}
.zb{height: auto;}
......@@ -1318,27 +1318,27 @@ export default {
text-align: center;
flex-wrap:wrap;
-webkit-flex-wrap:wrap;
height: 299 * @toVw;
height: 299rem;
// overflow: hidden;
.contentItem{
width: auto;
height: 257 * @toVw;
margin-top: 18 * @toVw;
height: 257rem;
margin-top: 18rem;
margin-right: 19*@toVw;
position: relative;
img{width: 146 * @toVw;height:146 * @toVw;position: absolute;top: 0;left: 37 * @toVw;border-radius:73 * @toVw ; }
.white{position: absolute;background: white;width: 26 * @toVw;height: 26 * @toVw;border-radius: 13 * @toVw;top:61.5 * @toVw ; left: 98 * @toVw;}
img{width: 146rem;height:146rem;position: absolute;top: 0;left: 37rem;border-radius:73rem ; }
.white{position: absolute;background: white;width: 26rem;height: 26rem;border-radius: 13rem;top:61.5rem ; left: 98rem;}
.text{
width: 220 * @toVw;
height: 205 * @toVw;
margin-top: 72 * @toVw;
width: 220rem;
height: 205rem;
margin-top: 72rem;
color: #999999;
padding-top: 90 * @toVw;
box-shadow: 1 * @toVw 2 * @toVw 5 * @toVw 0 * @toVw rgba(0,0,0,0.2);
border-radius:16 * @toVw;
padding-top: 90rem;
box-shadow: 1rem 2rem 5rem 0rem rgba(0,0,0,0.2);
border-radius:16rem;
box-sizing: border-box;
.title{font-size: 18 * @toVw;color: black;}
.enTitle{font-size: 14 * @toVw;line-height: 30 * @toVw;}
.title{font-size: 18rem;color: black;}
.enTitle{font-size: 14rem;line-height: 30rem;}
}
}
.contentItem:nth-child(4){margin-right: 0;}
......@@ -1352,23 +1352,23 @@ export default {
-webkit-justify-content: space-between;
.contentItem{
width: 460* @toVw;
margin-top: 18 * @toVw;
margin-top: 18rem;
position: relative;
box-shadow: 1 * @toVw 2 * @toVw 5 * @toVw 0 * @toVw rgba(0,0,0,0.2);
border-radius:16 * @toVw;
box-shadow: 1rem 2rem 5rem 0rem rgba(0,0,0,0.2);
border-radius:16rem;
overflow: hidden;
img{width: 460 * @toVw;height:auto; }
img{width: 460rem;height:auto; }
.text{
display: flex;
display: -webkit-flex;
width: 100%;
color: #999999;
padding: 19 * @toVw 15 * @toVw;
padding: 19rem 15rem;
box-sizing: border-box;
.title{font-size: 15 * @toVw;color: black;}
.line{border-right:1 * @toVw solid #999999;height: 20 * @toVw;margin: 0 10 * @toVw; }
.title{font-size: 15rem;color: black;}
.line{border-right:1rem solid #999999;height: 20rem;margin: 0 10rem; }
.lookData{flex: 1;text-align: right;}
.enTitle{font-size: 13 * @toVw;}
.enTitle{font-size: 13rem;}
}
}
}
......@@ -1389,24 +1389,24 @@ export default {
-webkit-justify-content: space-between;
.contentItem{
width: 221*@toVw;
margin-top: 18 * @toVw;
margin-top: 18rem;
position: relative;
box-shadow: 1 * @toVw 2 * @toVw 5 * @toVw 0 * @toVw rgba(0,0,0,0.2);
border-radius:16 * @toVw;
box-shadow: 1rem 2rem 5rem 0rem rgba(0,0,0,0.2);
border-radius:16rem;
overflow: hidden;
padding-bottom: 18 * @toVw;
padding-bottom: 18rem;
img{width:100%; }
.text{
color: #999999;
box-sizing: border-box;
padding: 10 * @toVw 15 * @toVw 0;
padding: 10rem 15rem 0;
display: flex;
display: -webkit-flex;
justify-content: space-between;
.title{font-size: 18 * @toVw;color: black;text-align: left;width: 50%;}
.title{font-size: 18rem;color: black;text-align: left;width: 50%;}
.lookData{}
}
.tip{color: #999999;padding: 0 15 * @toVw ;text-align: left;margin-top: 4 * @toVw;font-size: 12 * @toVw;}
.tip{color: #999999;padding: 0 15rem ;text-align: left;margin-top: 4rem;font-size: 12rem;}
}
}
}
......
src/components/indexPage/med.vue
View file @ 11946771
......@@ -78,7 +78,7 @@ import audioPage from '../collection/audio'
<style scoped lang="less">
@import "../../util/public";
.contentBox{
padding: 10 * @toVw 20 * @toVw;
padding: 10rem 20rem;
background: white;
margin: 10px 0;
.commonTitle{
......@@ -110,17 +110,17 @@ import audioPage from '../collection/audio'
flex-wrap:wrap;
.contentItem{
width: 50%;
height: 191 * @toVw;
height: 191rem;
margin-top: 18px;
position: relative;
img{width: 107 * @toVw;height:107 * @toVw;position: absolute;top: 0;left: 27 * @toVw;border-radius:53 * @toVw ; }
.white{position: absolute;background: white;width: 20px;height: 20px;border-radius: 10px;top:43.5 * @toVw ; left: 70.5 * @toVw;}
img{width: 107rem;height:107rem;position: absolute;top: 0;left: 27rem;border-radius:53rem ; }
.white{position: absolute;background: white;width: 20px;height: 20px;border-radius: 10px;top:43.5rem ; left: 70.5rem;}
.text{
width: 161 * @toVw;
height: 161 * @toVw;
margin-top: 30 * @toVw;
width: 161rem;
height: 161rem;
margin-top: 30rem;
color: #999999;
padding-top: 90 * @toVw;
padding-top: 90rem;
box-shadow: 1px 2px 5px 0px rgba(0,0,0,0.2);
border-radius:16px;
box-sizing: border-box;
......
src/components/indexPage/zb.vue
View file @ 11946771
......@@ -62,7 +62,7 @@
<style scoped lang="less">
@import "../../util/public";
.contentBox{
padding: 20 * @toVw 20 * @toVw;
padding: 20rem 20rem;
background: white;
margin: 10px 0;
.commonTitle{
......@@ -91,23 +91,23 @@
.content{
text-align: center;
.contentItem{
margin-top: 18 * @toVw;
margin-top: 18rem;
position: relative;
box-shadow: 1 * @toVw 2 * @toVw 5 * @toVw 0 * @toVw rgba(0,0,0,0.2);
border-radius:16 * @toVw;
box-shadow: 1rem 2rem 5rem 0rem rgba(0,0,0,0.2);
border-radius:16rem;
overflow: hidden;
img{width: 335 * @toVw;height:150 * @toVw; }
img{width: 335rem;height:150rem; }
.text{
display: flex;
display: -webkit-flex;
width: 335 * @toVw;
width: 335rem;
color: #999999;
padding: 19 * @toVw 15 * @toVw;
padding: 19rem 15rem;
box-sizing: border-box;
.title{font-size: 12 * @toVw;color: black;}
.line{border-right:1 * @toVw solid #999999;height: 20 * @toVw;margin: 0 10 * @toVw; }
.title{font-size: 12rem;color: black;}
.line{border-right:1rem solid #999999;height: 20rem;margin: 0 10rem; }
.lookData{flex: 1;text-align: right;}
.enTitle{font-size: 12 * @toVw;}
.enTitle{font-size: 12rem;}
}
}
}
......
src/components/inspector/inspectorActivit.vue
View file @ 11946771
......@@ -196,7 +196,7 @@
.banner-block{
text-align: center;
position: relative;
top: -20 * @toVw;
top: -20rem;
img{
width: 100%;
}
......@@ -206,15 +206,15 @@
z-index: 10;
background: white;
top: -42*@toVw;
padding: 20 * @toVw;
padding: 20rem;
border-radius:20*@toVw;
.tip{font-size: 12*@toVw;color: #FF7875;position: absolute;top: 74 * @toVw;left: 47 * @toVw;}
.tip{font-size: 12*@toVw;color: #FF7875;position: absolute;top: 74rem;left: 47rem;}
.input-block{
width: 273*@toVw;height: 47*@toVw;
line-height:47*@toVw;
text-indent: 10*@toVw;
border: 1*@toVw solid #cccccc;
margin-bottom: 26 * @toVw;
margin-bottom: 26rem;
position: relative;
.img{
position: absolute;
......@@ -235,7 +235,7 @@
}
input{
padding: 10 * @toVw 0;
padding: 10rem 0;
font-size:14*@toVw;
background: transparent;
font-family:PingFangSC-Semibold;
......@@ -302,6 +302,6 @@
left: 0;
right: 0;
bottom: 0;
width: 375 * @toVw;
width: 375rem;
}
</style>
src/components/map/index.vue
View file @ 11946771
......@@ -814,15 +814,15 @@
display: none;
}
.unit-li{
width: 68 * @toVw;
width: 68rem;
text-align: center;
margin-top: 2.6666vw;
height:60 * @toVw;
border-radius:8 * @toVw 8 * @toVw 0*@toVw 0*@toVw;
height:60rem;
border-radius:8rem 8rem 0*@toVw 0*@toVw;
font-size:10* @toVw;
font-family:PingFangSC-Semibold;
font-weight:600;
padding-top: 12 * @toVw;
padding-top: 12rem;
color:rgba(102,102,102,1);
line-height:20* @toVw;
img{
......@@ -844,7 +844,7 @@
-webkit-overflow-scrolling:touch;
.card-block{
box-shadow:0* @toVw 2* @toVw 5* @toVw 1* @toVw rgba(153,153,153,0.56);
margin: 20 * @toVw;
margin: 20rem;
border-radius: 8*@toVw;
img{
width: 100%;
......@@ -856,9 +856,9 @@
display: -webkit-flex;
justify-content: space-between;
margin: auto;
padding: 10 * @toVw;
padding: 10rem;
position: relative;
border-bottom: 1 * @toVw solid #EEEEEE;
border-bottom: 1rem solid #EEEEEE;
.text-block{
margin-left: 0;
}
......@@ -901,7 +901,7 @@
font-size:14*@toVw;
font-family:PingFang-SC-Medium;
font-weight:500;
min-width: 170 * @toVw;
min-width: 170rem;
overflow: hidden;
white-space:nowrap;
text-overflow:ellipsis;
......@@ -919,11 +919,11 @@
text-align: center;
background: white;
border-radius: 8*@toVw;
width: 276 * @toVw;
width: 276rem;
.header{
width: 276 * @toVw;
height: 137 * @toVw;
padding-top: 36 * @toVw;
width: 276rem;
height: 137rem;
padding-top: 36rem;
background-size: 100% 100%;
position: relative;
.title{
......@@ -945,7 +945,7 @@
left: 50%;
margin-left: -46*@toVw;
bottom: 20*@toVw;
line-height: 36 * @toVw;
line-height: 36rem;
font-size:16*@toVw;
font-family:PingFang-SC-Bold;
font-weight:bold;
......@@ -1069,9 +1069,9 @@
display: flex;
display: -webkit-flex;
text-align: center;
height:38 * @toVw;
height:38rem;
line-height: 38*@toVw;
border-radius:8 * @toVw;
border-radius:8rem;
font-size:12* @toVw;
font-family:PingFangSC-Semibold;
font-weight:600;
......@@ -1169,7 +1169,7 @@
text-align: center;
background: white;
border-radius: 8*@toVw;
width: 493 * @toVw;
width: 493rem;
height: 220*@toVw;
position: relative;
.header{
......@@ -1202,7 +1202,7 @@
left: 50%;
margin-left: -46*@toVw;
top: 50*@toVw;
line-height: 36 * @toVw;
line-height: 36rem;
font-size:16*@toVw;
font-family:PingFang-SC-Bold;
font-weight:bold;
......
src/components/map/mapDefault.vue
View file @ 11946771
......@@ -67,20 +67,20 @@
<style scoped lang="less">
@import "../../util/public";
.map{
padding-bottom: 45 * @toVw;
padding-bottom: 45rem;
.background{
width: 375*@toVw;
}
.go20{
position: absolute;
width: 134 * @toVw;
top: 196 * @toVw;
left: 42 * @toVw;
width: 134rem;
top: 196rem;
left: 42rem;
}
.title-d{
font-size: 12 * @toVw;
width:100 * @toVw ;
height: 30 * @toVw;
font-size: 12rem;
width:100rem ;
height: 30rem;
color: #3c2700;
position: absolute;
top: 0;
......@@ -91,19 +91,19 @@
-webkit-box-orient: vertical;
&.title-d-name1{
top: 525 *@toVw;
right:40 * @toVw ;
right:40rem ;
}
&.title-d-name6{
top: 1210 *@toVw;
left:26 * @toVw ;
left:26rem ;
}
&.title-d-name11{
top: 1865 *@toVw;
right:32 * @toVw ;
right:32rem ;
}
&.title-d-name16{
top: 2598 *@toVw;
right:39 * @toVw ;
right:39rem ;
}
}
.island-block{
......@@ -121,8 +121,8 @@
bottom: 14*@toVw;
left: 76*@toVw;
&.day20{
width: 45 * @toVw;
left: 60 * @toVw;
width: 45rem;
left: 60rem;
}
}
.star-block{
......@@ -137,84 +137,84 @@
animation: dodge 1s infinite;
}
&.land201{
top: 287 * @toVw;
right: 39 * @toVw;
top: 287rem;
right: 39rem;
}
&.land202{
top: 407 * @toVw;
left: 39 * @toVw;
top: 407rem;
left: 39rem;
}
&.land203{
top: 564 * @toVw;
right: 158 * @toVw;
top: 564rem;
right: 158rem;
}
&.land204{
top: 666 * @toVw;
right: 24 * @toVw;
top: 666rem;
right: 24rem;
}
&.land205{
top: 775 * @toVw;
left: 35 * @toVw;
top: 775rem;
left: 35rem;
}
&.land206{
top: 910 * @toVw;
right: 11 * @toVw;
top: 910rem;
right: 11rem;
}
&.land207{
top: 993 * @toVw;
left: 24 * @toVw;
top: 993rem;
left: 24rem;
}
&.land208{
top: 1131 * @toVw;
right: 112 * @toVw;
top: 1131rem;
right: 112rem;
}
&.land209{
top: 1301 * @toVw;
right: 24 * @toVw;
top: 1301rem;
right: 24rem;
}
&.land2010{
top: 1420 * @toVw;
right: 169 * @toVw;
top: 1420rem;
right: 169rem;
}
&.land2011{
top: 1602 * @toVw;
right: 50 * @toVw;
top: 1602rem;
right: 50rem;
}
&.land2012{
top: 1765 * @toVw;
left: 48 * @toVw;
top: 1765rem;
left: 48rem;
}
&.land2013{
top: 1908 * @toVw;
right: 78 * @toVw;
top: 1908rem;
right: 78rem;
}
&.land2014{
top: 2095 * @toVw;
right: 38 * @toVw;
top: 2095rem;
right: 38rem;
}
&.land2015{
top: 2208 * @toVw;
left: 46 * @toVw;
top: 2208rem;
left: 46rem;
}
&.land2016{
top: 2381 * @toVw;
right: 81 * @toVw;
top: 2381rem;
right: 81rem;
}
&.land2017{
top: 2549 * @toVw;
left: 33 * @toVw;
top: 2549rem;
left: 33rem;
}
&.land2018{
top: 2646 * @toVw;
right: 69 * @toVw;
top: 2646rem;
right: 69rem;
}
&.land2019{
top: 2799 * @toVw;
right: 200 * @toVw;
top: 2799rem;
right: 200rem;
}
&.land2020{
top: 2959 * @toVw;
right: 47 * @toVw;
top: 2959rem;
right: 47rem;
}
}
@keyframes dodge
......
src/components/map/numberMap.vue
View file @ 11946771
......@@ -61,20 +61,20 @@
<style scoped lang="less">
@import "../../util/public";
.map{
padding-bottom: 45 * @toVw;
padding-bottom: 45rem;
.background{
width: 375*@toVw;
}
.go20{
position: absolute;
width: 134 * @toVw;
top: 196 * @toVw;
left: 42 * @toVw;
width: 134rem;
top: 196rem;
left: 42rem;
}
.title-d{
font-size: 12 * @toVw;
width:100 * @toVw ;
height: 30 * @toVw;
font-size: 12rem;
width:100rem ;
height: 30rem;
color: #3c2700;
position: absolute;
top: 0;
......@@ -85,19 +85,19 @@
-webkit-box-orient: vertical;
&.title-d-name1{
top: 525 *@toVw;
right:40 * @toVw ;
right:40rem ;
}
&.title-d-name6{
top: 1210 *@toVw;
left:26 * @toVw ;
left:26rem ;
}
&.title-d-name11{
top: 1865 *@toVw;
right:32 * @toVw ;
right:32rem ;
}
&.title-d-name16{
top: 2598 *@toVw;
right:39 * @toVw ;
right:39rem ;
}
}
.island-block{
......@@ -105,14 +105,14 @@
width: 105*@toVw;
text-align: center;
.land{
width: 70 * @toVw;
width: 70rem;
position: relative;
z-index: 1;
}
.shadow{
width: 100%;
left: 0;
bottom: -20 * @toVw;
bottom: -20rem;
z-index: 0;
position: absolute;
......@@ -124,7 +124,7 @@
bottom: -20*@toVw;
img{
&:nth-child(2){
width: 30 * @toVw;
width: 30rem;
margin: 0 -5*@toVw;
}
width: 20*@toVw;
......@@ -134,114 +134,114 @@
animation: dodge 1s infinite;
}
&.land201{
top: 287 * @toVw;
right: 90 * @toVw;
top: 287rem;
right: 90rem;
.land{
width: 52 * @toVw;
width: 52rem;
}
}
&.land202{
top: 407 * @toVw;
left: 19 * @toVw;
top: 407rem;
left: 19rem;
.land{
width: 66 * @toVw;
width: 66rem;
}
}
&.land203{
top: 564 * @toVw;
right: 188 * @toVw;
top: 564rem;
right: 188rem;
.land{
width: 55 * @toVw;
width: 55rem;
}
}
&.land204{
top: 666 * @toVw;
right: 54 * @toVw;
top: 666rem;
right: 54rem;
.land{
width: 54 * @toVw;
width: 54rem;
}
}
&.land205{
top: 775 * @toVw;
left: 15 * @toVw;
top: 775rem;
left: 15rem;
.land{
width: 64 * @toVw;
width: 64rem;
}
}
&.land206{
top: 910 * @toVw;
right: 31 * @toVw;
top: 910rem;
right: 31rem;
.land{
width: 61 * @toVw;
width: 61rem;
}
}
&.land207{
top: 993 * @toVw;
left: 4 * @toVw;
top: 993rem;
left: 4rem;
.land{
width: 70 * @toVw;
width: 70rem;
}
}
&.land208{
top: 1131 * @toVw;
right: 142 * @toVw;
top: 1131rem;
right: 142rem;
.land{
width: 57 * @toVw;
width: 57rem;
}
}
&.land209{
top: 1301 * @toVw;
right: 61 * @toVw;
top: 1301rem;
right: 61rem;
.land{
width: 56 * @toVw;
width: 56rem;
}
}
&.land2010{
top: 1420 * @toVw;
right: 169 * @toVw;
top: 1420rem;
right: 169rem;
.land{
width: 103 * @toVw;
width: 103rem;
}
}
&.land2011{
top: 1602 * @toVw;
right: 50 * @toVw;
top: 1602rem;
right: 50rem;
}
&.land2012{
top: 1765 * @toVw;
left: 48 * @toVw;
top: 1765rem;
left: 48rem;
}
&.land2013{
top: 1908 * @toVw;
right: 78 * @toVw;
top: 1908rem;
right: 78rem;
}
&.land2014{
top: 2095 * @toVw;
right: 38 * @toVw;
top: 2095rem;
right: 38rem;
}
&.land2015{
top: 2208 * @toVw;
left: 46 * @toVw;
top: 2208rem;
left: 46rem;
}
&.land2016{
top: 2381 * @toVw;
right: 81 * @toVw;
top: 2381rem;
right: 81rem;
}
&.land2017{
top: 2549 * @toVw;
left: 33 * @toVw;
top: 2549rem;
left: 33rem;
}
&.land2018{
top: 2646 * @toVw;
right: 69 * @toVw;
top: 2646rem;
right: 69rem;
}
&.land2019{
top: 2799 * @toVw;
right: 200 * @toVw;
top: 2799rem;
right: 200rem;
}
&.land2020{
top: 2959 * @toVw;
right: 47 * @toVw;
top: 2959rem;
right: 47rem;
}
}
@keyframes dodge
......
src/components/map/once.vue
View file @ 11946771
......@@ -64,7 +64,7 @@
<style scoped lang="less">
@import "../../util/public";
.map{
padding-bottom: 45 * @toVw;
padding-bottom: 45rem;
.background{
width: 375*@toVw;
}
......@@ -75,9 +75,9 @@
width: 195*@toVw;
}
.title-d{
font-size: 12 * @toVw;
width:100 * @toVw ;
height: 30 * @toVw;
font-size: 12rem;
width:100rem ;
height: 30rem;
color: #3c2700;
position: absolute;
top: 0;
......@@ -88,19 +88,19 @@
-webkit-box-orient: vertical;
&.title-d-name1{
top: 525 *@toVw;
right:40 * @toVw ;
right:40rem ;
}
&.title-d-name6{
top: 1210 *@toVw;
left:26 * @toVw ;
left:26rem ;
}
&.title-d-name11{
top: 1865 *@toVw;
right:32 * @toVw ;
right:32rem ;
}
&.title-d-name16{
top: 2598 *@toVw;
right:39 * @toVw ;
right:39rem ;
}
}
.island-block{
......
src/components/map/secMap.vue
View file @ 11946771
......@@ -980,15 +980,15 @@ export default {
display: none;
}
.unit-li{
width: 68 * @toVw;
width: 68rem;
text-align: center;
margin-top: 2.6666vw;
height:60 * @toVw;
border-radius:8 * @toVw 8 * @toVw 0*@toVw 0*@toVw;
height:60rem;
border-radius:8rem 8rem 0*@toVw 0*@toVw;
font-size:10* @toVw;
font-family:PingFangSC-Semibold;
font-weight:600;
padding-top: 12 * @toVw;
padding-top: 12rem;
color:rgba(102,102,102,1);
line-height:20* @toVw;
img{
......@@ -1010,7 +1010,7 @@ export default {
-webkit-overflow-scrolling:touch;
.card-block{
box-shadow:0* @toVw 2* @toVw 5* @toVw 1* @toVw rgba(153,153,153,0.56);
margin: 20 * @toVw;
margin: 20rem;
border-radius: 8*@toVw;
overflow: hidden;
position: relative;
......@@ -1023,12 +1023,12 @@ export default {
height: 140*@toVw;}
.content{position: absolute;width:100% ;z-index: 1;color: white;
height: 140*@toVw;
p{font-size: 12 * @toVw;margin-top: 51 * @toVw;margin-left:19 * @toVw; }
div{font-size: 17 * @toVw; margin: 10 * @toVw;border: 1px solid white;border-radius: 19 * @toVw;
width: 313 * @toVw;height: 38 * @toVw;
line-height:38 * @toVw;
text-indent: 9 * @toVw;
span{display: inline-block;width: 76 * @toVw;
p{font-size: 12rem;margin-top: 51rem;margin-left:19rem; }
div{font-size: 17rem; margin: 10rem;border: 1px solid white;border-radius: 19rem;
width: 313rem;height: 38rem;
line-height:38rem;
text-indent: 9rem;
span{display: inline-block;width: 76rem;
height: 38* @toVw;background: #FF4F59;
float: right;
border-radius: 19*@toVw;
......@@ -1046,9 +1046,9 @@ export default {
display: -webkit-flex;
justify-content: space-between;
margin: auto;
padding: 10 * @toVw;
padding: 10rem;
position: relative;
border-bottom: 1 * @toVw solid #EEEEEE;
border-bottom: 1rem solid #EEEEEE;
.text-block{
margin-left: 0;
}
......@@ -1094,7 +1094,7 @@ export default {
font-size:14*@toVw;
font-family:PingFang-SC-Medium;
font-weight:500;
min-width: 170 * @toVw;
min-width: 170rem;
overflow: hidden;
white-space:nowrap;
text-overflow:ellipsis;
......@@ -1120,11 +1120,11 @@ export default {
text-align: center;
background: white;
border-radius: 8*@toVw;
width: 276 * @toVw;
width: 276rem;
.header{
width: 276 * @toVw;
height: 137 * @toVw;
padding-top: 36 * @toVw;
width: 276rem;
height: 137rem;
padding-top: 36rem;
background-size: 100% 100%;
position: relative;
.title{
......@@ -1146,7 +1146,7 @@ export default {
left: 50%;
margin-left: -46*@toVw;
bottom: 20*@toVw;
line-height: 36 * @toVw;
line-height: 36rem;
font-size:16*@toVw;
font-family:PingFang-SC-Bold;
font-weight:bold;
......
src/components/mine/activityAddr.vue
View file @ 11946771
......@@ -68,11 +68,11 @@ export default {
.address2 {
background: #f5f5f9;
.van-button{
margin-left: 20 * @toVw;
margin-left: 20rem;
}
.head{
i{display: inline-block;border-radius: 50%; width: 11 * @toVw;height: 11 * @toVw; }
padding: 13 * @toVw;
i{display: inline-block;border-radius: 50%; width: 11rem;height: 11rem; }
padding: 13rem;
background: white;
border-bottom: 1px solid #E2E2E2;
color: #666666;
......@@ -89,28 +89,28 @@ export default {
}
.content {
background: white;
padding: 13 * @toVw 0 13 * @toVw 26 * @toVw;
padding: 13rem 0 13rem 26rem;
.top {
line-height: 28 * @toVw;
line-height: 28rem;
color: #333333;
font-weight: bold;
font-size: 17 * @toVw;
font-size: 17rem;
}
.bottom {
color: #666666;
font-size: 14 * @toVw;
line-height: 20 * @toVw;
font-size: 14rem;
line-height: 20rem;
}
.timeInfo{
display: flex;
.text{
color: #999999;
font-size: 12 * @toVw;
font-size: 12rem;
margin-left: 0;
line-height: 26 * @toVw;
line-height: 26rem;
}
.right{
margin-top: 43 * @toVw;
margin-top: 43rem;
}
.van-button--info{
background: white;
......@@ -131,10 +131,10 @@ export default {
-webkit-transform: scale(1,0.5);
}
.tip {
padding: 10 * @toVw 20 * @toVw;
padding: 10rem 20rem;
color: #999999;
font-size: 12 * @toVw;
line-height: 23 * @toVw;
font-size: 12rem;
line-height: 23rem;
}
}
......
src/components/mine/address.vue
View file @ 11946771
......@@ -50,17 +50,17 @@ export default {
background: #f5f5f9;
.content {
background: white;
padding: 10 * @toVw 20 * @toVw;
padding: 10rem 20rem;
.top {
line-height: 28 * @toVw;
line-height: 28rem;
color: #333333;
font-weight: bold;
font-size: 17 * @toVw;
font-size: 17rem;
}
.bottom {
color: #666666;
font-size: 14 * @toVw;
line-height: 20 * @toVw;
font-size: 14rem;
line-height: 20rem;
}
}
.linebox{
......@@ -71,10 +71,10 @@ export default {
display: block;
}
.tip {
padding: 10 * @toVw 20 * @toVw;
padding: 10rem 20rem;
color: #999999;
font-size: 12 * @toVw;
line-height: 23 * @toVw;
font-size: 12rem;
line-height: 23rem;
}
}
@media screen and (orientation: landscape) {
......
src/components/mine/addressEdit.vue
View file @ 11946771
......@@ -196,8 +196,8 @@ export default {
color: #333333;
}
.btn {
margin-top: 50 * @toVw;
padding: 0 34 * @toVw;
margin-top: 50rem;
padding: 0 34rem;
}
#mtcell {
// background: red;
......@@ -225,22 +225,22 @@ export default {
.holder {
color: rgb(204, 204, 204);
position: absolute;
top: 10 * @toVw;
left: 108 * @toVw;
top: 10rem;
left: 108rem;
}
// .mint-cell-value{color: #333333;}
.head {
i {
display: inline-block;
border-radius: 50%;
width: 11 * @toVw;
height: 11 * @toVw;
width: 11rem;
height: 11rem;
}
padding: 13 * @toVw;
padding: 13rem;
background: white;
border-bottom: 1px solid #e2e2e2;
color: #666666;
font-size: 14 * @toVw;
font-size: 14rem;
}
.now {
i {
......@@ -257,32 +257,32 @@ export default {
}
.content {
background: white;
padding: 13 * @toVw 0 13 * @toVw 33 * @toVw;
padding: 13rem 0 13rem 33rem;
.top {
line-height: 28 * @toVw;
line-height: 28rem;
color: #333333;
font-weight: bold;
font-size: 17 * @toVw;
font-size: 17rem;
}
.bottom {
color: #666666;
font-size: 14 * @toVw;
line-height: 20 * @toVw;
font-size: 14rem;
line-height: 20rem;
}
.timeInfo {
display: flex;
.text {
color: #999999;
font-size: 12 * @toVw;
font-size: 12rem;
margin-left: 0;
line-height: 26 * @toVw;
line-height: 26rem;
}
.right {
margin-top: 43 * @toVw;
margin-top: 43rem;
}
.van-button--info {
background: white;
width: 74 * @toVw;
width: 74rem;
color: #60adf0;
border-color: #60adf0;
}
......@@ -295,13 +295,13 @@ export default {
width: 100%;
display: block;
border-bottom: 1px solid #e2e2e2;
margin: 12 * @toVw 0;
margin: 12rem 0;
}
.tip {
padding: 10 * @toVw 20 * @toVw;
padding: 10rem 20rem;
color: #999999;
font-size: 12 * @toVw;
line-height: 23 * @toVw;
font-size: 12rem;
line-height: 23rem;
}
}
@media screen and (orientation: landscape) {
......
src/components/mine/index.vue
View file @ 11946771
......@@ -152,83 +152,83 @@ export default {
.head {
position: relative;
.contentBox {
width: 335 * @toVw;
height: 104 * @toVw;
width: 335rem;
height: 104rem;
background: white;
box-shadow: 0px 1px 6px 0px rgba(64, 169, 255, 0.3);
border-radius: 8 * @toVw;
border-radius: 8rem;
position: absolute;
top: 100 * @toVw;
left: 20 * @toVw;
top: 100rem;
left: 20rem;
display: flex;
.left {
// min-width: 90 * @toVw;
width: 160 * @toVw;
// min-width: 90rem;
width: 160rem;
margin-right: 0;
margin-left: 0 * @toVw;
padding-left: 16 * @toVw;
margin-left: 0rem;
padding-left: 16rem;
box-sizing: border-box;
// margin-left: 26* @toVw;
p {
max-width: 120 * @toVw;
max-width: 120rem;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-size: 20 * @toVw;
margin-left: 0 * @toVw;
line-height: 28 * @toVw;
font-size: 20rem;
margin-left: 0rem;
line-height: 28rem;
text-align: center;
// text-align: left;
}
}
.right {
margin-left: 0 * @toVw;
margin-left: 0rem;
}
}
.bg {
width: 100%;
}
.ref-block {
width: 25 * @toVw;
height: 25 * @toVw;
width: 25rem;
height: 25rem;
position: absolute;
right: 28 * @toVw;
top: 56 * @toVw;
right: 28rem;
top: 56rem;
img {
width: 100%;
}
}
width: 375 * @toVw;
height: 160 * @toVw;
width: 375rem;
height: 160rem;
background-size: 100% 100%;
color: white;
text-align: center;
.header-icon {
width: 84 * @toVw;
height: 84 * @toVw;
width: 84rem;
height: 84rem;
border-radius: 10000px;
border: 3 * @toVw solid white;
border: 3rem solid white;
position: absolute;
top: -40 * @toVw;
left: 30 * @toVw;
top: -40rem;
left: 30rem;
}
.name {
font-size: 20 * @toVw;
font-size: 20rem;
font-family: PingFang-SC-Medium;
font-weight: normal;
line-height: 20 * @toVw;
margin-top: 42 * @toVw;
line-height: 20rem;
margin-top: 42rem;
color: black;
font-weight: 500;
}
.id {
font-size: 14 * @toVw;
font-size: 14rem;
// font-family: PingFang-SC-Medium;
color: #808080;
border-radius: 200px;
line-height: 17 * @toVw;
line-height: 17rem;
background-color: white;
margin-top: 14 * @toVw;
margin-top: 14rem;
text-align: left;
// font-weight: 300;
// padding: 10 20*@toVw 0 ;
......@@ -237,24 +237,24 @@ export default {
.outBox {
background: white;
box-shadow: 0px 1px 6px 0px rgba(64, 169, 255, 0.3);
width: 335 * @toVw;
width: 335rem;
// width: 412px;
border-radius: 8 * @toVw;
margin-top: 62 * @toVw;
border-radius: 8rem;
margin-top: 62rem;
overflow: hidden;
.list {
.van-cell {
font-size: 16 * @toVw;
padding-top: 12 * @toVw;
padding-bottom: 12 * @toVw;
font-size: 16rem;
padding-top: 12rem;
padding-bottom: 12rem;
img {
margin-right: 12 * @toVw;
width: 28 * @toVw;
margin-right: 12rem;
width: 28rem;
// margin:auto 0 ;
height: 28 * @toVw;
height: 28rem;
}
.starNum {
font-size: 13 * @toVw;
font-size: 13rem;
}
}
.van-cell:not(:last-child)::after {
......@@ -265,7 +265,7 @@ export default {
}
@media screen and (orientation: landscape) {
.landscape {
height: 100 * @toVw;
height: 100rem;
}
.mine {
min-height: 100vh;
......
src/components/myGoodsList.vue
View file @ 11946771
......@@ -93,25 +93,25 @@
width: 335* @toVw;
box-shadow:0px 2px 4px 0px rgba(191,191,191,0.5);
border-radius:8*@toVw;
margin-bottom: 10 * @toVw;
margin-bottom: 10rem;
.banner{
width: 100%;
height: 236 * @toVw;
height: 236rem;
border-radius:8*@toVw;
}
.content{
font-size:20 * @toVw;
font-size:20rem;
font-family:PingFang-SC-Medium;
font-weight:normal;
color:rgba(51,51,51,1);
padding: 8 * @toVw;
line-height:28 * @toVw;
padding: 8rem;
line-height:28rem;
.start-time{
font-size:12 * @toVw;
font-size:12rem;
font-family:PingFang-SC-Medium;
font-weight:normal;
color:rgba(51,51,51,1);
line-height:17 * @toVw;
line-height:17rem;
}
}
}
......
src/components/newLesson/audio.vue
View file @ 11946771
......@@ -681,7 +681,7 @@
img{
width: 188*@toVw;
height: 188*@toVw;
border-radius: 999 * @toVw;
border-radius: 999rem;
}
}
.title-block{
......@@ -705,7 +705,7 @@
}
}
.range-block{
width: 250 * @toVw;
width: 250rem;
margin-top: 10*@toVw;
.time-block{
font-size:12*@toVw;
......@@ -864,7 +864,7 @@
}
.parent-finish{
// position: absolute;
// bottom: 0 * @toVw;
// bottom: 0rem;
width: 100%;
left: 0;
top: 430*@toVw;
......@@ -947,7 +947,7 @@
border:4px solid rgba(255,255,255,1);
img{
width: 100%;
border-radius: 999 * @toVw;
border-radius: 999rem;
}
}
.title-block{
......
src/components/newLesson/shareGoods.vue
View file @ 11946771
......@@ -266,18 +266,18 @@ export default {
@import "../../util/public";
@-webkit-keyframes spin {
from {
-webkit-transform: translateY(-3 * @toVw);
-webkit-transform: translateY(-3rem);
}
to {
-webkit-transform: translateY(3 * @toVw);
-webkit-transform: translateY(3rem);
}
}
@keyframes spin {
from {
transform: translateY(-3 * @toVw);
transform: translateY(-3rem);
}
to {
transform: translateY(3 * @toVw);
transform: translateY(3rem);
}
}
.move {
......@@ -303,11 +303,11 @@ export default {
position: relative;
.textBox {
position: absolute;
top: 340 * @toVw;
top: 340rem;
left: 0;
text-align: center;
color: #b75b3a;
font-size: 15 * @toVw;
font-size: 15rem;
width: 100%;
div {
color: #55343a;
......@@ -320,14 +320,14 @@ export default {
color: #55343a;
}
.top {
font-size: 17 * @toVw;
font-size: 17rem;
}
.btn {
font-size: 15 * @toVw;
font-size: 15rem;
}
}
.yearclass {
top: 350 * @toVw;
top: 350rem;
div{color: #b75b3a;}
.oldprice {
text-decoration: line-through;
......@@ -336,79 +336,79 @@ export default {
}
.iknow {
position: absolute;
top: 415 * @toVw;
width: 265 * @toVw;
top: 415rem;
width: 265rem;
// height: 44*@toVw;
left: 58 * @toVw;
left: 58rem;
-webkit-animation: myfirst 3s linear infinite;
}
.head {
position: absolute;
width: 60 * @toVw;
height: 60 * @toVw;
top: 42 * @toVw;
left: 159 * @toVw;
border-radius: 100 * @toVw;
width: 60rem;
height: 60rem;
top: 42rem;
left: 159rem;
border-radius: 100rem;
}
.tip2 {
position: absolute;
width: 350 * @toVw;
width: 350rem;
color: #55343a;
font-size: 15 * @toVw;
font-size: 15rem;
text-align: center;
top: 110 * @toVw;
left: 13 * @toVw;
top: 110rem;
left: 13rem;
}
.title {
position: absolute;
width: 225 * @toVw;
height: 54 * @toVw;
width: 225rem;
height: 54rem;
background-size: 100% 100%;
top: 175 * @toVw;
left: 75 * @toVw;
top: 175rem;
left: 75rem;
text-align: center;
color: white;
font-size: 20 * @toVw;
line-height: 48 * @toVw;
font-size: 20rem;
line-height: 48rem;
}
.day {
position: absolute;
top: 172 * @toVw;
top: 172rem;
width: 100%;
text-align: center;
color: white;
font-size: 54 * @toVw;
font-size: 54rem;
font-family: PingFangSC-Semibold;
font-weight: bold;
p {
font-size: 20 * @toVw;
font-size: 20rem;
font-family: PingFangSC-Semibold;
// font-weight:bold;
line-height: 6 * @toVw;
line-height: 6rem;
font-weight: 300;
color: white;
}
}
.Fml {
position: absolute;
top: 284 * @toVw;
left: 106 * @toVw;
font-size: 15 * @toVw;
top: 284rem;
left: 106rem;
font-size: 15rem;
color: #55343a;
text-align: center;
p {
line-height: 36 * @toVw;
line-height: 36rem;
color: #55343a;
}
div {
}
.line {
width: 95%;
height: 4 * @toVw;
height: 4rem;
background: #f6c9a2;
opacity: 0.44;
position: relative;
top: -5 * @toVw;
top: -5rem;
}
span {
color: #e17640;
......@@ -416,36 +416,36 @@ export default {
}
.nav {
position: absolute;
top: 512 * @toVw;
left: 108 * @toVw;
top: 512rem;
left: 108rem;
z-index: 20;
width: 157 * @toVw;
height: 30 * @toVw;
line-height: 30 * @toVw;
border-radius: 15 * @toVw;
width: 157rem;
height: 30rem;
line-height: 30rem;
border-radius: 15rem;
// background: #F98F55;
text-align: center;
img {
width: 10 * @toVw;
width: 10rem;
}
color: white;
}
}
.good-content {
background: #f4caa2;
padding: 0 15 * @toVw 80 * @toVw 15 * @toVw;
padding: 0 15rem 80rem 15rem;
position: relative;
top: -5 * @toVw;
top: -5rem;
.content {
// background: white;
border-radius: 8 * @toVw;
border-radius: 8rem;
overflow: hidden;
// padding: 10*@toVw;
}
}
.btn-block {
position: fixed;
padding: 10 * @toVw 0;
padding: 10rem 0;
left: 0;
width: 100%;
background: white;
......@@ -453,9 +453,9 @@ export default {
transition: all 0.5s;
bottom: 0;
.lastTime {
top: -30 * @toVw;
height: 30 * @toVw;
line-height: 30 * @toVw;
top: -30rem;
height: 30rem;
line-height: 30rem;
color: #ff785d;
background: #ffe543;
position: absolute;
......@@ -465,25 +465,25 @@ export default {
}
.btnBox {
display: flex;
padding: 0 29 * @toVw;
padding: 0 29rem;
.slg {
background: white;
color: #666666;
border: 1px solid #666666;
box-sizing: border-box;
margin-right: 10 * @toVw;
margin-right: 10rem;
}
}
.btn {
width: 287 * @toVw;
height: 44 * @toVw;
width: 287rem;
height: 44rem;
margin: auto;
background: #ff785d;
border-radius: 100 * @toVw;
border-radius: 100rem;
color: white;
line-height: 44 * @toVw;
line-height: 44rem;
text-align: center;
font-size: 18 * @toVw;
font-size: 18rem;
font-family: PingFang-SC-Medium;
font-weight: 500;
}
......
src/components/newLesson/video.vue
View file @ 11946771
......@@ -459,7 +459,7 @@
}
.parent-finish{
position: fixed;
bottom: 2 * @toVw;
bottom: 2rem;
width: 100%;
left: 0;
top: 500*@toVw;
......
src/components/order.vue
View file @ 11946771
......@@ -186,7 +186,7 @@
z-index: 2002;
}
.tips{
padding: 20 * @toVw;
padding: 20rem;
font-size: 24px;
text-align: center;
color: #888888;
......@@ -199,8 +199,8 @@
.bg-img{
width: 108*@toVw;
height:108*@toVw ;
margin-right: 15 * @toVw;
margin-left: 0 * @toVw;
margin-right: 15rem;
margin-left: 0rem;
background-size:100% 100%;
}
.head{
......@@ -235,7 +235,7 @@
img{
width: 13 *@toVw;
display: inline-block;
margin-right: 3 * @toVw;
margin-right: 3rem;
vertical-align: text-bottom;
}
}
......@@ -255,7 +255,7 @@
margin-right: 10px;
padding: 6px 12px;
color: #999;
font-size: 12 * @toVw;
font-size: 12rem;
border: 1px solid #ccc;
border-top: none;
border-bottom-left-radius: 9px;
......@@ -263,7 +263,7 @@
box-shadow: 0px 2px 1px 0px rgba(0,0,0,0.1);
span{
margin: 0;
line-height: 20 * @toVw;
line-height: 20rem;
}
.red{
......
src/components/orderTrans/index.vue
View file @ 11946771
......@@ -212,7 +212,7 @@
.bgblock{
background: white;
border-radius:20*@toVw;
padding: 20 * @toVw 34 * @toVw 30 * @toVw;
padding: 20rem 34rem 30rem;
}
.tip{font-size: 11*@toVw;color: #FF7875;position: relative;top: -5* @toVw;font-weight: bold;}
.title{text-align: center;font-size: 21*@toVw;margin: 16* @toVw 0 20* @toVw;}
......@@ -220,7 +220,7 @@
width: 249*@toVw;height: 45*@toVw;
line-height:45*@toVw;
border-bottom: 1*@toVw solid #FFCFCD;
margin-bottom: 8 * @toVw;
margin-bottom: 8rem;
position: relative;
.yzm{
border: 1px solid #FFCA68;
......@@ -242,7 +242,7 @@
font-size: 12*@toVw;
}
input{
padding: 9 * @toVw 0;
padding: 9rem 0;
font-size:16*@toVw;
background: transparent;
// font-family:PingFangSC-Semibold;
......@@ -298,7 +298,7 @@
left: 0;
right: 0;
bottom: 0;
width: 375 * @toVw;
width: 375rem;
}
@media screen and (min-width: 600px) {
@toVw:100/520vw;
......@@ -316,7 +316,7 @@
.bgblock{
background: white;
border-radius:20*@toVw;
padding: 20 * @toVw 34 * @toVw 30 * @toVw;
padding: 20rem 34rem 30rem;
}
.tip{font-size: 11*@toVw;color: #FF7875;position: relative;top: -5* @toVw;font-weight: bold;}
.title{text-align: center;font-size: 21*@toVw;margin: 16* @toVw 0 20* @toVw;}
......@@ -324,7 +324,7 @@
width: 249*@toVw;height: 45*@toVw;
line-height:45*@toVw;
border-bottom: 1*@toVw solid #FFCFCD;
margin-bottom: 8 * @toVw;
margin-bottom: 8rem;
position: relative;
.yzm{
border: 1px solid #FFCA68;
......@@ -346,7 +346,7 @@
font-size: 12*@toVw;
}
input{
padding: 9 * @toVw 0;
padding: 9rem 0;
font-size:16*@toVw;
background: transparent;
// font-family:PingFangSC-Semibold;
......
src/components/public/audioPlay.vue
View file @ 11946771
......@@ -227,16 +227,16 @@
-webkit-appearance: none;
display: flex;
width: 90%;
padding: 0 5 * @toVw;
padding: 0 5rem;
border-radius: 10px; /*这个属性设置使填充进度条时的图形为圆角*/
}
input[type=range]::-webkit-slider-thumb {
-webkit-appearance: none;
}
input[type=range]::-webkit-slider-runnable-track {
height: 2 * @toVw;
height: 2rem;
background: #999999;
border-radius: 1 * @toVw ;
border-radius: 1rem ;
}
input[type=range]:focus {
outline: none;
......@@ -244,16 +244,16 @@
input[type=range]::-webkit-slider-thumb {
-webkit-appearance: none;
border-radius: 50%; /*外观设置为圆形*/
height: 15 * @toVw;
width: 15 * @toVw;
margin-top: -6 * @toVw; /*使滑块超出轨道部分的偏移量相等*/
height: 15rem;
width: 15rem;
margin-top: -6rem; /*使滑块超出轨道部分的偏移量相等*/
background: #ffffff;
border: solid 1* @toVw rgba(205, 224, 230, 0.5); /*设置边框*/
box-shadow: 0 0 2 * @toVw #3b4547; /*添加底部阴影*/
box-shadow: 0 0 2rem #3b4547; /*添加底部阴影*/
}
.audioOff {
padding: 5 * @toVw;
padding: 5rem;
display: flex;
justify-content: center;
align-items: center;
......@@ -264,18 +264,18 @@
.ofplayBox {
width: 100%;
height: 30 * @toVw;
height: 30rem;
margin: 0;
display: flex;
}
.isPlayImg {
width: 40 * @toVw;
width: 40rem;
height: 100%;
}
.isPlayImg img {
width: 30 * @toVw;
width: 30rem;
}
.progress {
......@@ -287,7 +287,7 @@
.duration {
display: flex;
font-size: 12px;
margin-left: 5 * @toVw;
margin-left: 5rem;
justify-content: space-between;
span:first-child{
margin-left: 0;
......@@ -299,7 +299,7 @@
@media screen and (orientation: landscape) {
.audioOff {
padding: 2 * @toVw;
padding: 2rem;
display: flex;
justify-content: center;
align-items: center;
......@@ -311,16 +311,16 @@
-webkit-appearance: none;
display: flex;
width: 90%;
padding: 0 5 * @toVw;
padding: 0 5rem;
border-radius: 10px; /*这个属性设置使填充进度条时的图形为圆角*/
}
input[type=range]::-webkit-slider-thumb {
-webkit-appearance: none;
}
input[type=range]::-webkit-slider-runnable-track {
height: 2 * @toVw;
height: 2rem;
background: #999999;
border-radius: 1 * @toVw ;
border-radius: 1rem ;
}
input[type=range]:focus {
outline: none;
......@@ -328,9 +328,9 @@
input[type=range]::-webkit-slider-thumb {
-webkit-appearance: none;
border-radius: 50%; /*外观设置为圆形*/
height: 10 * @toVw;
width: 10 * @toVw;
margin-top: -4 * @toVw; /*使滑块超出轨道部分的偏移量相等*/
height: 10rem;
width: 10rem;
margin-top: -4rem; /*使滑块超出轨道部分的偏移量相等*/
background: #ffffff;
border: solid 1* @toVw rgba(205, 224, 230, 0.5); /*设置边框*/
box-shadow: 0 .125em .125em #3b4547; /*添加底部阴影*/
......@@ -338,19 +338,19 @@
}
.ofplayBox {
width: 100%;
height: 20 * @toVw;
height: 20rem;
margin: 0;
display: flex;
}
.isPlayImg {
width: 24 * @toVw;
margin-right: 5 * @toVw;
width: 24rem;
margin-right: 5rem;
height: 100%;
}
.isPlayImg img {
width: 20 * @toVw;
width: 20rem;
}
.progress {
......@@ -361,7 +361,7 @@
.duration {
display: flex;
font-size: 12px;
margin-left: 5 * @toVw;
margin-left: 5rem;
justify-content: space-between;
span:first-child{
margin-left: 0;
......
src/components/public/bottomTab.vue
View file @ 11946771
......@@ -108,22 +108,22 @@ export default {
<style scoped lang="less">
@import "../../util/public";
.bottom-tab {
width: 375 * @toVw;
height: 48 * @toVw;
width: 375rem;
height: 48rem;
position: fixed;
left: 0;
bottom: 0;
box-shadow: 0px -1px 2px 0px rgba(204, 204, 204, 0.5);
padding: 0 24 * @toVw;
padding: 0 24rem;
box-sizing: border-box;
display: flex;
display: -webkit-flex;
font-size: 10 * @toVw;
font-size: 10rem;
font-family: PingFang-SC-Medium;
text-align: center;
font-weight: normal;
color: #666666;
line-height: 14 * @toVw;
line-height: 14rem;
z-index: 30;
background: white;
& > div {
......@@ -133,40 +133,40 @@ export default {
// border-right: 1px solid #eeeeee;
}
.img {
width: 28 * @toVw;
height: 28 * @toVw;
width: 28rem;
height: 28rem;
overflow: hidden;
position: relative;
img {
width: 28 * @toVw;
width: 28rem;
position: absolute;
left: 0;
}
}
.index {
img {
top: -28 * @toVw;
top: -28rem;
}
}
.map {
img {
top: -56 * @toVw;
top: -56rem;
}
}
.mine {
img {
top: -84 * @toVw;
top: -84rem;
}
}
.actived {
.index {
img {
top: -140 * @toVw;
top: -140rem;
}
}
.map {
img {
top: -112 * @toVw;
top: -112rem;
}
}
.mine {
......@@ -181,20 +181,20 @@ export default {
@toVw: 100/1024vw;
.bottom-tab {
width:100%;
height: 66 * @toVw;
height: 66rem;
position: fixed;
left: 0;
bottom: 0;
box-shadow: 0px -1px 2px 0px rgba(204, 204, 204, 0.5);
padding: 0 6 * @toVw;
padding: 0 6rem;
display: flex;
display: -webkit-flex;
font-size: 10 * @toVw;
font-size: 10rem;
font-family: PingFang-SC-Medium;
text-align: center;
font-weight: normal;
color: #ccc;
line-height: 14 * @toVw;
line-height: 14rem;
z-index: 30;
background: white;
& > div {
......@@ -204,40 +204,40 @@ export default {
color: #6eb1ff;
}
.img {
width: 30 * @toVw;
height: 30 * @toVw;
width: 30rem;
height: 30rem;
overflow: hidden;
position: relative;
img {
width: 30 * @toVw;
width: 30rem;
position: absolute;
left: 0;
}
}
.index {
img {
top: -30 * @toVw;
top: -30rem;
}
}
.map {
img {
top: -60 * @toVw;
top: -60rem;
}
}
.mine {
img {
top: -91 * @toVw;
top: -91rem;
}
}
.actived {
.index {
img {
top: -151 * @toVw;
top: -151rem;
}
}
.map {
img {
top: -119 * @toVw;
top: -119rem;
}
}
.mine {
......
src/components/share.vue
View file @ 11946771
......@@ -30,24 +30,24 @@
background-size: 100% 100%;
.tips{
position: absolute;
top: 8 * @toVw;
height: 66 * @toVw;
top: 8rem;
height: 66rem;
z-index: 0;
right: 31 * @toVw;
right: 31rem;
}
.content{
width: 313 * @toVw;
height: 524 * @toVw;
width: 313rem;
height: 524rem;
background-size: 100% 100%;
position: relative;
z-index: 2;
margin:53 * @toVw auto 0 auto;
margin:53rem auto 0 auto;
.head{
border-radius: 1000px;
width: 32 * @toVw;
width: 32rem;
position: absolute;
top: 257 * @toVw;
left: 40 * @toVw;
top: 257rem;
left: 40rem;
}
.name{
width:70px;
......@@ -58,8 +58,8 @@
color:rgba(51,51,51,1);
line-height:20px;
position: absolute;
top: 257 * @toVw;
left: 84 * @toVw;
top: 257rem;
left: 84rem;
}
.day{
font-size:20px;
......@@ -68,8 +68,8 @@
color:rgba(51,51,51,1);
line-height:28px;
position: absolute;
top: 334 * @toVw;
right:243 * @toVw;
top: 334rem;
right:243rem;
}
.num{
font-size:20px;
......@@ -78,8 +78,8 @@
color:rgba(51,51,51,1);
line-height:28px;
position: absolute;
top: 334 * @toVw;
right: 167 * @toVw;
top: 334rem;
right: 167rem;
}
.time{
font-size:20px;
......@@ -88,8 +88,8 @@
color:rgba(51,51,51,1);
line-height:28px;
position: absolute;
top: 334 * @toVw;
right: 63 * @toVw;
top: 334rem;
right: 63rem;
}
}
}
......
src/components/star/detail.vue
View file @ 11946771
......@@ -130,8 +130,8 @@ export default {
width: 100%;
background: white;
z-index: 100;
// padding-bottom: 10 * @toVw;
padding: 10 * @toVw 20 * @toVw ;
// padding-bottom: 10rem;
padding: 10rem 20rem ;
margin-bottom: 8* @toVw;
border-bottom: 1px solid #E2E2E2;
.top{
......@@ -139,12 +139,12 @@ export default {
span{line-height: 28* @toVw ;margin: 0;}
}
.count{
font-size: 18 * @toVw;
font-size: 18rem;
color: #f27321;
font-weight: 800;
}
.date{
font-size: 12 * @toVw;
font-size: 12rem;
color: #999999;
}
}
......@@ -152,18 +152,18 @@ export default {
.secTitle {
text-align: center;
color: #999999;
font-size: 13 * @toVw;
font-size: 13rem;
.line {
display: inline-block;
width: 120 * @toVw;
width: 120rem;
border-bottom: 1px solid #e2e2e2;
position: relative;
top: -3 * @toVw;
top: -3rem;
}
}
// .scrollP{position: relative;height: 100vh;width: 100%;transform:none;}
.scroll {
padding: 10 * @toVw 20 * @toVw 0;
padding: 10rem 20rem 0;
// margin-top: 180* @toVw;
height: 100%;
overflow: hidden;
......@@ -172,10 +172,10 @@ export default {
box-sizing: border-box;
background: white;
.itemBox {
padding-top: 65 * @toVw;
padding-top: 65rem;
.none {
height: 53 * @toVw;
line-height: 40 * @toVw;
height: 53rem;
line-height: 40rem;
text-align: center;
color: #999999;
font-size: 12px;
......@@ -185,30 +185,30 @@ export default {
display: -webkit-flex;
justify-content: space-between;
border-bottom: 1px solid #e2e2e2;
padding: 9 * @toVw 2 * @toVw;
padding: 9rem 2rem;
div {
flex: 1;
}
.left {
font-size: 15 * @toVw;
font-size: 15rem;
// font-family: Regular;
.date {
color: #999999;
font-size: 13 * @toVw;
margin-top: 4 * @toVw;
font-size: 13rem;
margin-top: 4rem;
}
}
.right {
text-align: right;
font-size: 18 * @toVw;
font-size: 18rem;
color: #f27321;
font-weight: 800;
// font-family: Arial-Black;
img {
width: 20 * @toVw;
width: 20rem;
position: relative;
top: 3 * @toVw;
margin-left: 3 * @toVw;
top: 3rem;
margin-left: 3rem;
}
span {
}
......@@ -227,12 +227,12 @@ export default {
width: 100%;
background: white;
z-index: 100;
padding-bottom: 10 * @toVw;
padding-bottom: 10rem;
}
// .child-view{height: 200vh;}
.scroll{position: relative;
height: 50vh;
.itemBox{padding-top: 0 * @toVw;padding-bottom: 10vh;}
.itemBox{padding-top: 0rem;padding-bottom: 10vh;}
}
}
</style>
......
src/components/star/result.vue
View file @ 11946771
......@@ -85,7 +85,7 @@ export default {
border-top: 1px solid transparent;
}
.page {
padding: 10 * @toVw;
padding: 10rem;
box-sizing: border-box;
}
.result {
......@@ -93,32 +93,32 @@ export default {
text-align: center;
background: url("https://cdn.singsingenglish.com/new-sing/number_img_bg_win@2x.png");
background-size: 100% 100%;
padding: 39 * @toVw 13 * @toVw 12 * @toVw;
box-shadow: 0px 1 * @toVw 8 * @toVw 0 * @toVw rgba(175, 175, 175, 0.53);
border-radius: 8 * @toVw;
margin-bottom: 10 * @toVw;
padding: 39rem 13rem 12rem;
box-shadow: 0px 1rem 8rem 0rem rgba(175, 175, 175, 0.53);
border-radius: 8rem;
margin-bottom: 10rem;
background-color: #fff9f2;
.float {
width: 74 * @toVw;
height: 27 * @toVw;
width: 74rem;
height: 27rem;
background: linear-gradient(
270deg,
rgba(255, 227, 126, 1) 0%,
rgba(255, 167, 114, 1) 100%
);
border-radius: 0 8 * @toVw 0 8 * @toVw;
border-radius: 0 8rem 0 8rem;
color: white;
line-height: 27 * @toVw;
line-height: 27rem;
position: absolute;
top: 0;
right: 0;
font-size: 13 * @toVw;
font-size: 13rem;
}
.imgbox {
margin-top: 8 * @toVw;
margin-top: 8rem;
img {
width: 111 * @toVw;
margin: 0 12 * @toVw;
width: 111rem;
margin: 0 12rem;
}
}
.addr {
......@@ -127,56 +127,56 @@ export default {
rgba(252, 171, 69, 1) 0%,
rgba(247, 115, 33, 1) 100%
);
border-radius: 12 * @toVw;
height: 24 * @toVw;
line-height: 24 * @toVw;
text-indent: 10 * @toVw;
border-radius: 12rem;
height: 24rem;
line-height: 24rem;
text-indent: 10rem;
color: white;
font-size: 13 * @toVw;
margin: 15 * @toVw 0;
font-size: 13rem;
margin: 15rem 0;
text-align: left;
display: flex;
span {
max-width: 296 * @toVw;
max-width: 296rem;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
i {
margin-left: -6 * @toVw;
width: 20 * @toVw;
font-size: 12 * @toVw;
margin-left: -6rem;
width: 20rem;
font-size: 12rem;
}
}
.tip {
color: #937148;
font-size: 12 * @toVw;
font-size: 12rem;
text-align: left;
}
h2 {
color: #d33500;
margin: 0 0 8 * @toVw;
margin: 0 0 8rem;
}
p {
color: #f65c28;
}
}
.fal {
padding: 39 * @toVw 0 12 * @toVw;
height: 189 * @toVw;
padding: 39rem 0 12rem;
height: 189rem;
background: url("https://cdn.singsingenglish.com/new-sing/number_img_bg_lose@2x.png");
background-size: 100% 100%;
box-sizing: border-box;
.fal_title {
color: #2a455a;
font-size: 24 * @toVw;
font-size: 24rem;
font-weight: bold;
}
.fal_tip {
color: #f65c28;
font-size: 13 * @toVw;
margin-top: 10 * @toVw;
font-size: 13rem;
margin-top: 10rem;
}
}
......
src/components/star/starRank.vue
View file @ 11946771
......@@ -392,13 +392,13 @@ export default {
width: 100%;
background: white;
z-index: 100;
// padding-bottom: 10 * @toVw;
// padding-bottom: 10rem;
}
.scrollItem {
height: 100vh;
}
.head {
height: 147 * @toVw;
height: 147rem;
.bg {
width: 100%;
position: absolute;
......@@ -409,33 +409,33 @@ export default {
.text {
text-align: center;
color: #f27321;
padding-top: 52 * @toVw;
padding-top: 52rem;
.count {
font-size: 41 * @toVw;
line-height: 42 * @toVw;
margin-bottom: 10 * @toVw;
font-size: 41rem;
line-height: 42rem;
margin-bottom: 10rem;
}
}
.avatar {
position: absolute;
top: 20 * @toVw;
left: 22 * @toVw;
top: 20rem;
left: 22rem;
display: flex;
height: 42 * @toVw;
height: 42rem;
// vertical-align: top;
img {
width: 40 * @toVw;
border-radius: 40 * @toVw;
width: 40rem;
border-radius: 40rem;
border: 2px solid white;
}
span {
text-overflow: ellipsis;
white-space: nowrap;
overflow: hidden;
width: 98 * @toVw;
width: 98rem;
display: inline-block;
margin-left: 8 * @toVw;
font-size: 14 * @toVw;
margin-left: 8rem;
font-size: 14rem;
color: #999999;
}
}
......@@ -444,31 +444,31 @@ export default {
.secTitle {
text-align: center;
color: #999999;
font-size: 13 * @toVw;
font-size: 13rem;
display: flex;
.line {
display: inline-block;
width: 120 * @toVw;
width: 120rem;
border-bottom: 1px solid #e2e2e2;
position: relative;
top: -3 * @toVw;
top: -3rem;
}
.item {
flex: 1;
height: 64 * @toVw;
line-height: 74 * @toVw;
height: 64rem;
line-height: 74rem;
.activity {
display: inline-block;
width: 86 * @toVw;
height: 35 * @toVw;
line-height: 35 * @toVw;
width: 86rem;
height: 35rem;
line-height: 35rem;
position: relative;
text-shadow: 0px 1px 1px rgba(187, 82, 0, 1);
color: white;
font-size: 15 * @toVw;
font-size: 15rem;
animation: slideOut 1s linear;
img {
width: 86 * @toVw;
width: 86rem;
position: absolute;
top: 0;
left: 0;
......@@ -494,7 +494,7 @@ export default {
}
}
.anActivity {
margin-top: 24 * @toVw;
margin-top: 24rem;
}
// .scrollP{position: relative;height: 100vh;width: 100%;transform:none;}
.scroll {
......@@ -507,130 +507,130 @@ export default {
box-sizing: border-box;
background: white;
.itemBox {
padding-top: 210 * @toVw;
padding-top: 210rem;
width: 86%;
margin: 0 auto;
.none {
height: 53 * @toVw;
line-height: 40 * @toVw;
height: 53rem;
line-height: 40rem;
text-align: center;
color: #999999;
font-size: 12px;
}
}
.container {
padding-top: 210 * @toVw;
padding-top: 210rem;
.unStart {
text-align: center;
color: #f27321;
font-size: 13 * @toVw;
font-size: 13rem;
// top: 50%;
transform: translateY(-70%);
position: absolute;
width: 96%;
text-align: center;
p {
margin-top: 10 * @toVw;
margin-top: 10rem;
}
img {
width: 110 * @toVw;
width: 110rem;
}
}
.stageBox {
width: 92%;
margin: 0 auto;
margin-top: 6 * @toVw;
padding-bottom: 20 * @toVw;
margin-top: 6rem;
padding-bottom: 20rem;
.stageitem {
display: flex;
box-shadow: 0px 1px 8px 0px rgba(175, 175, 175, 0.53);
height: 114 * @toVw;
margin-bottom: 10 * @toVw;
border-radius: 8 * @toVw;
height: 114rem;
margin-bottom: 10rem;
border-radius: 8rem;
.left {
width: 103 * @toVw;
width: 103rem;
margin-bottom: 0;
margin-right: 20 * @toVw;
margin-right: 20rem;
}
.right {
flex: 1;
position: relative;
margin-top: 0;
.title {
font-size: 15 * @toVw;
font-size: 15rem;
font-weight: bold;
margin: 15 * @toVw 0 10 * @toVw;
margin: 15rem 0 10rem;
}
.date {
color: #999999;
font-size: 13 * @toVw;
font-size: 13rem;
}
.count {
color: #f27321;
font-size: 18 * @toVw;
font-size: 18rem;
font-weight: 800;
margin-top: 20 * @toVw;
margin-top: 20rem;
img {
width: 20 * @toVw;
width: 20rem;
position: relative;
top: 2 * @toVw;
top: 2rem;
}
}
.tip {
position: absolute;
top: 0;
right: 0;
width: 80 * @toVw;
height: 27 * @toVw;
line-height: 27 * @toVw;
width: 80rem;
height: 27rem;
line-height: 27rem;
text-align: center;
background: linear-gradient(
270deg,
rgba(255, 227, 126, 1) 0%,
rgba(255, 165, 114, 1) 100%
);
border-radius: 0px 8 * @toVw 0px 8 * @toVw;
border-radius: 0px 8rem 0px 8rem;
color: white;
font-size: 13 * @toVw;
font-size: 13rem;
}
}
}
.rule {
color: #999999;
font-size: 13 * @toVw;
line-height: 20 * @toVw;
font-size: 13rem;
line-height: 20rem;
}
.result {
position: relative;
text-align: center;
background: url("https://cdn.singsingenglish.com/new-sing/number_img_bg_win@2x.png");
background-size: 100% 100%;
padding: 39 * @toVw 13 * @toVw 12 * @toVw;
box-shadow: 0px 1 * @toVw 8 * @toVw 0 * @toVw rgba(175, 175, 175, 0.53);
border-radius: 8 * @toVw;
margin-bottom: 10 * @toVw;
padding: 39rem 13rem 12rem;
box-shadow: 0px 1rem 8rem 0rem rgba(175, 175, 175, 0.53);
border-radius: 8rem;
margin-bottom: 10rem;
background-color: #fff9f2;
.float {
width: 74 * @toVw;
height: 27 * @toVw;
width: 74rem;
height: 27rem;
background: linear-gradient(
270deg,
rgba(255, 227, 126, 1) 0%,
rgba(255, 167, 114, 1) 100%
);
border-radius: 0 8 * @toVw 0 8 * @toVw;
border-radius: 0 8rem 0 8rem;
color: white;
line-height: 27 * @toVw;
line-height: 27rem;
position: absolute;
top: 0;
right: 0;
font-size: 13 * @toVw;
font-size: 13rem;
}
.imgbox {
margin-top: 8 * @toVw;
margin-top: 8rem;
img {
width: 111 * @toVw;
margin: 0 12 * @toVw;
width: 111rem;
margin: 0 12rem;
}
}
.addr {
......@@ -639,73 +639,73 @@ export default {
rgba(252, 171, 69, 1) 0%,
rgba(247, 115, 33, 1) 100%
);
border-radius: 12 * @toVw;
height: 24 * @toVw;
line-height: 24 * @toVw;
text-indent: 10 * @toVw;
border-radius: 12rem;
height: 24rem;
line-height: 24rem;
text-indent: 10rem;
color: white;
font-size: 13 * @toVw;
margin: 15 * @toVw 0;
font-size: 13rem;
margin: 15rem 0;
text-align: left;
display: flex;
span {
max-width: 296 * @toVw;
max-width: 296rem;
display: inline-block;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
i {
margin-left: -6 * @toVw;
width: 20 * @toVw;
font-size: 12 * @toVw;
margin-left: -6rem;
width: 20rem;
font-size: 12rem;
}
}
.tip {
color: #937148;
font-size: 12 * @toVw;
font-size: 12rem;
text-align: left;
}
h2 {
color: #d33500;
margin: 0 0 8 * @toVw;
margin: 0 0 8rem;
}
p {
color: #f65c28;
font-size: 13 * @toVw;
font-size: 13rem;
}
}
.fal {
padding: 39 * @toVw 0 12 * @toVw;
height: 189 * @toVw;
padding: 39rem 0 12rem;
height: 189rem;
background: url("https://cdn.singsingenglish.com/new-sing/number_img_bg_lose@2x.png");
background-size: 100% 100%;
box-sizing: border-box;
.fal_title {
color: #2a455a;
font-size: 24 * @toVw;
font-size: 24rem;
font-weight: bold;
}
.fal_tip {
color: #f65c28;
font-size: 13 * @toVw;
margin-top: 10 * @toVw;
font-size: 13rem;
margin-top: 10rem;
}
}
.showRs {
width: 134 * @toVw;
height: 36 * @toVw;
width: 134rem;
height: 36rem;
background: linear-gradient(
270deg,
rgba(255, 228, 127, 1) 0%,
rgba(255, 166, 115, 1) 100%
);
box-shadow: 0px 1px 8px 0px rgba(255, 203, 157, 0.58);
border-radius: 18 * @toVw;
border-radius: 18rem;
color: white;
text-align: center;
line-height: 36 * @toVw;
margin-top: 20 * @toVw;
line-height: 36rem;
margin-top: 20rem;
}
}
}
......@@ -713,30 +713,30 @@ export default {
display: -webkit-flex;
justify-content: space-between;
border-bottom: 1px solid #e2e2e2;
padding: 9 * @toVw 2 * @toVw;
padding: 9rem 2rem;
div {
flex: 1;
}
.left {
font-size: 15 * @toVw;
font-size: 15rem;
// font-family: Regular;
.date {
color: #999999;
font-size: 13 * @toVw;
margin-top: 4 * @toVw;
font-size: 13rem;
margin-top: 4rem;
}
}
.right {
text-align: right;
font-size: 18 * @toVw;
font-size: 18rem;
color: #f27321;
font-weight: 800;
// font-family: Arial-Black;
img {
width: 20 * @toVw;
width: 20rem;
position: relative;
top: 3 * @toVw;
margin-left: 3 * @toVw;
top: 3rem;
margin-left: 3rem;
}
span {
}
......@@ -758,14 +758,14 @@ export default {
width: 100%;
background: white;
z-index: 100;
padding-bottom: 10 * @toVw;
padding-bottom: 10rem;
}
// .child-view{height: 200vh;}
.scroll {
position: relative;
height: 50vh;
.itemBox {
padding-top: 0 * @toVw;
padding-top: 0rem;
padding-bottom: 10vh;
}
}
......
src/main.js
View file @ 11946771
......@@ -4,7 +4,7 @@ import Vue from 'vue'
import App from './App'
import router from './router'
import store from './store'
// import MintUI from 'mint-ui'
import MintUI from 'mint-ui'
// import {popup} from 'mint-ui'
import VueClipboard from 'vue-clipboard2'
import sa from 'sa-sdk-javascript';
......@@ -27,7 +27,7 @@ Vue.prototype.$sa.init({
is_track_single_page: true
});
Vue.prototype.$sa.quick('autoTrack')
// Vue.use(MintUI);
Vue.use(MintUI);
Vue.use(VueClipboard);
// Vue.use(Vant);
Vue.use(Popup).use(Lazyload).use(Button).use(Dialog).use(Toast);
......@@ -41,9 +41,9 @@ Vue.component('scroll', scroll);
// Vue.prototype.$throw = (error)=> errorHandler(error,this);
/* eslint-disable no-new */
// if(process.env.NODE_ENV != 'production'){
// var vConsole = new VConsole();
// }
if(process.env.NODE_ENV != 'production'){
var vConsole = new VConsole();
}
router.beforeEach((to, from, next) => {
next()
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment