diff --git a/src/views/home/index.vue b/src/views/home/index.vue index 78daf40..db103a7 100644 --- a/src/views/home/index.vue +++ b/src/views/home/index.vue @@ -17,7 +17,7 @@ {{ hotList.right[index].title }} -

{{ hotList.right[index].content }}

+

MORE @@ -124,11 +124,11 @@ export default { const { data: { message, data } } = await carNewsHotList() if (message === 'success') { for (const iter of data.list) { - const { image, video, title, subTitle } = iter.news + const { image, video, title, detail } = iter.news this.hotList.left.push(video) this.hotList.right.push({ title: title, - content: subTitle, + content: detail, png: image }) } @@ -219,23 +219,24 @@ export default { #hot, #daliay { width: 100%; background: #E3E5EA; - display: flex; - align-items: center; - justify-content: center; +// display: flex; +// align-items: center; +// justify-content: center; padding: 25px 0; .content { width: 1200px; + margin: 0 auto; // height: 90%; - display: flex; - flex-direction: column; - justify-content: space-between; + // display: flex; + // flex-direction: column; + // justify-content: space-between; .top, .bottom { width: 100%; } .top { // min-height: 470px; // background: black; - display: flex; + // display: flex; // padding-bottom: 30px; :deep .el-carousel__button { width: 5px; @@ -243,7 +244,8 @@ export default { height: 5px; } .lr { - width: 50%; + // width: 50%; + width: 650px; height: 100%; video { width: 100%; @@ -275,13 +277,13 @@ export default { display: flex; align-items: center; flex-direction: column; - width: 50%; + width: 550px; padding: 0 40px; :deep .el-carousel__indicators--horizontal { left: 90%; } .txtcontent { - height: 50% !important; + // height: 50% !important; width:100%; padding-top: 20px; @@ -293,6 +295,7 @@ export default { width: 100%; display: flex; text-align: left; + margin-top: 30px; img { width: 60px; height: 28px; @@ -304,25 +307,29 @@ export default { } p { text-align: left; - width: 85%; + width: auto; font-size: 16px; font-weight: 400; line-height: 30px; color: #ffffff83; + margin-top: 25px; + word-wrap: break-word; } } .btn { - height: 20%; + // height: 20%; width:100%; position: relative; + text-align: left; .more { - position: absolute; - left: 0px; + // position: absolute; + // left: 0px; background: none !important; border: 1px solid #00F6BD; opacity: 0.8; border-radius: 4px; color: #00F6BD; + margin-top: 30px; } } } @@ -335,6 +342,11 @@ export default { } } } +#hot :deep .el-carousel__indicators--horizontal { + right: 50px; + left: auto; + bottom: 20px; +} #daliay { background: #F2F4F8; padding-top: 60px; @@ -376,7 +388,7 @@ export default { line-height: 30px; width: 100%; text-align: left; - margin-top: 10px; + margin-top: 30px; } } .btn {