<template>
  <div class="video-icon-view" v-if="pause">
    <van-icon custom-class="video-icon video-icon_animate" name="play" />
  </div>
</template>
<script>
  import wepy from '@wepy/core';

  wepy.component({
    props: {
      pause: false
    }
  });
</script>
<style lang="less">
  .video-icon-view {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
    width: 100%;
    .video-icon {
      z-index: 2;
      color: rgba(255,255,255,0.5);
      font-size: 100rpx;
    }
  }
  .video-icon_animate {
      animation:mymoves .5s forwards;
      -webkit-animation:mymoves .5s forwards; /*Safari and Chrome*/
    }
     @keyframes mymoves {
        from { transform: scale(2);opacity: 0;}
        to { transform: scale(1);opacity: 1;}
      }
</style>
<config>
{
    usingComponents: {
      'van-icon': '~@/components/vant/icon/index'
    }
}
</config>
