perf:icons

Author: iRuxu

src/App.vue

@@ -13,7 +13,7 @@
                             class="m-child-category" :class="['child-' + index, { 'is-disabled': submenu.disabled }]"
                             v-for="(submenu, i) in menu.submenus" :target="submenu.disabled ? undefined : submenu.target || '_self'"
                             :aria-disabled="submenu.disabled || undefined" :key="i">
-                            <img :src="getNavIcon(submenu.key)" class="u-img"
+                            <img :src="getNavIcon(submenu)" class="u-img"
                                 :alt="getMenuLabel(submenu)" />
                             <span class="u-text">{{ getMenuLabel(submenu) }}</span>
                         </component>
@@ -42,8 +42,9 @@ export default {
     },
     computed: {},
     methods: {
-        getNavIcon(key) {
-            return require(`@/assets/img/index/${key}.svg`);
+        getNavIcon(item) {
+            const slug = item.menuKey || item.key;
+            return require(`@/assets/img/index/${slug}2.svg`);
         },
         getLocalLabel(key, fallback) {
             return this.$te(key) ? this.$t(key) : fallback;

src/assets/css/common/nav_v5.less

@@ -90,6 +90,7 @@
             }
         }
         &:hover,
+        &:focus-within,
         &.is-active {
             .u-icon-hover {
                 opacity: 1;

src/assets/css/questsection/content.less

@@ -5,47 +5,6 @@
     min-width: 0;
 }
 
-.m-questsection-content__aside {
-    display: flex;
-    min-width: 0;
-    align-self: center;
-    flex-direction: column;
-    align-items: flex-end;
-    gap: @pvx-space-3;
-
-    .m-robot__pvx-tip {
-        width: 100%;
-        max-width: 375px;
-        min-width: 0;
-        align-self: flex-end;
-
-        .m-qq {
-            width: 100%;
-            max-width: 375px;
-            margin-left: auto;
-            margin-right: 0;
-        }
-    }
-
-}
-
-.u-btn--feedback {
-    width: auto;
-    min-height: 40px;
-    flex: none;
-    border-color: fade(@pvx-primary, 16%);
-    border-radius: @pvx-radius-control;
-    background: @pvx-primary-soft;
-    color: @pvx-primary-hover;
-    box-shadow: @pvx-shadow-xs;
-
-    &:hover {
-        border-color: @pvx-border-focus;
-        background: fade(@pvx-primary, 14%);
-        color: @pvx-primary-hover;
-    }
-}
-
 .m-questsection-content__body {
     display: flex;
     min-width: 0;
@@ -56,7 +15,7 @@
 .m-questsection-content__header-image {
     display: grid;
     width: 100%;
-    grid-template-columns: 500px minmax(280px, 1fr) minmax(320px, 420px);
+    grid-template-columns: 500px minmax(0, 1fr);
     align-items: center;
     justify-content: start;
     gap: @pvx-space-5;
@@ -180,10 +139,6 @@
     }
 }
 
-.m-questsection-content__chapters--mobile {
-    display: none;
-}
-
 .m-questsection-content__detail {
     display: flex;
     min-width: 0;
@@ -221,7 +176,6 @@
             font-weight: 500;
         }
     }
-
 }
 
 .m-questsection-content__empty {
@@ -244,26 +198,10 @@
     }
 }
 
-@media screen and (min-width: 1401px) {
-    .m-questsection-content__chapters {
-        min-height: calc(80px + @pvx-space-3);
-    }
-}
-
 @media screen and (max-width: 1400px) {
     .m-questsection-content__header-image {
         grid-template-columns: 500px minmax(320px, 1fr);
     }
-
-    .m-questsection-content__aside {
-        grid-column: 2;
-        grid-row: 1;
-    }
-
-    .m-questsection-content__chapters {
-        grid-column: 1 / -1;
-        grid-row: 2;
-    }
 }
 
 @media screen and (min-width: 1101px) and (max-width: 1280px) {
@@ -276,21 +214,13 @@
         }
     }
 
-    .m-questsection-content__aside {
-        width: 100%;
-    }
 }
 
 @media screen and (max-width: 1100px) {
     .m-questsection-content__header-image {
         grid-template-columns: minmax(0, 1fr);
     }
 
-    .m-questsection-content__aside,
-    .m-questsection-content__chapters {
-        grid-column: auto;
-        grid-row: auto;
-    }
 }
 
 @media screen and (max-width: @ipad) {
@@ -323,15 +253,7 @@
         }
     }
 
-    .m-questsection-content__aside {
-        display: none;
-    }
-
-    .m-questsection-content__chapters--desktop {
-        display: none;
-    }
-
-    .m-questsection-content__chapters--mobile {
+    .m-questsection-content__chapters {
         position: sticky;
         z-index: 20;
         top: @header-height;
@@ -365,14 +287,6 @@
         }
     }
 
-    .u-btn--feedback {
-        padding: 0 @pvx-space-3;
-
-        span {
-            display: inline;
-        }
-    }
-
     .m-questsection-content__header-image {
         .m-questsection-content__image {
             aspect-ratio: auto;
@@ -419,10 +333,3 @@
         }
     }
 }
-
-.v-miniprogram {
-    .m-questsection-content__aside .u-btn--feedback,
-    .m-questsection-content__aside .m-robot__pvx-tip {
-        display: none;
-    }
-}

src/assets/data/menus.json

@@ -56,7 +56,7 @@
                 "label": "外观大全",
                 "icon": "el-icon-files",
                 "key": "exterior",
-                "menuKey": "body",
+                "menuKey": "exterior",
                 "status": true,
                 "disabled": true
             },
@@ -101,7 +101,6 @@
                 "label": "科举大全",
                 "icon": "el-icon-files",
                 "key": "keju",
-                "menuKey": "exam",
                 "status": true
             },
             {
@@ -123,15 +122,15 @@
                 "label": "奇遇珍卷",
                 "icon": "el-icon-files",
                 "key": "treasure",
-                "menuKey": "codextreature",
+                "menuKey": "treature",
                 "status": true
             },
             {
                 "path": "/pvx/achievements",
                 "label": "资历宝典",
                 "icon": "el-icon-files",
                 "key": "seniority",
-                "menuKey": "codexachievement",
+                "menuKey": "achievement",
                 "status": true
             }
         ]
@@ -147,7 +146,7 @@
                 "label": "外观黑市",
                 "icon": "el-icon-files",
                 "key": "market",
-                "menuKey": "body",
+                "menuKey": "market",
                 "status": true,
                 "disabled": true
             },