feat: 聊天的样式调整

This commit is contained in:
zoujing
2025-09-02 17:44:22 +08:00
parent 663df81099
commit 537b7521e1
2 changed files with 56 additions and 32 deletions

View File

@@ -39,7 +39,7 @@
),
radial-gradient(75% 60% at center, var(--bg-color) 50%, transparent 50%);
padding: var(--p);
margin-right: 8px;
margin-right: 6px;
display: grid;
place-items: center;
position: relative;

View File

@@ -36,6 +36,10 @@ export default {
type: String,
default: '#2d2d2d'
},
fontFamily: {
type: String,
default: 'PingFang SC, PingFang SC'
},
aiMode: {
type: Boolean,
default: false
@@ -87,13 +91,13 @@ export default {
initTagStyle() {
const themeColor = this.themeColor
const codeBgColor = this.codeBgColor
const fontFamily = this.fontFamily
let zeroStyle = {
p: `
margin:6px;
margin:6px 0;
font-size: 15px;
line-height:1.75;
letter-spacing:0.2em;
word-spacing:0.1em;
line-height:1.65;
font-family: ${fontFamily};
`,
// 一级标题
h1: `
@@ -102,10 +106,12 @@ export default {
text-align: center;
font-weight: bold;
color: ${themeColor};
font-family: ${fontFamily};
padding:3px 10px 1px;
border-bottom: 2px solid ${themeColor};
border-top-right-radius:3px;
border-top-left-radius:3px;
`,
// 二级标题
h2: `
@@ -113,6 +119,7 @@ export default {
font-size: 20px;
text-align:center;
color:${themeColor};
font-family: ${fontFamily};
font-weight:bolder;
padding-left:10px;
// border:1px solid ${themeColor};
@@ -122,6 +129,7 @@ export default {
margin:6px 0;
font-size: 18px;
color: ${themeColor};
font-family: ${fontFamily};
padding-left:10px;
border-left:3px solid ${themeColor};
`,
@@ -129,6 +137,7 @@ export default {
blockquote: `
margin:6px 0;
font-size:15px;
font-family: ${fontFamily};
color: #777777;
border-left: 4px solid #dddddd;
padding: 0 10px;
@@ -150,10 +159,12 @@ export default {
strong: `
font-weight: border;
color: ${themeColor};
font-family: ${fontFamily};
`,
// 斜体
em: `
color: ${themeColor};
font-family: ${fontFamily};
letter-spacing:0.3em;
`,
// 分割线
@@ -194,57 +205,68 @@ export default {
initTagStyleForAi() {
const themeColor = this.themeColor
const codeBgColor = this.codeBgColor
const fontFamily = this.fontFamily
let zeroStyle = {
p: `
font-size: 16px;
margin:6px 0;
font-size: 15px;
line-height:1.55;
font-family: ${fontFamily};
`,
// 一级标题
h1: `
margin:6px 0;
font-size: 22px;
margin:4px 0;
font-size: 20px;
color: ${themeColor};
font-family: ${fontFamily};
`,
// 二级标题
h2: `
margin:6px 0;
font-size: 20px;
margin:4px 0;
font-size: 18px;
color: ${themeColor};
font-family: ${fontFamily};
`,
// 三级标题
h3: `
margin:6x 0;
font-size: 18px;
margin:4x 0;
font-size: 16px;
color: ${themeColor};
font-family: ${fontFamily};
`,
// 四级标题
h4: `
margin:6px 0;
font-size: 16px;
margin:4px 0;
font-size: 15px;
color: ${themeColor};
font-family: ${fontFamily};
`,
// 五级标题
h5: `
margin:6px 0;
font-size: 16px;
margin:4px 0;
font-size: 14px;
color: ${themeColor};
font-family: ${fontFamily};
`,
// 六级标题
h6: `
margin:6px 0;
font-size: 16px;
color: ${themeColor}
margin:4px 0;
font-size: 12px;
color: ${themeColor};
font-family: ${fontFamily};
`,
// 引用
blockquote: `
margin:6px 0;
margin:4px 0;
font-size:14px;
color: #777777;
border-left: 4px solid #dddddd;
padding: 0 10px;
font-family: ${fontFamily};
`,
// 列表
ul: `
margin: 6px 0;
margin: 4px 0;
color: #555;
`,
li: `
@@ -259,6 +281,7 @@ export default {
strong: `
font-weight: border;
color: ${themeColor};
font-family: ${fontFamily};
`,
// 斜体
em: `
@@ -272,14 +295,14 @@ export default {
border:none;
text-align:center;
background-image:linear-gradient(to right,rgba(248,57,41,0),${themeColor},rgba(248,57,41,0));
margin:8px 0;
margin:4px 0;
`,
// 表格
table: `
border-spacing:0;
overflow:auto;
min-width:100%;
margin:8px 0;
margin:4px 0;
border-collapse: collapse;
`,
th: `
@@ -296,6 +319,7 @@ export default {
background: ${codeBgColor};
font-size:12px;
position: relative;
font-family: ${fontFamily};
`,
}
this.tagStyle = zeroStyle