feat: 样式调整
This commit is contained in:
@@ -1,5 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<view class="flex flex-col bg-liner h-screen overflow-hidden">
|
<view class="flex flex-col bg-white h-screen overflow-hidden">
|
||||||
<!-- ✅ 顶部固定导航 -->
|
<!-- ✅ 顶部固定导航 -->
|
||||||
<view class="flex-shrink-0">
|
<view class="flex-shrink-0">
|
||||||
<TopNavBar :title="title" background="transparent" />
|
<TopNavBar :title="title" background="transparent" />
|
||||||
|
|||||||
@@ -20,7 +20,7 @@
|
|||||||
flex: 1;
|
flex: 1;
|
||||||
min-width: 0;
|
min-width: 0;
|
||||||
color: #111827;
|
color: #111827;
|
||||||
font-size: 20px;
|
font-size: 18px;
|
||||||
font-weight: 600;
|
font-weight: 600;
|
||||||
line-height: 28px;
|
line-height: 28px;
|
||||||
}
|
}
|
||||||
@@ -2,21 +2,21 @@
|
|||||||
<view v-if="longTextData?.values" class="w-full bg-white border-box border-ff overflow-hidden rounded-20 flex flex-col">
|
<view v-if="longTextData?.values" class="w-full bg-white border-box border-ff overflow-hidden rounded-20 flex flex-col">
|
||||||
<!-- 占位撑开 -->
|
<!-- 占位撑开 -->
|
||||||
<view class="w-vw"></view>
|
<view class="w-vw"></view>
|
||||||
<view class="flex flex-col px-16 pt-16 pb-12 border-box">
|
<view class="flex flex-col px-16 pt-16 pb-12 border-box" @click="lookDetailAction">
|
||||||
<view v-if="tag" class="long-answer-tag" :style="longAnswerTagStyle">{{ tag }}</view>
|
<view v-if="tag" class="long-answer-tag" :style="longAnswerTagStyle">{{ tag }}</view>
|
||||||
<view v-if="title" class="flex flex-row flex-items-start flex-justify-start mb-4">
|
<view v-if="title" class="flex flex-row flex-items-start flex-justify-start mb-4">
|
||||||
<text class="font-size-16 font-500 text-color-900"> {{ title }}</text>
|
<text class="font-size-16 font-600 text-color-900"> {{ title }}</text>
|
||||||
</view>
|
</view>
|
||||||
<!-- 文字内容,最多显示2行 -->
|
<!-- 文字内容,最多显示2行 -->
|
||||||
<view v-if="processedContent" class="answer-content font-size-12 font-color-600">
|
<view v-if="processedContent" class="answer-content font-size-12 font-color-600">
|
||||||
<ChatMarkdown :text="processedContent" />
|
<ChatMarkdown :text="processedContent" :fontColor="'#94A3B8'" />
|
||||||
</view>
|
</view>
|
||||||
<!-- 超过2行时显示...提示 -->
|
<!-- 超过2行时显示...提示 -->
|
||||||
<view v-if="!finish" class="flex flex-row flex-items-center mt-8">
|
<view v-if="!finish" class="flex flex-row flex-items-center mt-8">
|
||||||
<text class="font-size-12 font-400 font-color-600">正在生成</text>
|
<text class="font-size-12 font-400 font-color-600">正在生成</text>
|
||||||
<ChatLoading />
|
<ChatLoading />
|
||||||
</view>
|
</view>
|
||||||
<view v-if="isOverflow" class="flex flex-row flex-items-center flex-justify-between mt-4" @click="lookDetailAction">
|
<view v-if="isOverflow" class="flex flex-row flex-items-center flex-justify-between mt-12">
|
||||||
<text class="font-size-12 font-800 color-CBD5E1 mr-4">查看完整{{ tag }}</text>
|
<text class="font-size-12 font-800 color-CBD5E1 mr-4">查看完整{{ tag }}</text>
|
||||||
<uni-icons type="right" size="16" color="#CBD5E1"></uni-icons>
|
<uni-icons type="right" size="16" color="#CBD5E1"></uni-icons>
|
||||||
</view>
|
</view>
|
||||||
@@ -189,6 +189,7 @@ const lookDetailAction = () => {
|
|||||||
border-radius: 12px;
|
border-radius: 12px;
|
||||||
border: 1px solid transparent;
|
border: 1px solid transparent;
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
|
font-weight: 600;
|
||||||
line-height: 18px;
|
line-height: 18px;
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -105,8 +105,9 @@ export default {
|
|||||||
p: `
|
p: `
|
||||||
margin:4px 0;
|
margin:4px 0;
|
||||||
font-size: 15px;
|
font-size: 15px;
|
||||||
line-height:1.55;
|
line-height:1.85;
|
||||||
font-family: ${fontFamily};
|
font-family: ${fontFamily};
|
||||||
|
font-weight:500;
|
||||||
color: ${fontColor};
|
color: ${fontColor};
|
||||||
`,
|
`,
|
||||||
// 一级标题
|
// 一级标题
|
||||||
@@ -115,7 +116,7 @@ export default {
|
|||||||
font-size: 20px;
|
font-size: 20px;
|
||||||
line-height: 1.6;
|
line-height: 1.6;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
font-weight: bold;
|
font-weight: 900;
|
||||||
color: ${themeColor};
|
color: ${themeColor};
|
||||||
font-family: ${fontFamily};
|
font-family: ${fontFamily};
|
||||||
padding:6px 10px 4px;
|
padding:6px 10px 4px;
|
||||||
@@ -127,11 +128,11 @@ export default {
|
|||||||
h2: `
|
h2: `
|
||||||
margin:6px 0;
|
margin:6px 0;
|
||||||
font-size: 18px;
|
font-size: 18px;
|
||||||
line-height: 1.55;
|
line-height: 1.85;
|
||||||
text-align:center;
|
text-align:center;
|
||||||
color:${themeColor};
|
color:${themeColor};
|
||||||
font-family: ${fontFamily};
|
font-family: ${fontFamily};
|
||||||
font-weight:bolder;
|
font-weight:800;
|
||||||
padding-left:10px;
|
padding-left:10px;
|
||||||
// border:1px solid ${themeColor};
|
// border:1px solid ${themeColor};
|
||||||
`,
|
`,
|
||||||
@@ -139,9 +140,10 @@ export default {
|
|||||||
h3: `
|
h3: `
|
||||||
margin:6px 0;
|
margin:6px 0;
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
line-height: 1.5;
|
line-height: 1.85;
|
||||||
color: ${themeColor};
|
color: ${themeColor};
|
||||||
font-family: ${fontFamily};
|
font-family: ${fontFamily};
|
||||||
|
font-weight:700;
|
||||||
padding-left:10px;
|
padding-left:10px;
|
||||||
border-left:3px solid ${themeColor};
|
border-left:3px solid ${themeColor};
|
||||||
`,
|
`,
|
||||||
@@ -150,6 +152,7 @@ export default {
|
|||||||
margin:4px 0;
|
margin:4px 0;
|
||||||
font-size:15px;
|
font-size:15px;
|
||||||
font-family: ${fontFamily};
|
font-family: ${fontFamily};
|
||||||
|
font-weight:500;
|
||||||
color: #777777;
|
color: #777777;
|
||||||
border-left: 4px solid #dddddd;
|
border-left: 4px solid #dddddd;
|
||||||
padding: 0 10px;
|
padding: 0 10px;
|
||||||
@@ -157,11 +160,13 @@ export default {
|
|||||||
// 列表
|
// 列表
|
||||||
ul: `
|
ul: `
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
|
font-weight:500;
|
||||||
margin: 4px 0;
|
margin: 4px 0;
|
||||||
color: ${fontSubColor};
|
color: ${fontSubColor};
|
||||||
`,
|
`,
|
||||||
li: `
|
li: `
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
|
font-weight:500;
|
||||||
margin: 4px 0;
|
margin: 4px 0;
|
||||||
color: ${fontSubColor};
|
color: ${fontSubColor};
|
||||||
`,
|
`,
|
||||||
@@ -171,13 +176,14 @@ export default {
|
|||||||
`,
|
`,
|
||||||
// 加粗
|
// 加粗
|
||||||
strong: `
|
strong: `
|
||||||
font-weight: border;
|
font-weight: bold;
|
||||||
color: ${themeColor};
|
color: ${themeColor};
|
||||||
font-family: ${fontFamily};
|
font-family: ${fontFamily};
|
||||||
`,
|
`,
|
||||||
// 斜体
|
// 斜体
|
||||||
em: `
|
em: `
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
|
font-weight:500;
|
||||||
color: ${themeColor};
|
color: ${themeColor};
|
||||||
font-family: ${fontFamily};
|
font-family: ${fontFamily};
|
||||||
letter-spacing:0.3em;
|
letter-spacing:0.3em;
|
||||||
@@ -227,8 +233,9 @@ export default {
|
|||||||
p: `
|
p: `
|
||||||
margin:4px 0;
|
margin:4px 0;
|
||||||
font-size: 15px;
|
font-size: 15px;
|
||||||
line-height:1.55;
|
line-height:1.85;
|
||||||
font-family: ${fontFamily};
|
font-family: ${fontFamily};
|
||||||
|
font-weight:500;
|
||||||
color: ${fontColor};
|
color: ${fontColor};
|
||||||
`,
|
`,
|
||||||
// 一级标题
|
// 一级标题
|
||||||
@@ -238,22 +245,25 @@ export default {
|
|||||||
line-height: 1.6;
|
line-height: 1.6;
|
||||||
color: ${themeColor};
|
color: ${themeColor};
|
||||||
font-family: ${fontFamily};
|
font-family: ${fontFamily};
|
||||||
|
font-weight:900;
|
||||||
`,
|
`,
|
||||||
// 二级标题
|
// 二级标题
|
||||||
h2: `
|
h2: `
|
||||||
margin:6px 0;
|
margin:6px 0;
|
||||||
font-size: 18px;
|
font-size: 18px;
|
||||||
line-height: 1.55;
|
line-height: 1.85;
|
||||||
color: ${themeColor};
|
color: ${themeColor};
|
||||||
font-family: ${fontFamily};
|
font-family: ${fontFamily};
|
||||||
|
font-weight:800;
|
||||||
`,
|
`,
|
||||||
// 三级标题
|
// 三级标题
|
||||||
h3: `
|
h3: `
|
||||||
margin:6px 0;
|
margin:6px 0;
|
||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
line-height: 1.5;
|
line-height: 1.85;
|
||||||
color: ${themeColor};
|
color: ${themeColor};
|
||||||
font-family: ${fontFamily};
|
font-family: ${fontFamily};
|
||||||
|
font-weight:700;
|
||||||
`,
|
`,
|
||||||
// 四级标题
|
// 四级标题
|
||||||
h4: `
|
h4: `
|
||||||
@@ -261,6 +271,7 @@ export default {
|
|||||||
font-size: 15px;
|
font-size: 15px;
|
||||||
color: ${themeColor};
|
color: ${themeColor};
|
||||||
font-family: ${fontFamily};
|
font-family: ${fontFamily};
|
||||||
|
font-weight:600;
|
||||||
`,
|
`,
|
||||||
// 五级标题
|
// 五级标题
|
||||||
h5: `
|
h5: `
|
||||||
@@ -268,6 +279,7 @@ export default {
|
|||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
color: ${themeColor};
|
color: ${themeColor};
|
||||||
font-family: ${fontFamily};
|
font-family: ${fontFamily};
|
||||||
|
font-weight:500;
|
||||||
`,
|
`,
|
||||||
// 六级标题
|
// 六级标题
|
||||||
h6: `
|
h6: `
|
||||||
@@ -275,6 +287,7 @@ export default {
|
|||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
color: ${themeColor};
|
color: ${themeColor};
|
||||||
font-family: ${fontFamily};
|
font-family: ${fontFamily};
|
||||||
|
font-weight:500;
|
||||||
`,
|
`,
|
||||||
// 引用
|
// 引用
|
||||||
blockquote: `
|
blockquote: `
|
||||||
@@ -284,16 +297,21 @@ export default {
|
|||||||
border-left: 4px solid #dddddd;
|
border-left: 4px solid #dddddd;
|
||||||
padding: 0 10px;
|
padding: 0 10px;
|
||||||
font-family: ${fontFamily};
|
font-family: ${fontFamily};
|
||||||
|
font-weight:500;
|
||||||
`,
|
`,
|
||||||
// 列表
|
// 列表
|
||||||
ul: `
|
ul: `
|
||||||
margin: 4px 0;
|
margin: 4px 0;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
|
font-family: ${fontFamily};
|
||||||
|
font-weight:500;
|
||||||
color: ${fontSubColor};
|
color: ${fontSubColor};
|
||||||
`,
|
`,
|
||||||
li: `
|
li: `
|
||||||
margin: 4px 0;
|
margin: 4px 0;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
|
font-family: ${fontFamily};
|
||||||
|
font-weight:500;
|
||||||
color: ${fontSubColor};
|
color: ${fontSubColor};
|
||||||
`,
|
`,
|
||||||
// 链接
|
// 链接
|
||||||
@@ -302,12 +320,15 @@ export default {
|
|||||||
`,
|
`,
|
||||||
// 加粗
|
// 加粗
|
||||||
strong: `
|
strong: `
|
||||||
font-weight: border;
|
font-weight: bold;
|
||||||
color: ${themeColor};
|
color: ${themeColor};
|
||||||
font-family: ${fontFamily};
|
font-family: ${fontFamily};
|
||||||
`,
|
`,
|
||||||
// 斜体
|
// 斜体
|
||||||
em: `
|
em: `
|
||||||
|
font-size: 14px;
|
||||||
|
font-weight:500;
|
||||||
|
font-family: ${fontFamily};
|
||||||
color: ${themeColor};
|
color: ${themeColor};
|
||||||
letter-spacing:0.3em;
|
letter-spacing:0.3em;
|
||||||
`,
|
`,
|
||||||
|
|||||||
Reference in New Issue
Block a user