feat(slider): 初步集成 slider 滑块组件

docs/src/layouts/Layout.vue

@@ -31,7 +31,7 @@
             </a>
           </li>
           <li class="layui-nav-item">
-            <a href="javascript:void(0)"> 0.1.3 </a>
+            <a href="javascript:void(0)"> 0.1.4 </a>
           </li>
         </ul>
       </lay-header>
@@ -74,12 +74,15 @@ export default {
   setup() {
     const route = useRoute()
     const router = useRouter()
-    const currentPath = ref('hahaha')
+    const currentPath = ref('/zh-CN/guide')
 
     watch(
       () => route.path,
-      (newValue, oldValue) => {
-        currentPath.value = route.path
+      (val) => {
+        currentPath.value = val
+      },{
+        immediate: true,
+        deep: true
       }
     )
 
@@ -87,19 +90,19 @@ export default {
       {
         id: 1,
         title: '介绍',
-        subTitle: 'Getting Started',
-        path: '/zh-CN/guide',
+        subTitle: 'introduce',
+        path: '/zh-CN/guide/introduce',
       },
       {
         id: 2,
         title: '安装',
-        subTitle: 'install',
-        path: '/zh-CN/guide/install',
+        subTitle: 'get started',
+        path: '/zh-CN/guide/getStarted',
       },
       {
         id: 3,
         title: '更新',
-        subTitle: 'changelog',
+        subTitle: 'change log',
         path: '/zh-CN/guide/changelog',
       },
       {
@@ -301,6 +304,11 @@ export default {
         title: '开关',
         subTitle: 'switch',
         path: '/zh-CN/components/switch',
+      },{
+        id: 37,
+        title: '滑块',
+        subTitle: 'slider',
+        path: '/zh-CN/components/slider',
       }
     ]
 

docs/src/plugin/create-container.ts

@@ -23,7 +23,7 @@ export default function createContainer(
         if (token.nesting === 1) {
           return `<lay-field title="${
             info || defaultTitle
-          }" style="margin-top:40px">`
+          }" style="margin-top:10px;margin-bottom: 10px;">`
         } else {
           return '</lay-field>\n'
         }

docs/src/router/zh-CN.ts

@@ -3,18 +3,18 @@ import BaseLayout from '../layouts/Layout.vue'
 const zhCN = [
   {
     path: '/',
-    redirect: '/zh-CN/guide/',
+    redirect: '/zh-CN/guide/introduce',
     component: BaseLayout,
     meta: { title: '指南', icon: 'el-icon-position' },
     children: [
       {
-        path: '/zh-CN/guide/',
-        component: () => import('../../docs/zh-CN/guide/home.md'),
+        path: '/zh-CN/guide/introduce',
+        component: () => import('../../docs/zh-CN/guide/introduce.md'),
         meta: { title: '介绍' },
       },
       {
-        path: '/zh-CN/guide/install',
-        component: () => import('../../docs/zh-CN/guide/install.md'),
+        path: '/zh-CN/guide/getStarted',
+        component: () => import('../../docs/zh-CN/guide/getStarted.md'),
         meta: { title: '安装' },
       },
       {
@@ -194,6 +194,10 @@ const zhCN = [
         path: '/zh-CN/components/switch',
         component: () => import('../../docs/zh-CN/components/switch.md'),
         meta: { title: '开关' },
+      },{
+        path: '/zh-CN/components/slider',
+        component: () => import('../../docs/zh-CN/components/slider.md'),
+        meta: { title: '滑块' },
       },
     ],
   },

docs/src/styles/vars.css

@@ -1,32 +1,9 @@
 :root {
   --c-white: #ffffff;
   --c-black: #000000;
-
-  --c-divider-light: rgba(60, 60, 67, 0.12);
-  --c-divider-dark: rgba(84, 84, 88, 0.48);
-
-  --c-text-light-1: #2c3e50;
-  --c-text-light-2: #476582;
-  --c-text-light-3: #90a4b7;
-
-  --c-brand-light: #4abf8a;
-
-  --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.04), 0 1px 2px rgba(0, 0, 0, 0.06);
-  --shadow-2: 0 3px 12px rgba(0, 0, 0, 0.07), 0 1px 4px rgba(0, 0, 0, 0.07);
-  --shadow-3: 0 12px 32px rgba(0, 0, 0, 0.1), 0 2px 6px rgba(0, 0, 0, 0.08);
-  --shadow-4: 0 14px 44px rgba(0, 0, 0, 0.12), 0 3px 9px rgba(0, 0, 0, 0.12);
-  --shadow-5: 0 18px 56px rgba(0, 0, 0, 0.16), 0 4px 12px rgba(0, 0, 0, 0.16);
 }
 
 :root {
-  --c-divider: var(--c-divider-light);
-
-  --c-text: var(--c-text-light-1);
-  --c-text-light: var(--c-text-light-2);
-  --c-text-lighter: var(--c-text-light-3);
-
-  --c-bg: var(--c-white);
-
   --code-line-height: 24px;
   --code-font-family: var(--font-family-mono);
   --code-font-size: 14px;