docs: add math & multi-file demo example

mizi-lin · Apr 21, 2020 · 164560a · 164560a
1 parent b5fd437
commit 164560a
Show file tree

Hide file tree

Showing 4 changed files with 29 additions and 8 deletions.
diff --git a/docs/demo/modal-content.jsx b/docs/demo/modal-content.jsx
@@ -0,0 +1,7 @@
+export default () => (
+  <>
+    <p>Some contents...</p>
+    <p>Some contents...</p>
+    <p>Some contents...</p>
+  </>
+);
diff --git a/docs/demo/modal.jsx b/docs/demo/modal.jsx
@@ -5,6 +5,8 @@
 
 import React from 'react';
 import { Button, Modal } from 'antd';
+import ModalContent from './modal-content';
+import './modal.less';
 
 class App extends React.Component {
   state = { visible: false };
@@ -40,10 +42,9 @@ class App extends React.Component {
           visible={this.state.visible}
           onOk={this.handleOk}
           onCancel={this.handleCancel}
+          className="example-modal-content"
         >
-          <p>Some contents...</p>
-          <p>Some contents...</p>
-          <p>Some contents...</p>
+          <ModalContent />
         </Modal>
       </div>
     );

diff --git a/docs/demo/modal.less b/docs/demo/modal.less
@@ -0,0 +1,3 @@
+.example-modal-content {
+  color: #f60;
+}
diff --git a/docs/examples.md b/docs/examples.md
@@ -11,7 +11,9 @@ toc: menu
 
 此页面列举了 dumi 渲染各项 Markdown 样式以及 Demo 的效果。
 
-## Demo 嵌入
+## 渲染 Demo
+
+### 代码块嵌入
 
 ```jsx
 import React from 'react';
@@ -20,14 +22,14 @@ import { Button } from 'antd';
 export default () => <Button type="primary">我是 antd 的按钮</Button>;
 ```
 
-## 外部 Demo
-
-<code src="./demo/modal.jsx" />
-
 ## TS 转 JS
 
 <code src="./demo/typescript.tsx" />
 
+## 多文件依赖
+
+<code src="./demo/modal.jsx" />
+
 # 一级标题
 
 ## 二级标题
@@ -88,6 +90,14 @@ _斜体样式_
 console.log('Hello World!');
 ```
 
+## 数学公式
+
+Lift($L$) can be determined by Lift Coefficient ($C_L$) like the following equation.
+
+$$
+L = \frac{1}{2} \rho v^2 S C_L
+$$
+
 ## 表格
 
 | 名词   | 解释                                                                         |