feat: 聊天的样式调整

pages/loading/styles/loading.scss

@@ -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;

uni_modules/zero-markdown-view/components/zero-markdown-view/zero-markdown-view.vue

@@ -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: `
@@ -101,18 +105,21 @@ export default {
 				font-size: 24px;
 				text-align: center;
 				font-weight: bold;
-				color: ${themeColor};
+				color: ${themeColor};
+                font-family: ${fontFamily};
 				padding:3px 10px 1px;
 				border-bottom: 2px solid ${themeColor};
 				border-top-right-radius:3px;
-				border-top-left-radius:3px;
+				border-top-left-radius:3px;
+
 				`,
 				// 二级标题
 				h2: `
 				margin:6px 0;
 				font-size: 20px;
 				text-align:center;
-				color:${themeColor};
+				color:${themeColor};
+                font-family: ${fontFamily};
 				font-weight:bolder;
 				padding-left:10px;
 				// border:1px solid ${themeColor};
@@ -121,14 +128,16 @@ export default {
 				h3: `
 				margin:6px 0;
 				font-size: 18px;
-				color: ${themeColor};
+				color: ${themeColor};
+                font-family: ${fontFamily};
 				padding-left:10px;
 				border-left:3px solid ${themeColor};
 				`,
 				// 引用
 				blockquote: `
 				margin:6px 0;
-				font-size:15px;
+				font-size:15px;
+                font-family: ${fontFamily};
 				color: #777777;
 				border-left: 4px solid #dddddd;
 				padding: 0 10px;
@@ -149,11 +158,13 @@ export default {
 				// 加粗
 				strong: `
 				font-weight: border;
-				color: ${themeColor};
+				color: ${themeColor};
+                font-family: ${fontFamily};
 				`,
 				// 斜体
 				em: `
-				color: ${themeColor};
+				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;
+				p: `
+                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
@@ -309,4 +333,4 @@ export default {
 	padding: 0;
 	position: relative;
 }
-</style>
+</style>