<!--动态-->
<template>
  <div>动态
    <Handder></Handder>
    <Sidebar></Sidebar>
    <div style="width: 450px;height: 140px;border: 1px solid darkgrey;position: relative;margin-left: 50px;margin-top: 50px" class="idxs">
      <p style="position: absolute;top: 20px;right: 80px">视频描述</p>
      <div style="width: 230px;height: 140px;border: 1px solid darkgrey;background-color: darkgrey;border-radius: 15px;position: absolute;right: 235px;top: 0;">
        <img src="../../assets/用户.jpg" width="80%" height="80%"></div>
      <div style="position: absolute;right: 0;top:0;width: 236px;height:130px;">
        <el-button style="margin-top: 60px;width: 68px;height: 20px;text-align: left;line-height: 3px" type="danger" >作者</el-button>
        <br>
        <el-button  style="width: 68px;height: 20px;line-height: 3px"type="info">类型</el-button>
        <div style="width:100px;height: 28px;background-color: darkgrey;line-height: 25px"><h5 >观看次数 评论数</h5>
      </div>
    </div>
  </div>

    <div style="width: 450px;height: 140px;border: 1px solid darkgrey;position: relative; left: 600px;top: -142px">
      <p style="position: absolute;top: 20px;right: 80px">视频描述</p>
      <div style="width: 230px;height: 140px;border: 1px solid darkgrey;background-color: darkgrey;border-radius: 15px;position: absolute;right: 235px;top: 0;">
        <img src="../../assets/用户.jpg" width="80%" height="80%"></div>
      <div style="position: absolute;right: 0;top:0;width: 236px;height:130px;">
        <el-button style="margin-top: 60px;width: 68px;height: 20px;text-align: left;line-height: 3px" type="danger" >作者</el-button>
        <br>
        <el-button  style="width: 68px;height: 20px;line-height: 3px"type="info">类型</el-button>
        <div style="width:100px;height: 28px;background-color: darkgrey;line-height: 25px"><h5 >观看次数 评论数</h5>
        </div>
      </div>
    </div>

    <div style="width: 450px;height: 140px;border: 1px solid darkgrey;position: relative;margin-left: 40px;margin-top: 40px;top:-140px;left: 10px">
      <p style="position: absolute;top: 20px;right: 80px">视频描述</p>
      <div style="width: 230px;height: 140px;border: 1px solid darkgrey;background-color: darkgrey;border-radius: 15px;position: absolute;right: 235px;top: 0;">
        <img src="../../assets/用户.jpg" width="80%" height="80%"></div>
      <div style="position: absolute;right: 0;top:0;width: 236px;height:130px;">
        <el-button style="margin-top: 60px;width: 68px;height: 20px;text-align: left;line-height: 3px" type="danger" >作者</el-button>
        <br>
        <el-button  style="width: 68px;height: 20px;line-height: 3px"type="info">类型</el-button>
        <div style="width:100px;height: 28px;background-color: darkgrey;line-height: 25px"><h5 >观看次数 评论数</h5>
        </div>
      </div>
    </div>

    <div style="width: 450px;height: 140px;border: 1px solid darkgrey;position: relative;margin-left: 40px;margin-top: 40px;left: 560px;top: -320px">
      <p style="position: absolute;top: 20px;right: 80px">视频描述</p>
      <div style="width: 230px;height: 140px;border: 1px solid darkgrey;background-color: darkgrey;border-radius: 15px;position: absolute;right: 235px;top: 0;">
        <img src="../../assets/用户.jpg" width="80%" height="80%"></div>
      <div style="position: absolute;right: 0;top:0;width: 236px;height:130px;">
        <el-button style="margin-top: 60px;width: 68px;height: 20px;text-align: left;line-height: 3px" type="danger" >作者</el-button>
        <br>
        <el-button  style="width: 68px;height: 20px;line-height: 3px"type="info">类型</el-button>
        <div style="width:100px;height: 28px;background-color: darkgrey;line-height: 25px"><h5 >观看次数 评论数</h5>
        </div>
      </div>
    </div>

    <div style="width: 450px;height: 140px;border: 1px solid darkgrey;position: relative;margin-left: 40px;margin-top: 40px;top:-320px;right: -9px">
      <p style="position: absolute;top: 20px;right: 80px">视频描述</p>
      <div style="width: 230px;height: 140px;border: 1px solid darkgrey;background-color: darkgrey;border-radius: 15px;position: absolute;right: 235px;top: 0;">
        <img src="../../assets/用户.jpg" width="80%" height="80%"></div>
      <div style="position: absolute;right: 0;top:0;width: 236px;height:130px;">
        <el-button style="margin-top: 60px;width: 68px;height: 20px;text-align: left;line-height: 3px" type="danger" >作者</el-button>
        <br>
        <el-button  style="width: 68px;height: 20px;line-height: 3px"type="info">类型</el-button>
        <div style="width:100px;height: 28px;background-color: darkgrey;line-height: 25px"><h5 >观看次数 评论数</h5>
        </div>
      </div>
    </div>

    <div style="width: 450px;height: 140px;border: 1px solid darkgrey;position: relative;margin-left: 40px;margin-top: 40px;left: 560px;top: -500px">
      <p style="position: absolute;top: 20px;right: 80px">视频描述</p>
      <div style="width: 230px;height: 140px;border: 1px solid darkgrey;background-color: darkgrey;border-radius: 15px;position: absolute;right: 235px;top: 0;">
        <img src="../../assets/用户.jpg" width="80%" height="80%"></div>
      <div style="position: absolute;right: 0;top:0;width: 236px;height:130px;">
        <el-button style="margin-top: 60px;width: 68px;height: 20px;text-align: left;line-height: 3px" type="danger" >作者</el-button>
        <br>
        <el-button  style="width: 68px;height: 20px;line-height: 3px"type="info">类型</el-button>
        <div style="width:100px;height: 28px;background-color: darkgrey;line-height: 25px"><h5 >观看次数 评论数</h5>
        </div>
      </div>
    </div>

  </div>
</template>

<script>
import Handder from "@/components/Handder.vue";
import Sidebar from "@/components/sidebar.vue";

export default {
  name: "dynamic",
  components: {Sidebar, Handder},
  data() {
    return {}
  },
  methods: {},
  created() {

  }
}
</script>

<style scoped>
@media screen and (min-width: 1970px) {
  .idxs {
    margin: 60px auto;
    width: calc(100% - 290px);
    max-width: 1570px;
    min-width: 1200px;
  }
}
@media screen and (max-width: 1969px) {
  .idxs {
    /*width: 1270px;*/
    /*min-width: 1000px;*/
    /*margin-top: 60px;*/
    /*margin-left: 270px;*/
    /*padding: 40px;*/
    width: calc(100% - 290px);
    max-width: 1570px;
    min-width: 1200px;
    margin: 60px auto;
  }
}
</style>