绘制会员中心页面

src/main/resources/static/css/user-center/member/member-page.css

@@ -1,11 +1,5 @@
 /*公共样式*/
-.cm-text-ellipsis-2{
-    overflow: hidden;
-    text-overflow: ellipsis;
-    display:-webkit-box;
-    -webkit-box-orient:vertical;
-    -webkit-line-clamp:2;
-}
+.cm-text-ellipsis-2{overflow:hidden;-o-text-overflow:ellipsis;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}
 /*pc端样式*/
 @media screen and (min-width:768px){
 .right{width:968px;overflow:hidden}
@@ -42,15 +36,9 @@
 .coupon-list>div .amount>i{font-size:14px;font-weight:400;color:#55331D;font-style:unset}
 .coupon-list>div .condition{font-size:12px;font-weight:400;color:#55331D}
 .coupon-list>div .receive-btn{width:48px;height:100%;position:absolute;right:0;top:0;z-index:9;font-size:14px;font-weight:400;color:#55331D;-webkit-writing-mode:vertical-lr;-ms-writing-mode:tb-lr;writing-mode:vertical-lr;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;cursor:pointer}
-.goods-list {
-    display: flex;
-    justify-content: space-between;
-    align-items: flex-start;
-}
-.goods-list .goods a:hover{color: unset;}
-.goods-list .goods{
-    width: 173px;
-}
+.goods-list{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;-webkit-box-align:start;-ms-flex-align:start;align-items:flex-start}
+.goods-list .goods a:hover{color:unset}
+.goods-list .goods{width:173px}
 /*商品价格*/
 .goods-list .goods .page_main_price{width:100%;height:54px;float:left;box-sizing:border-box;padding:0 8px}
 .goods-list .goods .page_main_price .main_price_text{width:100%;height:54px;float:left;box-sizing:border-box}
@@ -73,76 +61,16 @@
 .goods-list .goods .page_main_price .price_grade_4:before{background-position:0 -804px}
 .goods-list .goods .page_main_price .price_grade_5:before{background-position:0 -834px}
 /*商品列表*/
-.goods-list .goods img{
-    display: block;
-    width: 173px;
-    height: 173px;
-    box-sizing: border-box;
-    border: 1px dashed #E2E7EF;
-}
-
-.goods-list .goods .goods-title{
-    width: 169px;
-    height: 41px;
-    margin-top: 12px;
-    font-size: 14px;
-    font-weight: 400;
-    line-height: 22px;
-    color: #4A4F58;
-}
-.goods-list .goods .goods-tag{
-    height: 20px;
-    padding: 8px 0;
-}
-.goods-list .goods .goods-tag .tag{
-    line-height: 20px;
-    font-size: 12px;
-    padding: 0 2px;
-}
-.goods-list .goods .goods-tag .tag.styl1{
-    color: #F94B4B;
-    background: #FFF1EB;
-    border: 1px solid #F94B4B;
-}
-.goods-list .goods .goods-tag .tag.styl2{
-    color: #E15616;
-    background: #FFF1EB;
-    border: 1px solid #F94B4B;
-}
-
-.goods-list .goods .svip-price{
-    position: relative;
-    height: 20px;
-    box-sizing: border-box;
-}
-.goods-list .goods .svip-price>span{
-    display: block;
-}
-.goods-list .goods .svip-price .amount{
-    display: inline-block;
-    font-size: 14px;
-    font-weight: 400;
-    line-height: 20px;
-    color: #333333;
-    background: #F0CB72;
-    padding-left: 40px;
-    padding-right: 6px;
-    box-sizing: border-box;
-    border-radius: 2px;
-}
-.goods-list .goods .svip-price .svip-icon{
-    position: absolute;
-    left: 0;
-    top: 0;
-    width: 36px;
-    height: 20px;
-    background: #333333;
-    font-size: 12px;
-    line-height: 20px;
-    color: #F0CB72;
-    border-radius: 2px;
-    text-align: center;
-}
+.goods-list .goods img{display:block;width:173px;height:173px;-webkit-box-sizing:border-box;box-sizing:border-box;border:1px dashed #E2E7EF}
+.goods-list .goods .goods-title{width:169px;height:41px;margin-top:12px;font-size:14px;font-weight:400;line-height:22px;color:#4A4F58}
+.goods-list .goods .goods-tag{height:20px;padding:8px 0}
+.goods-list .goods .goods-tag .tag{line-height:20px;font-size:12px;padding:0 2px}
+.goods-list .goods .goods-tag .tag.styl1{color:#F94B4B;background:#FFF1EB;border:1px solid #F94B4B}
+.goods-list .goods .goods-tag .tag.styl2{color:#E15616;background:#FFF1EB;border:1px solid #F94B4B}
+.goods-list .goods .svip-price{position:relative;height:20px;-webkit-box-sizing:border-box;box-sizing:border-box}
+.goods-list .goods .svip-price>span{display:block}
+.goods-list .goods .svip-price .amount{display:inline-block;font-size:14px;font-weight:400;line-height:20px;color:#333333;background:#F0CB72;padding-left:40px;padding-right:6px;-webkit-box-sizing:border-box;box-sizing:border-box;border-radius:2px}
+.goods-list .goods .svip-price .svip-icon{position:absolute;left:0;top:0;width:36px;height:20px;background:#333333;font-size:12px;line-height:20px;color:#F0CB72;border-radius:2px;text-align:center}
 }
 
 /*h5端样式*/
@@ -181,21 +109,10 @@
 .coupon-list>div .amount>i{font-size:2.8vw;font-weight:400;color:#55331D;font-style:unset}
 .coupon-list>div .condition{font-size:2.6vw;font-weight:400;color:#55331D}
 .coupon-list>div .receive-btn{width:10vw;height:100%;position:absolute;right:0;top:0;z-index:9;font-size:3vw;font-weight:400;color:#55331D;-webkit-writing-mode:vertical-lr;-ms-writing-mode:tb-lr;writing-mode:vertical-lr;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;cursor:pointer}
-.goods-list {
-    width: 100vw;
-    overflow-x: scroll;
-    white-space: nowrap;
-    padding-bottom: 4.8vw;
-}
-.goods-list .goods a:hover{color: unset;}
-.goods-list .goods{
-    display: inline-block;
-    width: 26.9vw;
-    margin-right: 2.4vw;
-}
-.goods-list .goods:first-child{
-    margin-left: 3.3vw;
-}
+.goods-list{width:100vw;overflow-x:scroll;white-space:nowrap;padding-bottom:4.8vw}
+.goods-list .goods a:hover{color:unset}
+.goods-list .goods{display:inline-block;width:26.9vw;margin-right:2.4vw}
+.goods-list .goods:first-child{margin-left:3.3vw}
 /*商品价格*/
 .goods-list .goods .page_main_price{width:100%;box-sizing:border-box;padding:0 3.2vw}
 .goods-list .goods .page_main_price .price_text_tag{width:100%;box-sizing:border-box;float:left}
@@ -205,75 +122,15 @@
 .goods-list .goods .page_main_price .price_text_tag .couponTag{padding:0 2vw;border:.27vw solid #f94b4b;background:#fff1eb;font-size:2.8vw;float:left;height:4.2vw;line-height:4.2vw;color: #f94b4b;border-radius: 0.2vw;margin-right: 1vw;}
 .goods-list .goods .page_main_price .price_text_tag .listTag{padding:0 2vw;border:.27vw solid #ffe6dc;background:none;font-size:2.8vw;float:left;height:4.2vw;line-height:4.2vw;border-radius: 0.2vw;}
 /*商品列表*/
-.goods-list .goods img{
-    display: block;
-    width: 26.9vw;
-    height: 26.9vw;
-    box-sizing: border-box;
-    border: 1px dashed #E2E7EF;
-}
-
-.goods-list .goods .goods-title{
-    white-space: pre-wrap;
-    height: 9.2vw;
-    font-size: 3.4vw;
-    font-weight: 400;
-    line-height: 4.7vw;
-    color: #627386;
-}
-.goods-list .goods .goods-tag{
-    margin: 1.6vw 0;
-}
-.goods-list .goods .goods-tag .tag{
-    line-height: 4.2vw;
-    font-size: 2.8vw;
-    border-radius: 2px;
-    box-sizing: border-box;
-    padding: 0 0.5vw;
-}
-.goods-list .goods .goods-tag .tag.styl1{
-    color: #F94B4B;
-    background: #FFF1EB;
-    border: 1px solid #F94B4B;
-}
-.goods-list .goods .goods-tag .tag.styl2{
-    color: #E15616;
-    background: #FFF1EB;
-    border: 1px solid #F94B4B;
-}
-
-.goods-list .goods .svip-price{
-    position: relative;
-    height: 4.8vw;
-    box-sizing: border-box;
-}
-.goods-list .goods .svip-price>span{
-    display: block;
-}
-.goods-list .goods .svip-price .amount{
-    display: inline-block;
-    font-size: 3.4vw;
-    font-weight: 400;
-    line-height: 4.8vw;
-    color: #333333;
-    background: #F0CB72;
-    padding-left: 8vw;
-    padding-right: 0.8vw;
-    box-sizing: border-box;
-    border-radius: 2px;
-}
-.goods-list .goods .svip-price .svip-icon{
-    position: absolute;
-    left: 0;
-    top: 0;
-    width: 8vw;
-    height: 4.8vw;
-    background: #333333;
-    font-size: 3vw;
-    line-height: 4.8vw;
-    color: #F0CB72;
-    border-radius: 2px;
-    text-align: center;
-}
+.goods-list .goods img{display:block;width:26.9vw;height:26.9vw;-webkit-box-sizing:border-box;box-sizing:border-box;border:1px dashed #E2E7EF}
+.goods-list .goods .goods-title{white-space:pre-wrap;height:9.2vw;font-size:3.4vw;font-weight:400;line-height:4.7vw;color:#627386}
+.goods-list .goods .goods-tag{margin:1.6vw 0}
+.goods-list .goods .goods-tag .tag{line-height:4.2vw;font-size:2.8vw;border-radius:2px;-webkit-box-sizing:border-box;box-sizing:border-box;padding:0 0.5vw}
+.goods-list .goods .goods-tag .tag.styl1{color:#F94B4B;background:#FFF1EB;border:1px solid #F94B4B}
+.goods-list .goods .goods-tag .tag.styl2{color:#E15616;background:#FFF1EB;border:1px solid #F94B4B}
+.goods-list .goods .svip-price{position:relative;height:4.8vw;-webkit-box-sizing:border-box;box-sizing:border-box}
+.goods-list .goods .svip-price>span{display:block}
+.goods-list .goods .svip-price .amount{display:inline-block;font-size:3.4vw;font-weight:400;line-height:4.8vw;color:#333333;background:#F0CB72;padding-left:8vw;padding-right:0.8vw;-webkit-box-sizing:border-box;box-sizing:border-box;border-radius:2px}
+.goods-list .goods .svip-price .svip-icon{position:absolute;left:0;top:0;width:8vw;height:4.8vw;background:#333333;font-size:3vw;line-height:4.8vw;color:#F0CB72;border-radius:2px;text-align:center}
 
 }