74 lines
1.4 KiB
Vue
Executable File
74 lines
1.4 KiB
Vue
Executable File
<!-- 外部情报 > 情报详情 -->
|
||
<script setup lang="ts">
|
||
import AppNewsBox from '@/components/AppNewsBox.vue'
|
||
|
||
const props = defineProps({
|
||
title: String,
|
||
content: String,
|
||
tag: String,
|
||
tagColor: String,
|
||
source: String,
|
||
publishTime: String
|
||
})
|
||
</script>
|
||
|
||
<template>
|
||
<div class="news-wrapper">
|
||
<h1 class="title" v-if="title">
|
||
<AppNewsBox
|
||
:labelText="tag"
|
||
:labelColor="tagColor"
|
||
:text="title"
|
||
:size="tag === 'New' ? 'h20px' : 'h30px'"
|
||
class="text-35px"
|
||
/>
|
||
</h1>
|
||
<h2 class="sub-title">
|
||
<span v-if="source">来自：{{ source }} </span>
|
||
<span v-if="publishTime"> {{ publishTime }}</span>
|
||
</h2>
|
||
<div class="containers" v-html="content"></div>
|
||
</div>
|
||
</template>
|
||
<style>
|
||
.containers a {
|
||
line-break: anywhere;
|
||
}
|
||
</style>
|
||
<style scoped lang="less">
|
||
::deep(.containers) {
|
||
a {
|
||
line-break: anywhere;
|
||
}
|
||
}
|
||
.news-wrapper {
|
||
.title {
|
||
font-size: 22px;
|
||
text-align: center;
|
||
}
|
||
.sub-title {
|
||
text-align: center;
|
||
font-size: 16px;
|
||
color: #808696;
|
||
margin-top: 18px;
|
||
}
|
||
}
|
||
.containers {
|
||
// column-count: 2;
|
||
column-gap: 34px;
|
||
line-height: 2;
|
||
margin-top: 32px;
|
||
// max-width: 1062px;
|
||
:deep(img) {
|
||
// width: 100%;
|
||
// max-width: 500px;
|
||
border-radius: 6px;
|
||
margin-bottom: 24px;
|
||
max-width: 1060px;
|
||
}
|
||
:deep(p) {
|
||
// text-indent: 2em;
|
||
}
|
||
}
|
||
</style>
|