购买页修改

src/pages/pay/index.vue

@@ -13,10 +13,13 @@
     </div>
     <div class="btn-box">
       <div class="text">
-        <div class="l">特惠价</div>
-        <div class="c">199.00</div>
-        <div class="r" v-if="orderStatus != 0">原价999.00</div>
-        <div class="r" v-else>课程有效期剩余{{expireDay}}天</div>
+        <div class="fle">
+          <div class="l">特惠价</div>
+          <div class="c">199.00</div>
+          <div class="r">原价999.00</div>
+        </div>
+        <!-- <div class="r" v-else>课程有效期剩余{{expireDay}}天</div> -->
+        <div class="new-b" v-if="orderStatus === 0">课程有效期剩余{{expireDay}}天</div>
       </div>
       <div class="btn" @click="goPay" v-if="orderStatus === 100">立即购买</div>
       <div class="btn" v-if="orderStatus === 1" @click="goHome">已购买</div>
@@ -198,7 +201,7 @@ export default {
       position: absolute;
       top: 0;
       right: 0;
-      width:2.38rem;
+      width:3.3rem;
       height:1rem;
       background:linear-gradient(-90deg,rgba(204,158,94,1),rgba(247,214,161,1));
       font-size:.37rem;
@@ -207,34 +210,48 @@ export default {
       text-align: center;
     }
     .text{
-      display: flex;
+      .fle{
+        display: flex;
+        div{
+          line-height: 100%;
+        }
+      }
       .l{
         font-size:.22rem;
-        text-decoration:line-through;
         color:rgba(255,255,255,1);
         line-height:100%;
-        margin: .46rem 0 0 .34rem;
+        margin: .43rem 0 0 .34rem;
         background:linear-gradient(-90deg,rgba(204,158,94,1) 0%, rgba(247,214,161,1) 100%);
         -webkit-background-clip:text;
         -webkit-text-fill-color:transparent;
         opacity:0.8;
       }
       .c{
+        margin-top: .3rem;
         margin-left: .15rem;
         font-size:.44rem;
         color:rgba(255,255,255,1);
-        line-height:1rem;
         background:linear-gradient(-90deg,rgba(204,158,94,1) 0%, rgba(247,214,161,1) 100%);
         -webkit-background-clip:text;
         -webkit-text-fill-color:transparent;
       }
       .r{
         font-size:.22rem;
+        color:rgba(204,158,94,1);
+        line-height:100%;
+        opacity:0.9;
+        margin: .43rem 0 0 .17rem;
+        // background:linear-gradient(-90deg,rgba(204,158,94,1) 0%, rgba(247,214,161,1) 100%);
+        // -webkit-background-clip:text;
+        // -webkit-text-fill-color:transparent;
         text-decoration:line-through;
+      }
+      .new-b{
+        font-size:.22rem;
         color:rgba(255,255,255,1);
         line-height:100%;
         opacity:0.8;
-        margin: .44rem 0 0 .17rem;
+        margin:0 0 0 .34rem;
         background:linear-gradient(-90deg,rgba(204,158,94,1) 0%, rgba(247,214,161,1) 100%);
         -webkit-background-clip:text;
         -webkit-text-fill-color:transparent;