src/components/mini/box16-videoDetail.vue

@@ -9,7 +9,7 @@
         <div class="playBox" v-bind:class="{ fadeInLeft: this.$attrs.showFade,fade: !this.$attrs.showFade }">
            <videoPlayBox ref="videoPlayBox" @swichPlay="swichPlay"></videoPlayBox>
         </div>
         <div 
         <div
            v-bind:class="{ showButtonMargin:( showBackButton ) ,fadeInRight: this.$attrs.showFade,fade: !this.$attrs.showFade }">
            <div class="introduce myShadow" v-if="introduce!=''">
               <pre style="white-space: pre-line;">{{introduce}}</pre>
@@ -192,11 +192,7 @@
      },
   }
</script>
<style scoped>
   a {
      color: black;
   }

<style lang="less">
   pre {
      font-family: 'HYTangMeiRen';
      src: url("http://t.inleft.com/share/z%E5%AD%97%E4%BD%93%E5%BA%93/hytmr55%E6%B1%89%E4%BB%AA%E5%94%90%E7%BE%8E%E4%BA%BA%E5%AD%97%E4%BD%93.woff") format("truetype");
@@ -209,28 +205,34 @@
      clear: both;
      grid-row-gap: 2rem;
      max-height: 100%;

      a {
         color: black;
      }

      .playBox {
         display: flex;
         justify-content: center;
         padding: 35px 0px;
      }

      .showButtonMargin {
         margin: 75px 0px 0px 0px;
      }

      .myShadow {

         box-shadow: 8px 8px 18px rgba(0, 0, 0, 0.1),
            -8px -8px 18px #ffffff;
      }

      .introduce {
         padding: 20px 20px 5px;
         margin-bottom: 20px;
      }
   }

   .playBox {
      display: flex;
      justify-content: center;
      padding: 35px 0px;
   }

   .showButtonMargin {
      margin: 75px 0px 0px 0px;
   }

   .myShadow {

      box-shadow: 8px 8px 18px rgba(0, 0, 0, 0.1),
         -8px -8px 18px #ffffff;
   }

   .introduce {
      padding: 20px 20px 5px;
      margin-bottom: 20px;
   }

   @media screen and (max-width: 1023px) {
      .boxMain {