From b72b2ea324a3ab0e94b987bf98024bd884d25f33 Mon Sep 17 00:00:00 2001 From: inleft <inleft@qq.com> Date: Tue, 16 Aug 2022 01:28:24 +0800 Subject: [PATCH] 调整子评论间距 --- src/components/mini/box14-video.vue | 43 +++++++++++++++++++++++-------------------- 1 files changed, 23 insertions(+), 20 deletions(-) diff --git a/src/components/mini/box14-video.vue b/src/components/mini/box14-video.vue index 9e794c3..ad280c1 100644 --- a/src/components/mini/box14-video.vue +++ b/src/components/mini/box14-video.vue @@ -1,5 +1,5 @@ <template> - <div> + <div class="fade"> <div class="mySecretSamll" v-if="data==null|| data.length==0"> <p> <a-icon type="delete" /> 空空如也.. @@ -7,7 +7,7 @@ </div> <div class="gridClass"> <div class="entry-preview" v-for="item in data"> - <div class="thumbnail_box" @click="showMyVideo(item.id)"> + <div class="thumbnail_box" @click="showMyVideo(item)"> <div class="thumbnail"> <img :src="item.coverFileURL" alt="" loading="lazy" :onerror="img404"> </div> @@ -15,7 +15,10 @@ <div class="entry-post"> <div class="entry-header"> <h5 class="entry-title"> - <a href="#" rel="bookmark">{{item.title}}</a> + <router-link :to="{path:'videoDetail',query:{id:item.id}}" :title="item.title"> + {{item.title}} + </router-link> + <!-- {{item.title}} --> </h5> <div class="post_content"> {{item.introduce}} @@ -24,7 +27,7 @@ <div class="entry-meta"> <div class="post-categories"> <span class="tag vcard"> - <a-icon type="book" /> + <a-icon type="customer-service" /> <a href="#" rel="category tag"> {{item.articleTypeName}}</a> </span> <!-- <span class="tag-list"> @@ -36,7 +39,7 @@ <div class="post-on"> <span class="entry-date"> <a-icon type="calendar" /> - <a href="#" rel="bookmark"> + <a href="#" rel="bookmark"> {{item.publishDate}} </a> </span> @@ -61,7 +64,7 @@ } from '../../api/blogArticle.js' import myConstant from "../../config/myConstant.js" - + export default { data() { return { @@ -93,9 +96,11 @@ return res }) }, - showMyVideo(param) { + showMyVideo(item) { this.$emit('showMyVideo', { - id: param + id: item.id, + isAllowedComment: item.isAllowedComment, + introduce: item.introduce, }) } } @@ -119,6 +124,7 @@ gap: 2rem; padding-bottom: 20px; // background-color: #666; + user-select: none; a { color: #555; @@ -194,7 +200,6 @@ .entry-preview .entry-meta { display: flex; - justify-content: space-between; font-size: .5rem; padding: .5rem 0 0 0; flex-wrap: wrap; @@ -265,27 +270,25 @@ overflow: hidden; } - @media screen and (max-width:1024px) { + @media screen and (min-width:768px) { + .gridClass { + grid-template-columns: repeat(2, 1fr); + } + } + + @media screen and (max-width:767px) { .gridClass { grid-row-gap: 2rem; grid-column-gap: 0rem; grid-template-columns: repeat(1, 1fr); - + .entry-preview { display: block; } - + .thumbnail_box { min-width: 100%; } - } - - - } - - @media screen and (min-width:1025px) { - .gridClass { - grid-template-columns: repeat(2, 1fr); } } </style> -- Gitblit v1.9.1