docs: modify nav

src/config.json

@@ -23,14 +23,14 @@
   ],
   "header": [
     {
-      "name": "guide",
+      "name": "intro,theme,start",
       "cName": "指南",
       "path": "/intro"
     },
     {
-      "name": "intro",
+      "name": "component",
       "cName": "组件",
-      "path": "/intro"
+      "path": "/button"
     },
     {
       "name": "example",

src/packages/__VUE/navbar/demo.vue

@@ -22,7 +22,7 @@
       @on-click-clear="edit"
       @on-click-send="more"
       title="购物车"
-      titIcon="locationg3"
+      titIcon="cart2"
       desc="编辑"
       icon="more-x"
     ></nut-navbar>

src/packages/__VUE/navbar/index.scss

@@ -41,12 +41,18 @@
     text-align: center;
     &.icon {
       .icon {
-        margin-left: 8px;
+        margin-left: 13px;
       }
     }
+    .nut-icon {
+      display: inline;
+    }
     &-desc {
       font-size: $cell-title-desc-font;
     }
+    .text__title {
+      display: inline-block;
+    }
 
     .tab-title {
       width: 164px;

src/packages/__VUE/navbar/index.taro.vue

@@ -13,7 +13,9 @@
       :class="{ icon }"
       v-if="title || titIcon || tabs"
     >
-      <view v-if="title" @click="handleCenter">{{ title }}</view>
+      <view v-if="title" class="text__title" @click="handleCenter">{{
+        title
+      }}</view>
       <nut-icon
         v-if="titIcon"
         class="icon"

src/sites/doc/components/Footer.vue

@@ -64,7 +64,7 @@
             target="_blank"
             href="https://www.zhihu.com/column/c_1263837684834889728"
             v-hover
-            >NutUI 知乎专栏</a
+            >知乎专栏</a
           ></div
         >
 

src/sites/doc/components/Header.vue

@@ -9,12 +9,12 @@
       <Search />
       <div class="nav-box">
         <ul class="nav-list">
-          <li class="nav-item">
+          <li class="nav-item" :class="{ active: isActive(header[0].name) }">
             <router-link :to="header[0].path">
               {{ header[0].cName }}
             </router-link>
           </li>
-          <li class="nav-item" :class="{ active: isActive(header[1].path) }">
+          <li class="nav-item" :class="{ active: isActive(header[1].name) }">
             <router-link :to="header[1].path">
               {{ header[1].cName }}
             </router-link>
@@ -71,7 +71,7 @@
 <script lang="ts">
 import { defineComponent, reactive, computed, onMounted } from 'vue';
 import Search from './Search.vue';
-import { header, versions } from '@/config.json';
+import { header, versions, nav } from '@/config.json';
 import { RefData } from '@/sites/assets/util/ref';
 export default defineComponent({
   name: 'doc-header',
@@ -79,6 +79,10 @@ export default defineComponent({
     Search
   },
   setup() {
+    let packages = [];
+    nav.forEach((item) => {
+      packages.push(...item.packages);
+    });
     const data = reactive({
       theme: 'black',
       // headerBg: 'url(' + require('../../assets/images/header-bg.png') + ')',
@@ -94,12 +98,23 @@ export default defineComponent({
       data.isShowSelect = false;
     };
     const isActive = computed(() => {
-      return function(name: string) {
-        return RefData.getInstance().currentRoute.value == name.toLowerCase();
+      let value = RefData.getInstance().currentRoute.value;
+      return function (name: string) {
+        const lName = name.toLowerCase();
+        if (lName === 'component') {
+          if (value.indexOf('-taro') > -1) {
+            value = value.split('-taro')[0];
+          }
+          return (
+            packages.findIndex((item) => item.name.toLowerCase() === value) > -1
+          );
+        } else {
+          return value === lName || lName.includes(value);
+        }
       };
     });
     const themeName = computed(() => {
-      return function() {
+      return function () {
         return `doc-header-${RefData.getInstance().themeColor.value}`;
       };
     });

src/sites/doc/views/Index.vue

@@ -48,7 +48,7 @@ export default defineComponent({
   setup() {
     const route = useRoute();
     const router = useRouter();
-    const excludeTaro = ['/intro', '/start', '/theme'];
+    const excludeTaro = ['/intro', '/start', '/theme', '/joinus'];
     const data = reactive({
       demoUrl: 'demo.html',
       curKey: 'vue',

src/sites/mobile-taro/vue/src/nav/pages/navbar/index.vue

@@ -24,7 +24,7 @@
       @on-click-clear="edit"
       @on-click-send="more"
       title="购物车"
-      titIcon="locationg3"
+      titIcon="cart2"
       desc="编辑"
       icon="more-x"
     ></nut-navbar>