From f66466c763a0912385e706802ac7cd189db84326 Mon Sep 17 00:00:00 2001
From: Gitshaoxiang <1026025056@qq.com>
Date: Thu, 19 Mar 2020 20:02:35 +0800
Subject: [PATCH] change form style and fix some bug

---
 docs/assets/css/main-min.css |  43 ++++++------
 docs/en/core/basic.md        |  43 ++++++++++--
 docs/en/core/face_kit.md     |  69 ++++++++++++++++----
 docs/en/core/fire.md         |  69 ++++++++++++++++----
 docs/en/core/gray.md         |  62 ++++++++++++++----
 docs/en/core/m5go.md         |  62 ++++++++++++++----
 docs/en/core/m5go_lite.md    |  63 ++++++++++++++----
 docs/en/core/m5stickc.md     |   9 +++
 docs/index.html              |   4 +-
 docs/zh_CN/core/basic.md     |  72 +++++++++++++++++----
 docs/zh_CN/core/face_kit.md  |  60 ++++++++++++++---
 docs/zh_CN/core/fire.md      | 122 +++++++++++++++++++++++------------
 docs/zh_CN/core/gray.md      |  60 ++++++++++++++---
 docs/zh_CN/core/m5go.md      |  60 ++++++++++++++---
 docs/zh_CN/core/m5go_lite.md |  59 ++++++++++++++---
 docs/zh_CN/core/m5stickc.md  |  11 +++-
 16 files changed, 689 insertions(+), 179 deletions(-)

diff --git a/docs/assets/css/main-min.css b/docs/assets/css/main-min.css
index 7b164a23..9cb4a96e 100644
--- a/docs/assets/css/main-min.css
+++ b/docs/assets/css/main-min.css
@@ -31,15 +31,13 @@ img {
 
 .markdown-section {
 	max-width: 80%;
-	margin-top: 50px
+	margin-top: 50px;
+	padding: 2rem 10px 2rem 60px;
 }
 
 .markdown-section a {
-	color: var(--theme-color,#42b983)
-}
-
-.markdown-section iframe[src*="buttons.github.io"] {
-	margin: 0
+	/* color: var(--theme-color,#42b983) */
+	color: hsl(211, 100%, 50%);
 }
 
 body[data-page="zh_CN/uiflow/uiflow_home_page.md"] article.markdown-section {
@@ -1101,10 +1099,6 @@ mark {
 }
 
 
-
-
-
-
 .markdown-section h1 {
 	font-family: Montserrat;
 	font-weight: 1000;
@@ -1129,14 +1123,15 @@ mark {
 	margin-top: 5px;
 }
 
+
 /* Border styles */
-.table-1 thead, .table-1 tr {
+table thead, table tr {
     border-top-width: 1px;
     border-top-style: solid;
-    border-top-color: #aabfdc
+    border-top-color: #aabfdc;
 }
 
-.table-1 {
+table {
     border-bottom-width: 1px;
     border-bottom-style: solid;
     border-bottom-color: #aabfdc;
@@ -1144,30 +1139,30 @@ mark {
     border-top-style: solid;
     border-top-color: #aabfdc;
 	overflow: auto;
-    display: inline-block !important;
+    display: table !important;
     /* padding-bottom: 5px; */
 }
 
 /* Padding and font style */
-.table-1 td, .table-1 th {
+table td, table th {
     padding: 5px 10px;
-    font-size: 12px;
-    font-family: Verdana;
-	color: #597da1;
+    font-size: 13px;
+    font-family: Montserrat;
+	color: #597da1 !important;
 	border-color: hsl(212, 42%, 88%);
 }
 
 /* Alternating background colors */
-.table-1 tr:nth-child(even) {
-    background: #d3dfed
+table tr:nth-child(even) {
+    background: #d3dfed !important;
 }
-.table-1 tr:nth-child(odd) {
-    background: #FFF
+table tr:nth-child(odd) {
+    background: #FFF !important;
 }
 
 @media screen and (max-width:768px) {
-	.table-1 {
+	table {
 		display: block !important;
 		overflow: scroll;
 	}
-}
+}
\ No newline at end of file
diff --git a/docs/en/core/basic.md b/docs/en/core/basic.md
index 3267885a..2c31b3e4 100644
--- a/docs/en/core/basic.md
+++ b/docs/en/core/basic.md
@@ -239,12 +239,36 @@ GROVE Port A & IP5306
     </tbody>
 </table>
 
-**<mark>Notice1：M5PORT EXPLAIN</mark>**
-You can identify the port name and function by its color, red is PortA(21/22) mainly used for I2C, black is PortB(26/36) which can be used for DA/AD, Singel-bus communication, Blue is PortC(16/17) can be used for Uart. Correspondingly, most of the M5 Units have the Port with matched color for specify which port it should go in on the M5Core. 
-Those port identification is a convenience for UIFlow (Blockly)  Users. For advanced using ,you can do you own customization, since most of the PIN on ESP32 are remapping-able.
-Unfortunatly, PortA(red) can not be used as analog read in. It refers to GPIO 21 & 22 from ESP32, which doesn't have AD channel alternatives: 
+## M5PORT EXPLAIN
 
-<table class="table-1">
+<table>
+      <thead>
+         <th>PORT</th>
+         <th>PIN</th>
+         <th>Note:</th>
+      </thead>
+      <tbody>
+      <tr>
+         <td>PORT-A(Red)</td>
+         <td>G21/22</td>
+         <td>I2C</td>
+      </tr>
+      <tr>
+         <td>PORT-B(Black)</td>
+         <td>G26/36</td>
+         <td>DAC/ADC</td>
+      </tr>
+      <tr>
+         <td>PORT-C(Blue)</td>
+         <td>G16/17</td>
+         <td>UART</td>
+      </tr>
+    </tbody>
+</table>
+
+## ESP32 ADC/DAC
+
+<table>
       <thead>
          <th>ADC1</th>
          <th>ADC2</th>
@@ -267,7 +291,7 @@ Unfortunatly, PortA(red) can not be used as analog read in. It refers to GPIO 21
     </tbody>
 </table>
 
-For more information about Pin assignment and Pin Remapping, Please refer to EPS32 Datasheet
+For more information about Pin assignment and Pin Remapping, Please refer to [ESP32 Datasheet](https://m5stack.oss-cn-shenzhen.aliyuncs.com/resource/docs/datasheet/core/esp32_datasheet_en.pdf)
 
 ### Kit includes
 
@@ -283,7 +307,7 @@ For more information about Pin assignment and Pin Remapping, Please refer to EPS
 
 ## Version Change
 
-<table class="table-1">
+<table>
       <thead>
          <th>Release Date</th>
          <th>Product Change</th>
@@ -300,6 +324,11 @@ For more information about Pin assignment and Pin Remapping, Please refer to EPS
             <td>TN screen changed to IPS screen</td>
             <td>before use . pls upgrade your M5Stack lib to the latest version (after 0.2.8) to solve screen reverse color problem.</td>
          </tr>
+         <tr>
+            <td>2020.3</td>
+            <td>Battery capacity changed from 150mAh to 110mAh</td>
+            <td>/</td>
+         </tr>
     </tbody>
 </table>
 
diff --git a/docs/en/core/face_kit.md b/docs/en/core/face_kit.md
index 627ea312..5c725323 100644
--- a/docs/en/core/face_kit.md
+++ b/docs/en/core/face_kit.md
@@ -198,23 +198,66 @@ Other than 3 functional panels, this development kit comes with more stuff like
    </tr>
 </table>
 
+
+## M5PORT EXPLAIN
+
+<table>
+      <thead>
+         <th>PORT</th>
+         <th>PIN</th>
+         <th>Note:</th>
+      </thead>
+      <tbody>
+      <tr>
+         <td>PORT-A(Red)</td>
+         <td>G21/22</td>
+         <td>I2C</td>
+      </tr>
+      <tr>
+         <td>PORT-B(Black)</td>
+         <td>G26/36</td>
+         <td>DAC/ADC</td>
+      </tr>
+      <tr>
+         <td>PORT-C(Blue)</td>
+         <td>G16/17</td>
+         <td>UART</td>
+      </tr>
+    </tbody>
+</table>
+
+## ESP32 ADC/DAC
+
+<table>
+      <thead>
+         <th>ADC1</th>
+         <th>ADC2</th>
+         <th>DAC1</th>
+         <th>DAC2</th>
+      </thead>
+      <tbody>
+      <tr>
+         <td>8 channels</td>
+         <td>10 channels</td>
+         <td>2 channels</td>
+         <td>2 channels</td>  
+      </tr>
+      <tr>
+         <td>G32-39</td>
+         <td>G0/2/4/12-15/25-27</td>
+         <td>G25</td>
+         <td>G26</td>
+      </tr>
+    </tbody>
+</table>
+
+For more information about Pin assignment and Pin Remapping, Please refer to [ESP32 Datasheet](https://m5stack.oss-cn-shenzhen.aliyuncs.com/resource/docs/datasheet/core/esp32_datasheet_en.pdf)
+
+
 ## Example
 
 - [Example](https://github.com/m5stack/M5Stack/tree/master/examples/Modules/FACES)
 
-**<mark>Notice1：M5PORT EXPLAIN</mark>**<br>
-You can identify the port name and function by its color, red is PortA(21/22) mainly used for I2C, black is PortB(26/36) which can be used for DA/AD, Single-bus communication, Blue is PortC(16/17) which can be used for Uart. Correspondingly, most of the M5 Units have the Port with matched color to specify which port it should go in on the M5Core. 
-Those port identifications are a convenience for UIFlow (Blockly) users. For advanced users ,you can do your own customization, since most of the PIN on ESP32 are remap-able.
-Unfortunatly, PortA(red) can not be used as analog read in. It refers to GPIO 21 & 22 from ESP32, which doesn't have AD channel alternatives: 
-
-- ADC1(8 channels atteched to GPIOs 32-39)
-- ADC2(10 channels atteched to GPIOs 0，2，4，12-15，25-27)
-
-To use AD read function : 
-1, Use Dupont cable refers to the pins on the side which can be used as an AD channel.
-2, Get a M5GO bottom, which comes with a PortB.
-3, Get a PbHUB and connect it with PortA, then you can have 6 PortBs.
-For more information about Pin assignment and Pin Remapping, Please refer to EPS32 Datasheet
 <br>
 **<mark>Notice3：Face Kit factory test code</mark>**<br>
 The error message displayed on the screen, is actually normal, it doesn't mean something wrong with the hardware, it means that the main.py file is missing, but you can add your own, don't worry. <br>
diff --git a/docs/en/core/fire.md b/docs/en/core/fire.md
index cad0c49e..60cf18d2 100644
--- a/docs/en/core/fire.md
+++ b/docs/en/core/fire.md
@@ -90,7 +90,7 @@ TF card Maximum size 16GB
 
 <table>
  <tr><td>ESP32 Chip</td><td>GPIO39</td><td>GPIO38</td><td>GPIO37</td><td>GPIO25</td></tr>
- <tr><td>Button Pin</td><td>BUTTON A</td><td>BUTTON B</td><td>BUTTON C</td></tr>
+ <tr><td>Button Pin</td><td>BUTTON A</td><td>BUTTON B</td><td>BUTTON C</td><td>/</td></tr>
  <tr><td>Speaker</td><td> </td><td> </td><td> </td><td>Speaker Pin</td></tr>
 </table>
 
@@ -235,19 +235,59 @@ BMM150 I2C address 0x10
    </tr>
 </table>
 
-**<mark>Notice1：M5PORT EXPLAIN </mark>**
-You can identify the port name and function by its color, red is PortA(21/22) mainly used for I2C, black is PortB(26/36) which can be used for DA/AD, Singel-bus communication, Blue is PortC(16/17) can be used for Uart. Correspondingly, most of the M5 Units have the Port with matched color for specify which port it should go in on the M5Core. 
-Those port identification is a convenience for UIFlow (Blockly)  Users. For advanced using ,you can do you own customization, since most of the PIN on ESP32 are remapping-able.
-Unfortunatly, PortA(red) can not be used as analog read in. It refers to GPIO 21 & 22 from ESP32, which doesn't have AD channel alternatives:
+## M5PORT EXPLAIN
 
-- ADC1(8 channels atteched to GPIOs 32-39)
-- ADC2(10 channels atteched to GPIOs 0，2，4，12-15，25-27)
+<table>
+      <thead>
+         <th>PORT</th>
+         <th>PIN</th>
+         <th>Note:</th>
+      </thead>
+      <tbody>
+      <tr>
+         <td>PORT-A(Red)</td>
+         <td>G21/22</td>
+         <td>I2C</td>
+      </tr>
+      <tr>
+         <td>PORT-B(Black)</td>
+         <td>G26/36</td>
+         <td>DAC/ADC</td>
+      </tr>
+      <tr>
+         <td>PORT-C(Blue)</td>
+         <td>G16/17</td>
+         <td>UART</td>
+      </tr>
+    </tbody>
+</table>
 
-To use AD read function : 
-1, Use Dupont cable refers to the pins on the side which can be used as an AD channel.
-2, Get a M5GO bottom, which comes with a PortB.
-3, Get a PbHUB and connect it with PortA, then you can have 6 PortBs.
-For more information about Pin assignment and Pin Remapping, Please refer to EPS32 Datasheet
+## ESP32 ADC/DAC
+
+<table>
+      <thead>
+         <th>ADC1</th>
+         <th>ADC2</th>
+         <th>DAC1</th>
+         <th>DAC2</th>
+      </thead>
+      <tbody>
+      <tr>
+         <td>8 channels</td>
+         <td>10 channels</td>
+         <td>2 channels</td>
+         <td>2 channels</td>  
+      </tr>
+      <tr>
+         <td>G32-39</td>
+         <td>G0/2/4/12-15/25-27</td>
+         <td>G25</td>
+         <td>G26</td>
+      </tr>
+    </tbody>
+</table>
+
+For more information about Pin assignment and Pin Remapping, Please refer to [ESP32 Datasheet](https://m5stack.oss-cn-shenzhen.aliyuncs.com/resource/docs/datasheet/core/esp32_datasheet_en.pdf)
 
 ## Include
 
@@ -284,24 +324,29 @@ For more information about Pin assignment and Pin Remapping, Please refer to EPS
         <tr>
             <th>Release Date</th>
             <th>Product Change</th>
+            <th>Note:</th>
         </tr>
         </thead>    
         <tbody>
         <tr>
             <td>2018.6</td>
             <td>Initial public release</td>
+            <td>/</td>
         </tr>
         <tr>
             <td>2019.7</td>
             <td>MPU9250 changed to SH200Q+BMM150, TN screen changed to IPS screen</td>
+            <td>before use . pls upgrade your M5Stack lib to the latest version (after 0.2.8) to solve screen reverse color problem.</td>
         </tr>
         <tr>
             <td>2019.8</td>
             <td>SH200Q changed to MPU6886</td>
+            <td>/</td>
         </tr>
         <tr>
             <td>2019.11</td>
             <td>Battery capacity changed from 600mAh to 500mAh</td>
+            <td>/</td>
         </tr>
         <tbody>
     </table>
diff --git a/docs/en/core/gray.md b/docs/en/core/gray.md
index cd199285..6e0d889b 100644
--- a/docs/en/core/gray.md
+++ b/docs/en/core/gray.md
@@ -211,19 +211,59 @@ BMM150 I2C address 0x10
    </tr>
 </table>
 
-**<mark>Notice1：M5PORT EXPLAIN</mark>**
-You can identify the port name and function by its color, red is PortA(21/22) mainly used for I2C, black is PortB(26/36) which can be used for DA/AD, Singel-bus communication, Blue is PortC(16/17) can be used for Uart. Correspondingly, most of the M5 Units have the Port with matched color for specify which port it should go in on the M5Core. 
-Those port identification is a convenience for UIFlow (Blockly)  Users. For advanced using ,you can do you own customization, since most of the PIN on ESP32 are remapping-able.
-Unfortunatly, PortA(red) can not be used as analog read in. It refers to GPIO 21 & 22 from ESP32, which doesn't have AD channel alternatives: 
+## M5PORT EXPLAIN
 
-- ADC1(8 channels atteched to GPIOs 32-39)
-- ADC2(10 channels atteched to GPIOs 0，2，4，12-15，25-27)
+<table>
+      <thead>
+         <th>PORT</th>
+         <th>PIN</th>
+         <th>Note:</th>
+      </thead>
+      <tbody>
+      <tr>
+         <td>PORT-A(Red)</td>
+         <td>G21/22</td>
+         <td>I2C</td>
+      </tr>
+      <tr>
+         <td>PORT-B(Black)</td>
+         <td>G26/36</td>
+         <td>DAC/ADC</td>
+      </tr>
+      <tr>
+         <td>PORT-C(Blue)</td>
+         <td>G16/17</td>
+         <td>UART</td>
+      </tr>
+    </tbody>
+</table>
 
-To use AD read function : 
-1, Use Dupont cable refers to the pins on the side which can be used as an AD channel.
-2, Get a M5GO bottom, which comes with a PortB.
-3, Get a PbHUB and connect it with PortA, then you can have 6 PortBs.
-For more information about Pin assignment and Pin Remapping, Please refer to EPS32 Datasheet
+## ESP32 ADC/DAC
+
+<table>
+      <thead>
+         <th>ADC1</th>
+         <th>ADC2</th>
+         <th>DAC1</th>
+         <th>DAC2</th>
+      </thead>
+      <tbody>
+      <tr>
+         <td>8 channels</td>
+         <td>10 channels</td>
+         <td>2 channels</td>
+         <td>2 channels</td>  
+      </tr>
+      <tr>
+         <td>G32-39</td>
+         <td>G0/2/4/12-15/25-27</td>
+         <td>G25</td>
+         <td>G26</td>
+      </tr>
+    </tbody>
+</table>
+
+For more information about Pin assignment and Pin Remapping, Please refer to [ESP32 Datasheet](https://m5stack.oss-cn-shenzhen.aliyuncs.com/resource/docs/datasheet/core/esp32_datasheet_en.pdf)
 
 ## Include
 -  1x Gray
diff --git a/docs/en/core/m5go.md b/docs/en/core/m5go.md
index 6bed9b5b..9cb95550 100644
--- a/docs/en/core/m5go.md
+++ b/docs/en/core/m5go.md
@@ -230,19 +230,59 @@ BMM150 I2C address 0x10
 </table>
 
 
-**<mark>Notice1：M5PORT EXPLAIN</mark>**
-You can identify the port name and function by its color, red is PortA(21/22) mainly used for I2C, black is PortB(26/36) which can be used for DA/AD, Singel-bus communication, Blue is PortC(16/17) can be used for Uart. Correspondingly, most of the M5 Units have the Port with matched color for specify which port it should go in on the M5Core. 
-Those port identification is a convenience for UIFlow (Blockly)  Users. For advanced using ,you can do you own customization, since most of the PIN on ESP32 are remapping-able.
-Unfortunatly, PortA(red) can not be used as analog read in. It refers to GPIO 21 & 22 from ESP32, which doesn't have AD channel alternatives: 
+## M5PORT EXPLAIN
 
-- ADC1(8 channels atteched to GPIOs 32-39)
-- ADC2(10 channels atteched to GPIOs 0，2，4，12-15，25-27)
+<table>
+      <thead>
+         <th>PORT</th>
+         <th>PIN</th>
+         <th>Note:</th>
+      </thead>
+      <tbody>
+      <tr>
+         <td>PORT-A(Red)</td>
+         <td>G21/22</td>
+         <td>I2C</td>
+      </tr>
+      <tr>
+         <td>PORT-B(Black)</td>
+         <td>G26/36</td>
+         <td>DAC/ADC</td>
+      </tr>
+      <tr>
+         <td>PORT-C(Blue)</td>
+         <td>G16/17</td>
+         <td>UART</td>
+      </tr>
+    </tbody>
+</table>
 
-To use AD read function : <br>
-1, Use Dupont cable refers to the pins on the side which can be used as an AD channel.
-2, Get a M5GO bottom, which comes with a PortB.
-3, Get a PbHUB and connect it with PortA, then you can have 6 PortBs.
-For more information about Pin assignment and Pin Remapping, Please refer to EPS32 Datasheet
+## ESP32 ADC/DAC
+
+<table>
+      <thead>
+         <th>ADC1</th>
+         <th>ADC2</th>
+         <th>DAC1</th>
+         <th>DAC2</th>
+      </thead>
+      <tbody>
+      <tr>
+         <td>8 channels</td>
+         <td>10 channels</td>
+         <td>2 channels</td>
+         <td>2 channels</td>  
+      </tr>
+      <tr>
+         <td>G32-39</td>
+         <td>G0/2/4/12-15/25-27</td>
+         <td>G25</td>
+         <td>G26</td>
+      </tr>
+    </tbody>
+</table>
+
+For more information about Pin assignment and Pin Remapping, Please refer to [ESP32 Datasheet](https://m5stack.oss-cn-shenzhen.aliyuncs.com/resource/docs/datasheet/core/esp32_datasheet_en.pdf)
 
 ## Include
 
diff --git a/docs/en/core/m5go_lite.md b/docs/en/core/m5go_lite.md
index 9f417065..25c74e85 100644
--- a/docs/en/core/m5go_lite.md
+++ b/docs/en/core/m5go_lite.md
@@ -228,19 +228,60 @@ BMM150 I2C address 0x10
    </tr>
 </table>
 
-**<mark>Notice1：M5PORT EXPLAIN</mark>**
-You can identify the port name and function by its color, red is PortA(21/22) mainly used for I2C, black is PortB(26/36) which can be used for DA/AD, Singel-bus communication, Blue is PortC(16/17) can be used for Uart. Correspondingly, most of the M5 Units have the Port with matched color for specify which port it should go in on the M5Core. 
-Those port identification is a convenience for UIFlow (Blockly)  Users. For advanced using ,you can do you own customization, since most of the PIN on ESP32 are remapping-able.
-Unfortunatly, PortA(red) can not be used as analog read in. It refers to GPIO 21 & 22 from ESP32, which doesn't have AD channel alternatives:
 
-- ADC1(8 channels atteched to GPIOs 32-39)
-- ADC2(10 channels atteched to GPIOs 0，2，4，12-15，25-27)
+## M5PORT EXPLAIN
 
-To use AD read function : 
-1, Use Dupont cable refers to the pins on the side which can be used as an AD channel.
-2, Get a M5GO bottom, which comes with a PortB.
-3, Get a PbHUB and connect it with PortA, then you can have 6 PortBs.
-For more information about Pin assignment and Pin Remapping, Please refer to EPS32 Datasheet
+<table>
+      <thead>
+         <th>PORT</th>
+         <th>PIN</th>
+         <th>Note:</th>
+      </thead>
+      <tbody>
+      <tr>
+         <td>PORT-A(Red)</td>
+         <td>G21/22</td>
+         <td>I2C</td>
+      </tr>
+      <tr>
+         <td>PORT-B(Black)</td>
+         <td>G26/36</td>
+         <td>DAC/ADC</td>
+      </tr>
+      <tr>
+         <td>PORT-C(Blue)</td>
+         <td>G16/17</td>
+         <td>UART</td>
+      </tr>
+    </tbody>
+</table>
+
+## ESP32 ADC/DAC
+
+<table>
+      <thead>
+         <th>ADC1</th>
+         <th>ADC2</th>
+         <th>DAC1</th>
+         <th>DAC2</th>
+      </thead>
+      <tbody>
+      <tr>
+         <td>8 channels</td>
+         <td>10 channels</td>
+         <td>2 channels</td>
+         <td>2 channels</td>  
+      </tr>
+      <tr>
+         <td>G32-39</td>
+         <td>G0/2/4/12-15/25-27</td>
+         <td>G25</td>
+         <td>G26</td>
+      </tr>
+    </tbody>
+</table>
+
+For more information about Pin assignment and Pin Remapping, Please refer to [ESP32 Datasheet](https://m5stack.oss-cn-shenzhen.aliyuncs.com/resource/docs/datasheet/core/esp32_datasheet_en.pdf)
 
 ## Package Includes:
 
diff --git a/docs/en/core/m5stickc.md b/docs/en/core/m5stickc.md
index 37a6e029..243ef32f 100644
--- a/docs/en/core/m5stickc.md
+++ b/docs/en/core/m5stickc.md
@@ -175,20 +175,29 @@ Resolution：80 * 160
         <tr>
             <th>Release Date</th>
             <th>Product Change</th>
+            <th>Note：</th>
         </tr>
         </thead>    
         <tbody>
         <tr>
             <td>2019.3</td>
             <td>Initial public release</td>
+            <th>/</th>
         </tr>
         <tr>
             <td>2019.8</td>
             <td>SH200Q changed to MPU6886</td>
+            <th>/</th>
         </tr>
         <tr>
             <td>2019.10</td>
             <td>Upgrade the bottom and add copper nuts</td>
+            <th>/</th>
+        </tr>
+        <tr>
+            <td>2020.3</td>
+            <td>Battery capacity changed from 80mAh to 95mAh</td>
+            <td>/</td>
         </tr>
         <tbody>
     </table>
diff --git a/docs/index.html b/docs/index.html
index 78666e46..70eefaa9 100755
--- a/docs/index.html
+++ b/docs/index.html
@@ -25,7 +25,7 @@
         //加载状态为complete时隐藏loading效果
         function completeLoading() {
             if (document.readyState == "complete") {
-                var loadingMask = document.getElementById('loading');  
+                var loadingMask = document.getElementById('loading');
                 loadingMask.style.display = 'none';
                 // loadingMask.parentNode.removeChild(loadingMask);  
             }
@@ -492,6 +492,7 @@ function creat_pdf() {
   $('html, body').animate({scrollTop: 0}, 0); 
   $(".anchor-box").css("display","none");
   $(".related_links").css("display","none");
+  $(".easyloader-box").css("display","none");
   var target = document.getElementsByClassName("#main")[0];
   html2canvas(target, {
     onrendered:function(canvas) {
@@ -535,6 +536,7 @@ function creat_pdf() {
   })
      $(".anchor-box").removeAttr("style");
      $(".related_links").removeAttr("style");
+     $(".easyloader-box").removeAttr("style");
 }
 </script>
 
diff --git a/docs/zh_CN/core/basic.md b/docs/zh_CN/core/basic.md
index 1a31cb4d..6073299f 100644
--- a/docs/zh_CN/core/basic.md
+++ b/docs/zh_CN/core/basic.md
@@ -75,7 +75,7 @@ M5Stack Basic 由两个可分离部分堆叠组成. 顶部放置了电路板，
 
 <table>
  <tr><td>ESP32 Chip</td><td>GPIO39</td><td>GPIO38</td><td>GPIO37</td><td>GPIO25</td></tr>
- <tr><td>按键引脚</td><td>BUTTON A</td><td>BUTTON B</td><td>BUTTON C</td></tr>
+ <tr><td>按键引脚</td><td>BUTTON A</td><td>BUTTON B</td><td>BUTTON C</td><td>  /</td></tr>
  <tr><td>喇叭</td><td> </td><td> </td><td> </td><td>DA PIN</td></tr>
 </table>
 
@@ -173,18 +173,60 @@ M5Stack Basic 由两个可分离部分堆叠组成. 顶部放置了电路板，
    </tr>
 </table>
 
-**<mark>Notice：M5PORT 说明 </mark>**
-*不同颜色的GROVE端口分别代表不同的功能.红色的PortA（21/22），为默认的I2C协议接口，黑色的PortB（26/36）, 支持DA/AD转换与信号总线通信.蓝色的PortC（16/17）, 支持Uart串口通信.在使用Unit进行功能拓展的时候，只需要匹配二者的端口的颜色，相应的进行连接即可正常使用.不仅提供简洁的硬件连接方式，还支持引脚的重映射.PortA（红色）被作为信号总线连接至是ESP32的GPIO21/22 ，没有AD通道转换方案，因此不能用作模拟输入使用.
+## M5端口说明
 
-- ADC1(8 通道 GPIO 32-39)
-- ADC2(10 通道 GPIO 0，2，4，12-15，25-27)
-- 2个8-bit DAC通道, GPIO25 (通道1) 和 GPIO26 (通道2)
+<table>
+      <thead>
+         <th>PORT</th>
+         <th>PIN</th>
+         <th>备注:</th>
+      </thead>
+      <tbody>
+      <tr>
+         <td>PORT-A(红色)</td>
+         <td>G21/22</td>
+         <td>I2C</td>
+      </tr>
+      <tr>
+         <td>PORT-B(黑色)</td>
+         <td>G26/36</td>
+         <td>DAC/ADC</td>
+      </tr>
+      <tr>
+         <td>PORT-C(蓝色)</td>
+         <td>G16/17</td>
+         <td>UART</td>
+      </tr>
+    </tbody>
+</table>
+
+## ESP32 ADC/DAC
+
+<table>
+      <thead>
+         <th>ADC1</th>
+         <th>ADC2</th>
+         <th>DAC1</th>
+         <th>DAC2</th>
+      </thead>
+      <tbody>
+      <tr>
+         <td>8 通道</td>
+         <td>10 通道</td>
+         <td>2 通道</td>
+         <td>2 通道</td>  
+      </tr>
+      <tr>
+         <td>G32-39</td>
+         <td>G0/2/4/12-15/25-27</td>
+         <td>G25</td>
+         <td>G26</td>
+      </tr>
+    </tbody>
+</table>
+
+有关引脚分配和引脚重新映射的更多信息，请参考[ESP32 datasheet](https://m5stack.oss-cn-shenzhen.aliyuncs.com/resource/docs/datasheet/core/esp32_datasheet_cn.pdf)
 
-使用AD读取功能:
-1，使用杜邦线连接机身侧面的能够AD转换的引脚.
-2，堆叠一个M5GO底座，使用其提供PortB.
-3，使用PbHUB连接至PortA，拓展出6个PortB.
-有关引脚分配和引脚重映射的更多信息，请查阅[ESP32数据手册](https://www.espressif.com/sites/default/files/documentation/esp32_datasheet_cn.pdf)
 
 ## 套件清单
 
@@ -210,17 +252,25 @@ M5Stack Basic 由两个可分离部分堆叠组成. 顶部放置了电路板，
         <tr> 
             <th>上市日期</th>
             <th>产品变动</th>
+            <th>备注：</th>
         </tr>
         </thead>    
         <tbody>
         <tr>
             <td>2017.7</td>
             <td>首次发售</td>
+            <td>/</td>
         </tr>
         <tr>
             <td>2019.7</td>
             <td>TN屏幕变更为IPS屏幕</td>
+            <td>请将您的M5Stack库升级到最新版本（v0.2.8以上），以解决屏幕反色问题。</td>
         </tr>
+         <tr>
+            <td>2020.3</td>
+            <td>电池容量150mAh变更为110mAh</td>
+            <td>/</td>
+         </tr>
         <tbody>
     </table>
 </div>
diff --git a/docs/zh_CN/core/face_kit.md b/docs/zh_CN/core/face_kit.md
index 88a02054..ab59cb00 100644
--- a/docs/zh_CN/core/face_kit.md
+++ b/docs/zh_CN/core/face_kit.md
@@ -177,17 +177,59 @@ ESPTool烧录游戏教程：https://docs.m5stack.com/#/zh_CN/quick_start/faces/g
 
 <img src="assets\img\product_pics\app\mega328_isp.png" width="30%" height="30%">
 
-**<mark>Notice：M5PORT 说明 </mark>**
-*不同颜色的GROVE端口分别代表不同的功能.红色的PortA（21/22），为默认的I2C协议接口，黑色的PortB（26/36）, 支持DA/AD转换与信号总线通信.蓝色的PortC（16/17）, 支持Uart串口通信.在使用Unit进行功能拓展的时候，只需要匹配二者的端口的颜色，相应的进行连接即可正常使用.不仅提供简洁的硬件连接方式，还支持引脚的重映射.PortA（红色）被作为信号总线连接至是ESP32的GPIO21/22 ，没有AD通道转换方案，因此不能用作模拟输入使用.
+## M5端口说明
 
-- ADC1(8 通道 GPIO 32-39)
-- ADC2(10 通道 GPIO 0，2，4，12-15，25-27)
+<table>
+      <thead>
+         <th>PORT</th>
+         <th>PIN</th>
+         <th>备注:</th>
+      </thead>
+      <tbody>
+      <tr>
+         <td>PORT-A(红色)</td>
+         <td>G21/22</td>
+         <td>I2C</td>
+      </tr>
+      <tr>
+         <td>PORT-B(黑色)</td>
+         <td>G26/36</td>
+         <td>DAC/ADC</td>
+      </tr>
+      <tr>
+         <td>PORT-C(蓝色)</td>
+         <td>G16/17</td>
+         <td>UART</td>
+      </tr>
+    </tbody>
+</table>
 
-使用AD读取功能:
-1，使用杜邦线连接机身侧面的能够AD转换的引脚.
-2，堆叠一个M5GO底座，使用其提供PortB.
-3，使用PbHUB连接至PortA，拓展出6个PortB.
-有关引脚分配和引脚重映射的更多信息，请查阅[ESP32数据手册](https://www.espressif.com/sites/default/files/documentation/esp32_datasheet_cn.pdf)
+## ESP32 ADC/DAC
+
+<table>
+      <thead>
+         <th>ADC1</th>
+         <th>ADC2</th>
+         <th>DAC1</th>
+         <th>DAC2</th>
+      </thead>
+      <tbody>
+      <tr>
+         <td>8 通道</td>
+         <td>10 通道</td>
+         <td>2 通道</td>
+         <td>2 通道</td>  
+      </tr>
+      <tr>
+         <td>G32-39</td>
+         <td>G0/2/4/12-15/25-27</td>
+         <td>G25</td>
+         <td>G26</td>
+      </tr>
+    </tbody>
+</table>
+
+有关引脚分配和引脚重新映射的更多信息，请参考[ESP32 datasheet](https://m5stack.oss-cn-shenzhen.aliyuncs.com/resource/docs/datasheet/core/esp32_datasheet_cn.pdf)
 
 <br>
 **<mark>注意3：Face Kit 出厂程序</mark>**<br>
diff --git a/docs/zh_CN/core/fire.md b/docs/zh_CN/core/fire.md
index b9fe40f3..d1140f27 100644
--- a/docs/zh_CN/core/fire.md
+++ b/docs/zh_CN/core/fire.md
@@ -243,18 +243,59 @@ BMM150 I2C address 0x10
 </table>
 
 
-**<mark>Notice：M5PORT 说明 </mark>**
-*不同颜色的GROVE端口分别代表不同的功能.红色的PortA（21/22），为默认的I2C协议接口，黑色的PortB（26/36）, 支持DA/AD转换与信号总线通信.蓝色的PortC（16/17）, 支持Uart串口通信.在使用Unit进行功能拓展的时候，只需要匹配二者的端口的颜色，相应的进行连接即可正常使用.不仅提供简洁的硬件连接方式，还支持引脚的重映射.PortA（红色）被作为信号总线连接至是ESP32的GPIO21/22 ，没有AD通道转换方案，因此不能用作模拟输入使用.
+## M5端口说明
 
-- ADC1(8 通道 GPIO 32-39)
-- ADC2(10 通道 GPIO 0，2，4，12-15，25-27)
+<table>
+      <thead>
+         <th>PORT</th>
+         <th>PIN</th>
+         <th>备注:</th>
+      </thead>
+      <tbody>
+      <tr>
+         <td>PORT-A(红色)</td>
+         <td>G21/22</td>
+         <td>I2C</td>
+      </tr>
+      <tr>
+         <td>PORT-B(黑色)</td>
+         <td>G26/36</td>
+         <td>DAC/ADC</td>
+      </tr>
+      <tr>
+         <td>PORT-C(蓝色)</td>
+         <td>G16/17</td>
+         <td>UART</td>
+      </tr>
+    </tbody>
+</table>
 
-使用AD读取功能:
-1，使用杜邦线连接机身侧面的能够AD转换的引脚.
-2，堆叠一个M5GO底座，使用其提供PortB.
-3，使用PbHUB连接至PortA，拓展出6个PortB.
-有关引脚分配和引脚重映射的更多信息，请查阅[ESP32数据手册](https://www.espressif.com/sites/default/files/documentation/esp32_datasheet_cn.pdf)
+## ESP32 ADC/DAC
 
+<table>
+      <thead>
+         <th>ADC1</th>
+         <th>ADC2</th>
+         <th>DAC1</th>
+         <th>DAC2</th>
+      </thead>
+      <tbody>
+      <tr>
+         <td>8 通道</td>
+         <td>10 通道</td>
+         <td>2 通道</td>
+         <td>2 通道</td>  
+      </tr>
+      <tr>
+         <td>G32-39</td>
+         <td>G0/2/4/12-15/25-27</td>
+         <td>G25</td>
+         <td>G26</td>
+      </tr>
+    </tbody>
+</table>
+
+有关引脚分配和引脚重新映射的更多信息，请参考[ESP32 datasheet](https://m5stack.oss-cn-shenzhen.aliyuncs.com/resource/docs/datasheet/core/esp32_datasheet_cn.pdf)
 
 ## 包含
 
@@ -290,41 +331,40 @@ BMM150 I2C address 0x10
 
 - [例程](https://github.com/m5stack/M5Stack/tree/master/examples/Basics)
 
-## UIFlow使用介绍
-
-<a href="#zh_CN/uiflow/uiflow_home_page.md"><button type="button" class="btn btn-primary">查看UIFlow介绍</button></a>
-
 
 ## 版本变更
 
-<div class="table-wrapper">
-    <table class="fl-table">
-        <thead>
-        <tr>
-            <th>上市日期</th>
-            <th>产品变动</th>
-        </tr>
-        </thead>    
-        <tbody>
-        <tr>
-            <td>2018.6</td>
-            <td>首次发售</td>
-        </tr>
-        <tr>
-            <td>2019.7</td>
-            <td>MPU9250变更为SH200Q+BMM150、TN屏幕变更为IPS屏幕</td>
-        </tr>
-        <tr>
-            <td>2019.8</td>
-            <td>SH200Q变更为MPU6886</td>
-        </tr>
-        <tr>
-            <td>2019.11</td>
-            <td>电池容量600mAh变更为500mAh</td>
-        </tr>
-        <tbody>
-    </table>
-</div>
+<table class="fl-table">
+   <thead>
+   <tr>
+      <th>上市日期</th>
+      <th>产品变动</th>
+      <th>备注：</th>
+   </tr>
+   </thead>    
+   <tbody>
+   <tr>
+      <td>2018.6</td>
+      <td>首次发售</td>
+      <td>/</td>
+   </tr>
+   <tr>
+      <td>2019.7</td>
+      <td>MPU9250变更为SH200Q+BMM150、TN屏幕变更为IPS屏幕</td>
+      <td>请将您的M5Stack库升级到最新版本(v0.2.8以上),以解决屏幕反色问题。</td>
+   </tr>
+   <tr>
+      <td>2019.8</td>
+      <td>SH200Q变更为MPU6886</td>
+      <td>/</td>
+   </tr>
+   <tr>
+      <td>2019.11</td>
+      <td>电池容量600mAh变更为500mAh</td>
+      <td>/</td>
+   </tr>
+   <tbody>
+</table>
 
 ## 相关视频
 
diff --git a/docs/zh_CN/core/gray.md b/docs/zh_CN/core/gray.md
index f97499a4..a9406395 100644
--- a/docs/zh_CN/core/gray.md
+++ b/docs/zh_CN/core/gray.md
@@ -198,17 +198,59 @@ BMM150 I2C 地址为 0x10
    </tr>
 </table>
 
-**<mark>Notice2：M5PORT 说明 </mark>**
-*不同颜色的GROVE端口分别代表不同的功能.红色的PortA（21/22），为默认的I2C协议接口，黑色的PortB（26/36）, 支持DA/AD转换与信号总线通信.蓝色的PortC（16/17）, 支持Uart串口通信.在使用Unit进行功能拓展的时候，只需要匹配二者的端口的颜色，相应的进行连接即可正常使用.不仅提供简洁的硬件连接方式，还支持引脚的重映射.PortA（红色）被作为信号总线连接至是ESP32的GPIO21/22 ，没有AD通道转换方案，因此不能用作模拟输入使用.
+## M5端口说明
 
-- ADC1(8 通道 GPIO 32-39)
-- ADC2(10 通道 GPIO 0，2，4，12-15，25-27)
+<table>
+      <thead>
+         <th>PORT</th>
+         <th>PIN</th>
+         <th>备注:</th>
+      </thead>
+      <tbody>
+      <tr>
+         <td>PORT-A(红色)</td>
+         <td>G21/22</td>
+         <td>I2C</td>
+      </tr>
+      <tr>
+         <td>PORT-B(黑色)</td>
+         <td>G26/36</td>
+         <td>DAC/ADC</td>
+      </tr>
+      <tr>
+         <td>PORT-C(蓝色)</td>
+         <td>G16/17</td>
+         <td>UART</td>
+      </tr>
+    </tbody>
+</table>
 
-使用AD读取功能:
-1，使用杜邦线连接机身侧面的能够AD转换的引脚.
-2，堆叠一个M5GO底座，使用其提供PortB.
-3，使用PbHUB连接至PortA，拓展出6个PortB.
-有关引脚分配和引脚重映射的更多信息，请查阅[ESP32数据手册](https://www.espressif.com/sites/default/files/documentation/esp32_datasheet_cn.pdf)
+## ESP32 ADC/DAC
+
+<table>
+      <thead>
+         <th>ADC1</th>
+         <th>ADC2</th>
+         <th>DAC1</th>
+         <th>DAC2</th>
+      </thead>
+      <tbody>
+      <tr>
+         <td>8 通道</td>
+         <td>10 通道</td>
+         <td>2 通道</td>
+         <td>2 通道</td>  
+      </tr>
+      <tr>
+         <td>G32-39</td>
+         <td>G0/2/4/12-15/25-27</td>
+         <td>G25</td>
+         <td>G26</td>
+      </tr>
+    </tbody>
+</table>
+
+有关引脚分配和引脚重新映射的更多信息，请参考[ESP32 datasheet](https://m5stack.oss-cn-shenzhen.aliyuncs.com/resource/docs/datasheet/core/esp32_datasheet_cn.pdf)
 
 ## 包含
 
diff --git a/docs/zh_CN/core/m5go.md b/docs/zh_CN/core/m5go.md
index fef4e626..d4988968 100644
--- a/docs/zh_CN/core/m5go.md
+++ b/docs/zh_CN/core/m5go.md
@@ -236,17 +236,59 @@ BMM150 I2C address 0x10
    </tr>
 </table>
 
-**<mark>Notice2：M5PORT 说明 </mark>**
-*不同颜色的GROVE端口分别代表不同的功能.红色的PortA（21/22），为默认的I2C协议接口，黑色的PortB（26/36）, 支持DA/AD转换与信号总线通信.蓝色的PortC（16/17）, 支持Uart串口通信.在使用Unit进行功能拓展的时候，只需要匹配二者的端口的颜色，相应的进行连接即可正常使用.不仅提供简洁的硬件连接方式，还支持引脚的重映射.PortA（红色）被作为信号总线连接至是ESP32的GPIO21/22 ，没有AD通道转换方案，因此不能用作模拟输入使用.
+## M5端口说明
 
-- ADC1(8 通道 GPIO 32-39)
-- ADC2(10 通道 GPIO 0，2，4，12-15，25-27)
+<table>
+      <thead>
+         <th>PORT</th>
+         <th>PIN</th>
+         <th>备注:</th>
+      </thead>
+      <tbody>
+      <tr>
+         <td>PORT-A(红色)</td>
+         <td>G21/22</td>
+         <td>I2C</td>
+      </tr>
+      <tr>
+         <td>PORT-B(黑色)</td>
+         <td>G26/36</td>
+         <td>DAC/ADC</td>
+      </tr>
+      <tr>
+         <td>PORT-C(蓝色)</td>
+         <td>G16/17</td>
+         <td>UART</td>
+      </tr>
+    </tbody>
+</table>
 
-使用AD读取功能:
-1，使用杜邦线连接机身侧面的能够AD转换的引脚.
-2，堆叠一个M5GO底座，使用其提供PortB.
-3，使用PbHUB连接至PortA，拓展出6个PortB.
-有关引脚分配和引脚重映射的更多信息，请查阅[ESP32数据手册](https://www.espressif.com/sites/default/files/documentation/esp32_datasheet_cn.pdf)
+## ESP32 ADC/DAC
+
+<table>
+      <thead>
+         <th>ADC1</th>
+         <th>ADC2</th>
+         <th>DAC1</th>
+         <th>DAC2</th>
+      </thead>
+      <tbody>
+      <tr>
+         <td>8 通道</td>
+         <td>10 通道</td>
+         <td>2 通道</td>
+         <td>2 通道</td>  
+      </tr>
+      <tr>
+         <td>G32-39</td>
+         <td>G0/2/4/12-15/25-27</td>
+         <td>G25</td>
+         <td>G26</td>
+      </tr>
+    </tbody>
+</table>
+
+有关引脚分配和引脚重新映射的更多信息，请参考[ESP32 datasheet](https://m5stack.oss-cn-shenzhen.aliyuncs.com/resource/docs/datasheet/core/esp32_datasheet_cn.pdf)
 
 ## 包含
 
diff --git a/docs/zh_CN/core/m5go_lite.md b/docs/zh_CN/core/m5go_lite.md
index 13aa95dc..6ab15633 100644
--- a/docs/zh_CN/core/m5go_lite.md
+++ b/docs/zh_CN/core/m5go_lite.md
@@ -236,18 +236,59 @@
    </tr>
 </table>
 
+## M5端口说明
 
-**<mark>Notice2：M5PORT 说明 </mark>**
-*不同颜色的GROVE端口分别代表不同的功能.红色的PortA（21/22），为默认的I2C协议接口，黑色的PortB（26/36）, 支持DA/AD转换与信号总线通信.蓝色的PortC（16/17）, 支持Uart串口通信.在使用Unit进行功能拓展的时候，只需要匹配二者的端口的颜色，相应的进行连接即可正常使用.不仅提供简洁的硬件连接方式，还支持引脚的重映射.PortA（红色）被作为信号总线连接至是ESP32的GPIO21/22 ，没有AD通道转换方案，因此不能用作模拟输入使用.
+<table>
+      <thead>
+         <th>PORT</th>
+         <th>PIN</th>
+         <th>备注:</th>
+      </thead>
+      <tbody>
+      <tr>
+         <td>PORT-A(红色)</td>
+         <td>G21/22</td>
+         <td>I2C</td>
+      </tr>
+      <tr>
+         <td>PORT-B(黑色)</td>
+         <td>G26/36</td>
+         <td>DAC/ADC</td>
+      </tr>
+      <tr>
+         <td>PORT-C(蓝色)</td>
+         <td>G16/17</td>
+         <td>UART</td>
+      </tr>
+    </tbody>
+</table>
 
-- ADC1(8 通道 GPIO 32-39)
-- ADC2(10 通道 GPIO 0，2，4，12-15，25-27)
+## ESP32 ADC/DAC
 
-使用AD读取功能:
-1，使用杜邦线连接机身侧面的能够AD转换的引脚.
-2，堆叠一个M5GO底座，使用其提供PortB.
-3，使用PbHUB连接至PortA，拓展出6个PortB.
-有关引脚分配和引脚重映射的更多信息，请查阅[ESP32数据手册](https://www.espressif.com/sites/default/files/documentation/esp32_datasheet_cn.pdf)
+<table>
+      <thead>
+         <th>ADC1</th>
+         <th>ADC2</th>
+         <th>DAC1</th>
+         <th>DAC2</th>
+      </thead>
+      <tbody>
+      <tr>
+         <td>8 通道</td>
+         <td>10 通道</td>
+         <td>2 通道</td>
+         <td>2 通道</td>  
+      </tr>
+      <tr>
+         <td>G32-39</td>
+         <td>G0/2/4/12-15/25-27</td>
+         <td>G25</td>
+         <td>G26</td>
+      </tr>
+    </tbody>
+</table>
+
+有关引脚分配和引脚重新映射的更多信息，请参考[ESP32 datasheet](https://m5stack.oss-cn-shenzhen.aliyuncs.com/resource/docs/datasheet/core/esp32_datasheet_cn.pdf)
 
 ## 包含
 
diff --git a/docs/zh_CN/core/m5stickc.md b/docs/zh_CN/core/m5stickc.md
index d5c919f1..4abfe3d9 100644
--- a/docs/zh_CN/core/m5stickc.md
+++ b/docs/zh_CN/core/m5stickc.md
@@ -166,20 +166,29 @@ M5StickC仅支持WIN10&Linux&MAC免驱，其余操作系统则需要用户自行
         <tr>
             <th>上市日期</th>
             <th>产品变动</th>
+            <th>备注:</th>
         </tr>
-        </thead>    
+        </thead>      
         <tbody>
         <tr>
             <td>2019.3</td>
             <td>首次发售</td>
+            <td>/</td>
         </tr>
         <tr>
             <td>2019.8</td>
             <td>SH200Q变更为MPU6886</td>
+            <td>/</td>
         </tr>
         <tr>
             <td>2019.10</td>
             <td>升级底部,添加铜螺母</td>
+            <td>/</td>
+        </tr>
+        <tr>
+            <td>2020.3</td>
+            <td>电池容量80mAh变更为95mAh</td>
+            <td>/</td>
         </tr>
         <tbody>
     </table>