📝(component): 优化文档

package/document-component/src/assets/css/markdown.css

@@ -240,4 +240,20 @@ body::-webkit-scrollbar {
 
 .lay-link:hover{
   color: #5FB878;
+}
+
+.describe-plugin {
+  padding-bottom: 20px;
+  padding-left: 30px;
+  padding-top: 20px;
+
+}
+
+.describe-plugin code {
+  margin: 0 1px;
+  padding: 0.2em 0.4em;
+  font-size: .9em;
+  background: #f2f4f5;
+  border: 1px solid rgba(0,0,0,.06);
+  border-radius: 3px;
 }

package/document-component/src/components/LayCode.vue

@@ -176,14 +176,12 @@ function handleScroll() {
   line-height: 26px !important;
 }
 .lay-code .source .description code {
-  display: inline-block;
-  padding: 1px 5px;
-  margin: 0 4px;
-  height: 18px;
-  border-radius: 2px;
-  background-color: rgba(27, 31, 35, 0.05);
-  font-size: 12px;
-  line-height: 18px;
+  margin: 0 1px;
+  padding: 0.2em 0.4em;
+  font-size: .9em;
+  background: #f2f4f5;
+  border: 1px solid rgba(0,0,0,.06);
+  border-radius: 3px;
 }
 .lay-code .control {
   height: 44px;

package/document-component/src/document/zh-CN/components/icon.md

@@ -38,7 +38,7 @@ export default {
 ::: title 组件图标
 :::
 
-::: describe 使用图标组件，你需要安装 @layui/icons-vue 图标组件包。
+::: describe 使用图标组件，你需要安装 <code>@layui/icons-vue</code> 图标组件包。
 :::
 
 ```

package/document-component/src/document/zh-CN/guide/introduce.md

@@ -1,9 +1,6 @@
-::: title 基本介绍
-:::
-
 <br>
   <p>
-    <a href="http://www.layui-vue.com" style="margin-left:30px;">
+    <a href="http://www.layui-vue.com">
       <img src="https://unpkg.com/outeres@0.0.6/img/layui/icon-1.png" alt="layui" width="100" style="border-radius:4px;">
     </a>
     <span style="font-size:32px;color:#e2e2e2;margin:30px;">+</span>

package/document-component/src/plugin/create-describe.ts

@@ -16,7 +16,7 @@ export default function createContainer(klass: string): ContainerArgs {
         const token = tokens[idx];
         const info = token.info.trim().slice(klass.length).trim();
         if (token.nesting === 1) {
-          return `<p style="padding-left: 30px;padding-top: 20px;padding-bottom: 20px;">${info}`;
+          return `<p class="describe-plugin">${info}`;
         } else {
           return "</p>\n";
         }