fe / YOHOBUYWAP · Commits

Go to a project

Authored by 王水玲
Commit 4f8709bf397a1c1fe7855a1cdc6ea0a19da54ce3 1 parent 4df32f53

sass合并

Inline Side-by-side
Showing 3 changed files with 299 additions and 296 deletions
... ... @@ -53,15 +53,15 @@
.head-tab {
width: 100%;
height: 88rem / $pxConvertRem;
height: 88px;
background: #000;
li {
width: 33.3%;
text-align: center;
float: left;
line-height: 88rem / $pxConvertRem;
font-size: 30rem / $pxConvertRem;
line-height: 88px;
font-size: 30px;
a {
color: #b0b0b0;
... ... @@ -76,24 +76,24 @@
.banner-top {
width: 100%;
height: 310rem / $pxConvertRem;
margin-top: 30rem / $pxConvertRem;
height: 310px;
margin-top: 30px;
position: relative;
.banner-swiper {
width: 100%;
height: 310rem / $pxConvertRem;
height: 310px;
overflow: hidden;
position: relative;
ul {
position: relative;
height: 310rem / $pxConvertRem;
height: 310px;
li {
float: left;
width: 100%;
height: 310rem / $pxConvertRem;
height: 310px;
img {
width: 100%;
... ... @@ -107,7 +107,7 @@
position: absolute;
left: 0;
right: 0;
bottom: 20rem / $pxConvertRem;
bottom: 20px;
text-align: center;
z-index: 1;
... ... @@ -116,11 +116,11 @@
span {
display: inline-block;
width: 14rem / $pxConvertRem;
height: 14rem / $pxConvertRem;
width: 14px;
height: 14px;
background: #fff;
opacity: 0.5;
margin: 0 10rem / $pxConvertRem;
margin: 0 10px;
border-radius: 50%;
&.swiper-pagination-bullet-active {
... ... @@ -134,78 +134,78 @@
.home-floor-sign {
width: 100%;
height: 220rem / $pxConvertRem;
margin-top: 30rem / $pxConvertRem;
height: 220px;
margin-top: 30px;
background: #000;
.nav-left {
width: 102rem / $pxConvertRem;
margin: 30rem / $pxConvertRem 0 0 30rem / $pxConvertRem;
width: 102px;
margin: 30px 0 0 30px;
text-align: center;
float: left;
.user-name {
font-size: 24rem / $pxConvertRem;
font-size: 24px;
color: #fff;
margin-top: 30rem / $pxConvertRem;
margin-top: 30px;
white-space: nowrap;
}
}
.nav-main {
width: 252rem / $pxConvertRem;
height: 90rem / $pxConvertRem;
width: 252px;
height: 90px;
float: left;
background-image: image-url("guang/star-classroom/user_info_bg.png");
background-image: resolve("guang/star-classroom/user_info_bg.png");
background-repeat: no-repeat;
background-size: contain;
margin:36rem / $pxConvertRem 0 0 10rem / $pxConvertRem;
margin:36px 0 0 10px;
p {
color: #fff;
line-height: 46rem / $pxConvertRem;
font-size: 24rem / $pxConvertRem;
margin-left: 30rem / $pxConvertRem;
line-height: 46px;
font-size: 24px;
margin-left: 30px;
white-space: nowrap;
}
}
.nav-right {
width: 195rem / $pxConvertRem;
width: 195px;
text-align: center;
float: right;
.wyf-img {
width: 119rem / $pxConvertRem;
height: 108rem / $pxConvertRem;
margin-top: 30rem / $pxConvertRem;
background-image: image-url("guang/star-classroom/home-wyf.png");
width: 119px;
height: 108px;
margin-top: 30px;
background-image: resolve("guang/star-classroom/home-wyf.png");
background-repeat: no-repeat;
background-size: contain;
display: inline-block;
}
.add-intimacy {
width: 131rem / $pxConvertRem;
height: 52rem / $pxConvertRem;
background-image: image-url("guang/star-classroom/add_intimacy_bg.png");
width: 131px;
height: 52px;
background-image: resolve("guang/star-classroom/add_intimacy_bg.png");
background-repeat: no-repeat;
background-size: contain;
color: #fff;
font-size: 22rem / $pxConvertRem;
font-size: 22px;
display: inline-block;
white-space: nowrap;
line-height: 66rem / $pxConvertRem;
margin-left: 12rem / $pxConvertRem;
line-height: 66px;
margin-left: 12px;
}
}
.user-head {
width: 100rem / $pxConvertRem;
height: 100rem / $pxConvertRem;
width: 100px;
height: 100px;
border-radius: 50%;
border: 2rem / $pxConvertRem solid #e0e0e0;
background-image: image-url("me/index/user-avatar.png");
border: 2px solid #e0e0e0;
background-image: resolve("me/index/user-avatar.png");
background-repeat: no-repeat;
background-size: contain;
display: block;
... ... @@ -214,64 +214,64 @@
.floor-header-more {
width: 100%;
height: 88rem / $pxConvertRem;
height: 88px;
background: #000;
position: relative;
margin-top: 30rem / $pxConvertRem;
margin-top: 30px;
border-top: 1px solid #000;
h2 {
color: #fff;
font-size: 34rem / $pxConvertRem;
line-height: 88rem / $pxConvertRem;
font-size: 34px;
line-height: 88px;
text-align: center;
}
.more-btn {
width: 64rem / $pxConvertRem;
height: 96rem / $pxConvertRem;
line-height: 86rem / $pxConvertRem;
width: 64px;
height: 96px;
line-height: 86px;
position: absolute;
right: 20rem / $pxConvertRem;
right: 20px;
top: 0;
color: #b0b0b0;
font-size: 50rem / $pxConvertRem;
font-size: 50px;
}
}
.home-floor-subject {
.subject-banner {
width: 100%;
height: 310rem / $pxConvertRem;
height: 310px;
}
}
.subject-video-area {
width: 100%;
height: 310rem / $pxConvertRem;
margin-top: 30rem / $pxConvertRem;
height: 310px;
margin-top: 30px;
background: #000;
#subject-video {
width: 100%;
height: 310rem / $pxConvertRem;
height: 310px;
}
}
.home-floor-collocation {
background: #000;
padding-bottom: 60rem / $pxConvertRem;
padding-bottom: 60px;
.collocation-big-img {
width: 100%;
height: 277rem / $pxConvertRem;
padding: 0 14rem / $pxConvertRem;
height: 277px;
padding: 0 14px;
box-sizing: border-box;
li {
width: 276rem / $pxConvertRem;
height: 277rem / $pxConvertRem;
margin: 0 15rem / $pxConvertRem;
width: 276px;
height: 277px;
margin: 0 15px;
float: left;
img {
... ... @@ -282,25 +282,25 @@
.collocation-img {
width: 100%;
height: 139rem / $pxConvertRem;
margin-top: 30rem / $pxConvertRem;
height: 139px;
margin-top: 30px;
position: relative;
.collocation-swiper {
width: 100%;
height: 139rem / $pxConvertRem;
height: 139px;
overflow: hidden;
position: relative;
ul {
position: relative;
height: 139rem / $pxConvertRem;
height: 139px;
li {
float: left;
width: 229rem / $pxConvertRem;
height: 139rem / $pxConvertRem;
margin-left: 30rem / $pxConvertRem;
width: 229px;
height: 139px;
margin-left: 30px;
img {
width: 100%;
... ... @@ -313,63 +313,63 @@
}
.pop-intimacy {
width: 580rem / $pxConvertRem;
height: 920rem / $pxConvertRem;
width: 580px;
height: 920px;
background: #fff;
border-radius: 10rem / $pxConvertRem;
border-radius: 10px;
position: fixed;
top:20rem / $pxConvertRem;
left: 30rem / $pxConvertRem;
top:20px;
left: 30px;
z-index: 10;
display: none;
.intimacy-head {
text-align: center;
color: #444;
height: 140rem / $pxConvertRem;
padding-top: 20rem / $pxConvertRem;
height: 140px;
padding-top: 20px;
box-sizing: border-box;
position: relative;
.pop-close {
width: 25rem / $pxConvertRem;
height: 25rem / $pxConvertRem;
background-image: image-url("guang/star-classroom/pop-close.png");
width: 25px;
height: 25px;
background-image: resolve("guang/star-classroom/pop-close.png");
background-repeat: no-repeat;
background-size: contain;
position: absolute;
right: 20rem / $pxConvertRem;
top: 24rem / $pxConvertRem;
right: 20px;
top: 24px;
}
h1 {
font-size: 56rem / $pxConvertRem;
font-size: 56px;
font-weight: bold;
line-height: 40rem / $pxConvertRem;
line-height: 40px;
}
h4 {
font-size: 24rem / $pxConvertRem;
font-size: 24px;
}
.my-intimacy {
font-size: 24rem / $pxConvertRem;
font-size: 24px;
span {
min-width: 10rem / $pxConvertRem;
height: 30rem / $pxConvertRem;
line-height: 30rem / $pxConvertRem;
border-radius: 30rem / $pxConvertRem;
font-size: 20rem / $pxConvertRem;
min-width: 10px;
height: 30px;
line-height: 30px;
border-radius: 30px;
font-size: 20px;
color: #fff;
padding: 0 10rem / $pxConvertRem;
margin-left: 14rem / $pxConvertRem;
padding: 0 10px;
margin-left: 14px;
background-color: #444;
}
}
.increased {
font-size: 24rem / $pxConvertRem;
font-size: 24px;
display: none;
span {
... ... @@ -384,44 +384,44 @@
.week {
width: 100%;
height: 38rem / $pxConvertRem;
height: 38px;
background: #aeaeae;
padding: 0 23rem / $pxConvertRem;
padding: 0 23px;
box-sizing: border-box;
h3 {
width: 76rem / $pxConvertRem;
width: 76px;
text-align: center;
font-size: 24rem / $pxConvertRem;
font-size: 24px;
color: #fff;
float: left;
line-height: 38rem / $pxConvertRem;
line-height: 38px;
}
}
.dayItem {
float: left;
width: 100%;
padding: 5rem / $pxConvertRem 23rem / $pxConvertRem;
padding: 5px 23px;
box-sizing: border-box;
.item {
width: 76rem / $pxConvertRem;
width: 76px;
color: #444;
float: left;
text-align: center;
cursor: pointer;
margin: 5rem / $pxConvertRem 0 0 0;
height: 56rem / $pxConvertRem;
line-height: 56rem / $pxConvertRem;
font-size: 28rem / $pxConvertRem;
margin: 5px 0 0 0;
height: 56px;
line-height: 56px;
font-size: 28px;
&.lastItem {
color: #D2D2D2;
}
&.signItem {
background-image: image-url("guang/star-classroom/sign-circle.png");
background-image: resolve("guang/star-classroom/sign-circle.png");
background-position: center;
background-repeat: no-repeat;
background-size: contain;
... ... @@ -432,93 +432,93 @@
.fan-charts {
width: 100%;
height: 88rem / $pxConvertRem;
height: 88px;
border-top: 1px solid #d5d5d5;
text-align: center;
position: relative;
float: left;
h2 {
font-size: 28rem / $pxConvertRem;
font-size: 28px;
color: #444;
line-height: 88rem / $pxConvertRem;
line-height: 88px;
}
.arrow {
width: 88rem / $pxConvertRem;
height: 88rem / $pxConvertRem;
width: 88px;
height: 88px;
position: absolute;
top: 0;
right: 0;
color: #b0b0b0;
line-height: 88rem / $pxConvertRem;
line-height: 88px;
}
}
.fan-charts-cont {
width: 100%;
line-height: 88rem / $pxConvertRem;
line-height: 88px;
float: left;
li {
width: 100%;
height: 88rem / $pxConvertRem;
height: 88px;
border-top: 1px solid #d5d5d5;
position: relative;
padding: 0 25rem / $pxConvertRem;
padding: 0 25px;
box-sizing: border-box;
.rank-ico {
width: 52rem / $pxConvertRem;
height: 39rem / $pxConvertRem;
width: 52px;
height: 39px;
border-radius: 0;
background-image: image-url("guang/star-classroom/king-ico.png");
background-image: resolve("guang/star-classroom/king-ico.png");
background-color: #fff;
background-repeat: no-repeat;
background-size: contain;
color: #fff;
font-size: 24rem / $pxConvertRem;
font-size: 24px;
text-align: center;
line-height: 50rem / $pxConvertRem;
line-height: 50px;
font-weight: bold;
position: relative;
top: 25rem / $pxConvertRem;
top: 25px;
}
.rank-avatar {
width: 60rem / $pxConvertRem;
height: 60rem / $pxConvertRem;
width: 60px;
height: 60px;
border-radius: 50%;
position: relative;
top: 15rem / $pxConvertRem;
margin-left: 20rem / $pxConvertRem;
background-image: image-url("me/index/user-avatar.png");
top: 15px;
margin-left: 20px;
background-image: resolve("me/index/user-avatar.png");
background-repeat: no-repeat;
background-size: contain;
display: block;
}
.fans-name {
margin-left: 24rem / $pxConvertRem;
font-size: 24rem / $pxConvertRem;
margin-left: 24px;
font-size: 24px;
color: #444;
width: 180rem / $pxConvertRem;
width: 180px;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
height: 88rem / $pxConvertRem;
height: 88px;
}
.fans-intimacy {
width: 150rem / $pxConvertRem;
width: 150px;
float: right;
font-size: 20rem / $pxConvertRem;
font-size: 20px;
color: #444;
span {
font-size: 24rem / $pxConvertRem;
font-size: 24px;
color: #d0021b;
margin-left: 5rem / $pxConvertRem;
margin-left: 5px;
}
}
}
... ... @@ -537,44 +537,44 @@
.things-article > li {
width: 100%;
float: left;
padding: 0 0 30rem / $pxConvertRem 30rem / $pxConvertRem;
padding: 0 0 30px 30px;
box-sizing: border-box;
background: #000;
.author-info {
width: 100%;
padding-top: 30rem / $pxConvertRem;
padding-top: 30px;
float: left;
border-top:1px solid #b0b0b0;
img {
width: 70rem / $pxConvertRem;
height: 70rem / $pxConvertRem;
width: 70px;
height: 70px;
border-radius: 50%;
float: left;
}
.author-nav {
float: left;
margin-left: 20rem / $pxConvertRem;
margin-left: 20px;
overflow: hidden;
h2 {
font-size: 28rem / $pxConvertRem;
font-size: 28px;
color: #fff;
}
.article-count {
font-size: 24rem / $pxConvertRem;
font-size: 24px;
color: #b0b0b0;
span {
margin-right:22rem / $pxConvertRem;
margin-right:22px;
&.see-ico {
width: 31rem / $pxConvertRem;
height: 24rem / $pxConvertRem;
padding-left: 40rem / $pxConvertRem;
width: 31px;
height: 24px;
padding-left: 40px;
}
}
}
... ... @@ -583,15 +583,15 @@
.artice-cont {
width: 100%;
margin-top: 30rem / $pxConvertRem;
margin-top: 30px;
float: left;
p {
width: 100%;
height: 180rem / $pxConvertRem;
font-size: 28rem / $pxConvertRem;
line-height: 46rem / $pxConvertRem;
padding-right: 30rem / $pxConvertRem;
height: 180px;
font-size: 28px;
line-height: 46px;
padding-right: 30px;
color: #fff;
box-sizing: border-box;
overflow: hidden;
... ... @@ -603,20 +603,20 @@
.artice-imgs {
width: 100%;
margin-top: 30rem / $pxConvertRem;
margin-top: 30px;
float: left;
}
.artice-imgs > li {
float: left;
width: 190rem / $pxConvertRem;
height: 190rem / $pxConvertRem;
margin-right: 5rem / $pxConvertRem;
width: 190px;
height: 190px;
margin-right: 5px;
img {
width: 100%;
height: 100%;
border-radius: 4rem / $pxConvertRem;
border-radius: 4px;
}
}
}
... ... @@ -624,20 +624,20 @@
.artice-zan {
width: 100%;
border-top: 1px solid #b0b0b0;
margin-top: 27rem / $pxConvertRem;
margin-top: 27px;
float: left;
padding-top: 20rem / $pxConvertRem;
padding-top: 20px;
.iconfont {
float: left;
width: 34rem / $pxConvertRem;
height: 34rem / $pxConvertRem;
line-height: 34rem / $pxConvertRem;
width: 34px;
height: 34px;
line-height: 34px;
display: inline-block;
color: #b0b0b0;
font-size: 34rem / $pxConvertRem;
font-size: 34px;
text-align: center;
margin: 9rem / $pxConvertRem 53rem / $pxConvertRem 0 14rem / $pxConvertRem;
margin: 9px 53px 0 14px;
outline: none;
}
... ... @@ -647,15 +647,15 @@
ul {
float: left;
width: 420rem / $pxConvertRem;
height: 50rem / $pxConvertRem;
width: 420px;
height: 50px;
overflow: hidden;
li {
float: left;
margin: 0 10rem / $pxConvertRem;
width: 50rem / $pxConvertRem;
height: 50rem / $pxConvertRem;
margin: 0 10px;
width: 50px;
height: 50px;
img {
width: 100%;
... ... @@ -667,15 +667,15 @@
.zan-more {
float: left;
width: 50rem / $pxConvertRem;
height: 50rem / $pxConvertRem;
width: 50px;
height: 50px;
border-radius: 50%;
margin: 0 10rem / $pxConvertRem;
margin: 0 10px;
background: #f0f0f0;
color: #acb1b7;
font-size: 24rem / $pxConvertRem;
font-size: 24px;
text-align: center;
line-height: 50rem / $pxConvertRem;
line-height: 50px;
/*display: none;*/
}
}
... ... @@ -690,7 +690,7 @@
width: 100%;
float: left;
background: #000;
margin-top: 30rem / $pxConvertRem;
margin-top: 30px;
img {
width: 100%;
... ... @@ -698,14 +698,14 @@
p {
width: 100%;
height: 88rem / $pxConvertRem;
height: 88px;
box-sizing: border-box;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
padding: 0 34rem / $pxConvertRem;
font-size: 34rem / $pxConvertRem;
line-height: 88rem / $pxConvertRem;
padding: 0 34px;
font-size: 34px;
line-height: 88px;
}
a {
... ... @@ -721,20 +721,20 @@
li {
float: left;
width: 100%;
margin-top: 30rem / $pxConvertRem;
margin-top: 30px;
background: #000;
.cont-area {
width: 100%;
box-sizing: border-box;
padding: 30rem / $pxConvertRem;
padding: 30px;
}
.cont-txt {
font-size: 30rem / $pxConvertRem;
line-height: 46rem / $pxConvertRem;
font-size: 30px;
line-height: 46px;
color: #b0b0b0;
margin-top: 10rem / $pxConvertRem;
margin-top: 10px;
overflow : hidden;
text-overflow: ellipsis;
display: -webkit-box;
... ... @@ -747,8 +747,8 @@
}
.title {
font-size: 42rem / $pxConvertRem;
line-height: 48rem / $pxConvertRem;
font-size: 42px;
line-height: 48px;
a {
color: #fff;
... ... @@ -758,19 +758,19 @@
.count-area {
position: relative;
width: 100%;
height: 32rem / $pxConvertRem;
margin-top: 15rem / $pxConvertRem;
height: 32px;
margin-top: 15px;
span {
font-size: 24rem / $pxConvertRem;
font-size: 24px;
color: #b0b0b0;
height: 32rem / $pxConvertRem;
line-height: 32rem / $pxConvertRem;
height: 32px;
line-height: 32px;
i {
display: inline-block;
margin-right: 5rem / $pxConvertRem;
font-size: 24rem / $pxConvertRem;
margin-right: 5px;
font-size: 24px;
}
&.time {
... ... @@ -779,26 +779,26 @@
&.see {
float: left;
margin-left: 20rem / $pxConvertRem;
margin-left: 20px;
}
.time-ico {
width: 24rem / $pxConvertRem;
height: 24rem / $pxConvertRem;
width: 24px;
height: 24px;
}
.see-ico {
width: 31rem / $pxConvertRem;
height: 24rem / $pxConvertRem;
width: 31px;
height: 24px;
}
&.collection {
position: absolute;
right: 122rem / $pxConvertRem;
right: 122px;
.collected-ico {
width: 34rem / $pxConvertRem;
height: 32rem / $pxConvertRem;
width: 34px;
height: 32px;
vertical-align: text-bottom;
}
... ... @@ -809,15 +809,15 @@
}
.forward {
width: 40rem / $pxConvertRem;
height: 28rem / $pxConvertRem;
width: 40px;
height: 28px;
position: absolute;
right: 23rem / $pxConvertRem;
margin-left: 45rem / $pxConvertRem;
font-size: 24rem / $pxConvertRem;
right: 23px;
margin-left: 45px;
font-size: 24px;
color: #b0b0b0;
height: 32rem / $pxConvertRem;
line-height: 32rem / $pxConvertRem;
height: 32px;
line-height: 32px;
}
}
}
... ... @@ -825,7 +825,7 @@
.things-list {
.things-article > li {
margin-top: 30rem / $pxConvertRem;
margin-top: 30px;
.author-info {
border-top: none;
... ... @@ -838,24 +838,24 @@
.check-in-header {
width: 100%;
height: 283rem / $pxConvertRem;
background-image: image-url("guang/star-classroom/checkIn-bg.jpg");
height: 283px;
background-image: resolve("guang/star-classroom/checkIn-bg.jpg");
background-repeat: no-repeat;
background-size: contain;
.head-cont {
text-align: center;
padding-top: 30rem / $pxConvertRem;
height: 195rem / $pxConvertRem;
padding-top: 30px;
height: 195px;
box-sizing: border-box;
.user-avatar {
width: 100rem / $pxConvertRem;
height: 100rem / $pxConvertRem;
width: 100px;
height: 100px;
border-radius: 50%;
border:4rem / $pxConvertRem solid;
border:4px solid;
border-color: rgba(255,255,255,.6);
background-image: image-url("me/index/user-avatar.png");
background-image: resolve("me/index/user-avatar.png");
background-repeat: no-repeat;
background-size: contain;
display: inline-block;
... ... @@ -863,9 +863,9 @@
.user-name {
color: #fff;
font-size: 24rem / $pxConvertRem;
font-size: 24px;
font-weight: bold;
margin-top: 7rem / $pxConvertRem;
margin-top: 7px;
}
}
... ... @@ -875,23 +875,23 @@
}
.count-nav {
width: 319rem / $pxConvertRem;
width: 319px;
float: left;
margin-top: 12rem / $pxConvertRem;
margin-top: 12px;
p {
width: 100%;
text-align: center;
color: #fff;
line-height: 32rem / $pxConvertRem;
line-height: 32px;
}
}
.line {
width: 2rem / $pxConvertRem;
height: 46rem / $pxConvertRem;
width: 2px;
height: 46px;
float: left;
margin-top: 26rem / $pxConvertRem;
margin-top: 26px;
box-sizing: border-box;
border-left: 1px solid #fff;
}
... ... @@ -901,22 +901,22 @@
width: 100%;
background: #fff;
border-top: 1px solid #e0e0e0;
margin-top: 30rem / $pxConvertRem;
padding-left: 30rem / $pxConvertRem;
margin-top: 30px;
padding-left: 30px;
box-sizing: border-box;
li {
width: 100%;
height: 120rem / $pxConvertRem;
padding-top: 20rem / $pxConvertRem;
height: 120px;
padding-top: 20px;
box-sizing: border-box;
border-bottom: 1px solid #e0e0e0;
.rank-avatar {
width: 80rem / $pxConvertRem;
height: 80rem / $pxConvertRem;
width: 80px;
height: 80px;
border-radius: 50%;
background-image: image-url("me/index/user-avatar.png");
background-image: resolve("me/index/user-avatar.png");
background-repeat: no-repeat;
background-size: contain;
float: left;
... ... @@ -924,54 +924,54 @@
.ranking-mid {
float: left;
margin-left: 20rem / $pxConvertRem;
margin-left: 20px;
.rank-ico {
min-width: 18rem / $pxConvertRem;
height: 38rem / $pxConvertRem;
border-radius: 38rem / $pxConvertRem;
min-width: 18px;
height: 38px;
border-radius: 38px;
background: #444;
display: inline-block;
text-align: center;
line-height: 40rem / $pxConvertRem;
line-height: 40px;
color: #fff;
font-size: 24rem / $pxConvertRem;
font-size: 24px;
font-weight: bold;
padding: 0 10rem / $pxConvertRem;
padding: 0 10px;
}
.rank-name {
font-size: 24rem / $pxConvertRem;
font-size: 24px;
color: #444;
margin-top: 5rem / $pxConvertRem;
width: 180rem / $pxConvertRem;
margin-top: 5px;
width: 180px;
white-space: nowrap;
text-overflow: ellipsis;
overflow: hidden;
height: 30rem / $pxConvertRem;
height: 30px;
}
}
.ranking-rg {
font-size: 20rem / $pxConvertRem;
font-size: 20px;
color: #444;
float: right;
margin:20rem / $pxConvertRem 30rem / $pxConvertRem 0 0;
margin:20px 30px 0 0;
.intimacy {
margin-left: 10rem / $pxConvertRem;
font-size: 36rem / $pxConvertRem;
margin-left: 10px;
font-size: 36px;
color: #b0b0b0;
}
}
&.high-light {
.rank-ico {
width: 52rem / $pxConvertRem;
height: 39rem / $pxConvertRem;
line-height: 50rem / $pxConvertRem;
width: 52px;
height: 39px;
line-height: 50px;
border-radius: 0;
background-image: image-url("guang/star-classroom/king-ico.png");
background-image: resolve("guang/star-classroom/king-ico.png");
background-color: #fff;
background-repeat: no-repeat;
background-size: contain;
... ...
... ... @@ -4,7 +4,7 @@
.just-img{
width: 100%;
float: left;
margin: 20rem / $pxConvertRem 0;
margin: 20px 0;
}
.coupon-floor {
float: left;
... ... @@ -12,30 +12,30 @@
.floor-title {
background-color: #fff;
text-align: center;
height: 96rem / $pxConvertRem;
line-height: 96rem / $pxConvertRem;
font-size: 30rem / $pxConvertRem;
height: 96px;
line-height: 96px;
font-size: 30px;
}
.floor-main {
height: 180rem / $pxConvertRem;
height: 180px;
width: 100%;
background-size: 100%;
background-repeat: no-repeat;
padding: 10rem / $pxConvertRem 30rem / $pxConvertRem;
padding: 10px 30px;
box-sizing: border-box;
float: left;
.main-left {
float: left;
width: 467rem / $pxConvertRem;
height: 160rem / $pxConvertRem;
width: 467px;
height: 160px;
}
.main-right-receive, .main-right-use, .main-right-go {
float: right;
width: 113rem / $pxConvertRem;
height: 160rem / $pxConvertRem;
width: 113px;
height: 160px;
position: relative;
span {
... ... @@ -45,27 +45,27 @@
&.on-receive {
position: absolute;
left: 50%;
top: 50rem / $pxConvertRem;
margin-left: -26rem / $pxConvertRem;
top: 50px;
margin-left: -26px;
display: inline-block;
width: 52rem / $pxConvertRem;
height: 54rem / $pxConvertRem;
background-image: image-url('coupon/click-txt.png');
width: 52px;
height: 54px;
background-image: resolve('coupon/click-txt.png');
}
&.received {
width: 113rem / $pxConvertRem;
height: 132rem / $pxConvertRem;
background-image: image-url('coupon/received.png');
width: 113px;
height: 132px;
background-image: resolve('coupon/received.png');
position: absolute;
top: 0;
right: 0;
}
&.zero {
width: 111rem / $pxConvertRem;
height: 132rem / $pxConvertRem;
background-image: image-url('coupon/zero.png');
width: 111px;
height: 132px;
background-image: resolve('coupon/zero.png');
position: absolute;
top: 0;
right: 0;
... ... @@ -90,10 +90,10 @@
position: fixed;
top: 50%;
left: 50%;
width: 550rem/$pxConvertRem;
height: 250rem/$pxConvertRem;
margin-left: -275rem/$pxConvertRem;
margin-top: -125rem/$pxConvertRem;
width: 550px;
height: 250px;
margin-left: -275px;
margin-top: -125px;
z-index: 10;
background-color: rgba(250, 250, 250, .92);
display: none;
... ... @@ -101,17 +101,17 @@
.coupon-message-content {
border-bottom: 1px solid rgb(197, 197, 197);
height: 160rem/$pxConvertRem;
height: 160px;
text-align: center;
line-height: 160rem/$pxConvertRem;
font-size: 28rem/$pxConvertRem;
line-height: 160px;
font-size: 28px;
}
.coupon-message-op {
height: 90rem/$pxConvertRem;
height: 90px;
text-align: center;
line-height: 90rem/$pxConvertRem;
font-size: 32rem/$pxConvertRem;
line-height: 90px;
font-size: 32px;
color: rgb(223, 98, 112);
}
}
... ... @@ -120,24 +120,24 @@
position: fixed;
top: 50%;
left: 50%;
width: 220rem/$pxConvertRem;
height: 140rem/$pxConvertRem;
margin-left: -110rem/$pxConvertRem;
margin-top: -70rem/$pxConvertRem;
width: 220px;
height: 140px;
margin-left: -110px;
margin-top: -70px;
z-index: 11;
background-color: rgba(60, 60, 60, .7);
display: none;
border-radius: 8rem/$pxConvertRem;
border-radius: 8px;
color: #fff;
.icon-box{
height: 84rem/$pxConvertRem;
line-height: 84rem/$pxConvertRem;
height: 84px;
line-height: 84px;
text-align: center;
}
.icon-msg{
height: 56rem/$pxConvertRem;
height: 56px;
text-align: center;
}
}
\ No newline at end of file
... ...
.fresh-swiper {
position: relative;
height: 200px;
overflow: hidden;
ul {
ul {
li {
float: left;
width: 100%;
... ... @@ -27,7 +27,7 @@
height: 14px;
background: #fff;
opacity: 0.5;
margin: 0 9px;
margin: 0 (9px);
border-radius: 50%;
}
span.swiper-active-switch {
... ... @@ -41,6 +41,7 @@
overflow: hidden;
padding-bottom: 15px;
background-color: #fff;
height: 470px;
ul {
box-sizing: border-box;
... ... @@ -49,7 +50,8 @@
li {
float:left;
width:240px;
margin: 20px 10px 0 10px;
margin: (20px) (10px) 0 (10px);
border: none;
&:first-child {
margin-left: 20px;
... ... @@ -60,13 +62,15 @@
}
.img-box {
height: 100%;
width: 100%;
height:320px;
overflow: hidden;
text-align: center;
position: relative;
img {
width: 100%;
height: 100%;
height: 320px;
vertical-align: middle;
border: none;
outline: none;
... ... @@ -92,7 +96,7 @@
}
.old-price {
margin: 0 0 0 10px;
margin: 0 0 0 (10px);
color: #b0b0b0;
text-decoration: line-through;
font-size: 22px;
... ... @@ -101,14 +105,13 @@
.fresh-icon {
background: #d62927;
width: 100px;
height: 33px;
height: 20px;
display: block;
margin: 8px auto 0 auto;
margin: (8px) auto 0 auto;
color: #fff;
text-align: center;
border-radius: 40px;
line-height: 37px;
font-size:12px;
line-height: 20px;
}
}
}
... ... @@ -116,5 +119,5 @@
.fresh-list{
position: relative;
padding:15px 0 0 15px;
padding:(15px) 0 0 (15px);
}
\ No newline at end of file
... ...