From c7982af07ad92e6cafe72d96604ed63a8ca595d6 Mon Sep 17 00:00:00 2001
From: "zhangyumei.0319" <zhangyumei.0319@bytedance.com>
Date: Mon, 11 Dec 2023 14:14:58 +0800
Subject: [PATCH] docs: add contaction in VChart

---
 content/other/chart/index-en-US.md |  4 ++++
 content/other/chart/index.md       |  4 ++++
 src/styles/doc.scss                |  6 ++++++
 src/templates/postTemplate.js      | 11 +++++++++++
 4 files changed, 25 insertions(+)

diff --git a/content/other/chart/index-en-US.md b/content/other/chart/index-en-US.md
index 6ed4df4d08..f83e0e4b1e 100644
--- a/content/other/chart/index-en-US.md
+++ b/content/other/chart/index-en-US.md
@@ -161,3 +161,7 @@ For more information, please refer to the following two documents:
 
 - [VChart Theme Concept and Design Rules](https://visactor.io/vchart/guide/tutorial_docs/Theme/Theme_Concept_and_Design_Rules)
 - [VChart Theme Extension Package](https://visactor.io/vchart/guide/tutorial_docs/Theme/Theme_Extension)
+
+Contact VChart:
+```chartcontact 
+```
\ No newline at end of file
diff --git a/content/other/chart/index.md b/content/other/chart/index.md
index d98cb758f6..cec1265cd8 100644
--- a/content/other/chart/index.md
+++ b/content/other/chart/index.md
@@ -166,3 +166,7 @@ Semi Design 为 VChart 声明了数据色板对应的 20 个 token， 详见下
 
 - [VChart 主题概念和设计规范](https://visactor.io/vchart/guide/tutorial_docs/Theme/Theme_Concept_and_Design_Rules)
 - [VChart 扩展主题包](https://visactor.io/vchart/guide/tutorial_docs/Theme/Theme_Extension)
+
+联系 VChart：
+```chartcontact 
+```
\ No newline at end of file
diff --git a/src/styles/doc.scss b/src/styles/doc.scss
index 81060ede98..868fb5a3a0 100644
--- a/src/styles/doc.scss
+++ b/src/styles/doc.scss
@@ -116,6 +116,12 @@ a {
     }
 }
 
+.pre-chartcontact {
+    border: none;
+    background-color: transparent;
+} 
+
+
 .changelog {
     strong {
         background-color: var(--semi-color-danger-light-hover);
diff --git a/src/templates/postTemplate.js b/src/templates/postTemplate.js
index 5f29db137f..3abc7d19ee 100644
--- a/src/templates/postTemplate.js
+++ b/src/templates/postTemplate.js
@@ -135,6 +135,10 @@ const pre = ({ ...props }) => {
         return <Blocks.pre className={'pre-chart gatsby-overview'} {...props} />;
     }
 
+    if (props.children.props.className === 'language-chartcontact') {
+        return <Blocks.pre className={'pre-chartcontact gatsby-overview'} {...props} />;
+    }
+
     return <Blocks.pre {...props} />;
 };
 
@@ -151,6 +155,13 @@ const code = ({ ...props }) => {
         return <Charts code={props.children} zh={props.zh} />;
     }
 
+    if (props.className === 'language-chartcontact') {
+        return <>
+        <img src={'https://lf3-static.bytednsdoc.com/obj/eden-cn/ptlz_zlp/ljhwZthlaukjlkulzlp/vchart/contact_wechat.jpeg'} style={{width:250, height:250}}/>
+        <img src={'https://lf3-static.bytednsdoc.com/obj/eden-cn/ptlz_zlp/ljhwZthlaukjlkulzlp/vchart/contact_lark.jpeg'} style={{width:250, height:250}}/>
+     </>;
+    }
+
     const scope = {
         useEffect,
         useMemo,