更新

src/App.vue

@@ -5,13 +5,14 @@
             <!-- Header -->
             <el-header class="main-header shadow-1">
                 <!-- LOGO -->
-                <el-avatar class="logo" shape="square" size="medium" src="./favicon.ico"></el-avatar>
+                <el-avatar class="logo" shape="square" size="small" src="./favicon.ico"></el-avatar>
 
                 <!-- 菜单 -->
                 <el-menu class="menu" default-active="home" mode="horizontal">
                     <el-menu-item index="title" class="title" disabled>Frost 网址导航</el-menu-item>
                     <el-menu-item index="home">主页</el-menu-item>
                     <el-menu-item index="tools" disabled>小工具</el-menu-item>
+                    <el-menu-item index="settings" disabled>设置</el-menu-item>
                 </el-menu>
             </el-header>
 
@@ -39,6 +40,7 @@
             line-height: 2.5rem;
 
             &.is-active {
+                border-bottom-color: transparent;
                 color: @colorPrimary !important;
             }
         }

src/assets/css/element.scss

@@ -0,0 +1,8 @@
+// icon 字体路径
+$--font-path: '~element-ui/lib/theme-chalk/fonts';
+
+// 颜色
+$--color-primary: #2196F3;
+$--color-success: #4CAF50;
+
+@import "~element-ui/packages/theme-chalk/src/index";

src/assets/css/global.less

@@ -4,9 +4,9 @@
 
 @headerHeight: 4rem;
 
-@colorPrimary: #409EFF;
+@colorPrimary: #2196F3;
 @colorSecondary: #67C23A;
-@colorWhite: #F5F5F5;
+@colorWhite: #F9F9F9;
 
 // 滚动条
 
@@ -21,7 +21,7 @@
 
 ::-webkit-scrollbar-thumb {
     border-radius: 1rem;
-    background-color: #F5F5F5;
+    background-color: #EEE;
 
     &:hover {
         background-color: @colorPrimary;
@@ -30,12 +30,24 @@
 
 // 标签
 
-html {
-    font-size: 16px;
-}
-
 body {
     user-select: none;
+    overflow: hidden;
+    -webkit-tap-highlight-color: transparent;
+}
+
+// 限制长度
+
+.limitLine(@line) {
+    display: -webkit-box;
+    -webkit-line-clamp: @line;
+    -webkit-box-orient: vertical;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+.limit-line-1 {
+    .limitLine(1);
 }
 
 // 阴影
@@ -44,7 +56,11 @@ body {
     box-shadow: 0 0 0.5rem rgba(0, 0, 0, 0.1);
 }
 
-// 加载中（链接列表）
+.shadow-2 {
+    box-shadow: 0 0.2rem 0.5rem rgba(0, 0, 0, 0.05);
+}
+
+// 载入中（链接列表）
 
 .loading-link {
     background-color: rgba(255, 255, 255, 0.5) !important;
@@ -58,3 +74,9 @@ body {
         font-size: 1.5rem !important;
     }
 }
+
+// Element
+
+.el-select-dropdown {
+    border: none !important;
+}

src/assets/js/config.js

@@ -0,0 +1,105 @@
+let config = {
+    searchEngine: {
+        default: '百度',
+        list: [
+            {
+                name: '百度',
+                desc: 'www.baidu.com',
+                url: 'https://www.baidu.com/s?wd=%keyword%',
+                show: true
+            },
+            {
+                name: '必应',
+                desc: 'cn.bing.com',
+                url: 'https://cn.bing.com/search?q=%keyword%',
+                show: true
+            },
+            {
+                name: '秘迹',
+                desc: 'mijisou.com',
+                url: 'https://mijisou.com/?q=%keyword%',
+                show: true
+            },
+            {
+                name: '搜狗',
+                desc: 'www.sogou.com',
+                url: 'https://www.sogou.com/web?query=%keyword%',
+                show: true
+            },
+            {
+                name: '网易云音乐',
+                desc: 'music.163.com',
+                url: 'https://music.163.com/#/search/m/?s=%keyword%',
+                show: true
+            },
+            {
+                name: '站酷',
+                desc: 'www.zcool.com.cn',
+                url: 'https://www.zcool.com.cn/search/content?word=%keyword%',
+                show: true
+            },
+            {
+                name: '知乎',
+                desc: 'www.zhihu.com',
+                url: 'https://www.zhihu.com/search?type=content&q=%keyword%',
+                show: true
+            },
+            {
+                name: '360',
+                desc: 'www.so.com',
+                url: 'https://www.so.com/s?q=%keyword%',
+                show: true
+            },
+            {
+                name: 'AcFun',
+                desc: 'www.acfun.cn',
+                url: 'https://www.acfun.cn/search/?keyword=%keyword%',
+                show: true
+            },
+            {
+                name: 'bilibili',
+                desc: 'search.bilibili.com',
+                url: 'https://search.bilibili.com/all?keyword=%keyword%',
+                show: true
+            },
+            {
+                name: 'CSDN',
+                desc: 'so.csdn.net',
+                url: 'https://so.csdn.net/so/search/all?q=%keyword%',
+                show: true
+            },
+            {
+                name: 'GitHub',
+                desc: 'github.com',
+                url: 'https://github.com/search?q=%keyword%',
+                show: true
+            },
+            {
+                name: 'Google',
+                desc: 'www.google.com',
+                url: 'https://www.google.com/search?q=%keyword%',
+                show: true
+            },
+            {
+                name: 'Iconfont',
+                desc: 'www.iconfont.cn',
+                url: 'https://www.iconfont.cn/search/index?searchType=icon&q=%keyword%',
+                show: true
+            },
+            {
+                name: 'MDN',
+                desc: 'developer.mozilla.org',
+                url: 'https://developer.mozilla.org/zh-CN/search?q=%keyword%',
+                show: true
+            },
+            {
+                name: 'Yandex',
+                desc: 'yandex.com',
+                url: 'https://yandex.com/search/?text=%keyword%',
+                show: true
+            }
+        ]
+    }
+};
+
+export default config;

src/assets/js/utils.js

@@ -8,7 +8,7 @@ class Utils {
      * 初始化链接列表，设置唯一ID
      */
     initNavLinkID() {
-        // 加载中提示
+        // 载入中提示
         var loading = Loading.service({
             customClass: 'loading-link',
             lock: true,
@@ -50,7 +50,7 @@ class Utils {
         var timer = setInterval(() => {
             if (currentIndex == currentIndexCpy) {
                 clearInterval(timer);
-                // 加载中提示
+                // 载入中提示
                 loading.close();
             }
 
@@ -61,6 +61,23 @@ class Utils {
         return fn;
     }
 
+    /**
+     * 输出日志
+     * 
+     * @param {string} type 日志类型（info、warn、error）
+     * @param {string} title 日志标题
+     * @param {any} datas 日志内容
+     */
+    log(type, title, ...datas) {
+        if (type == 'info') {
+            console.info(`[${title}]`, datas);
+        } else if (type == 'warn') {
+            console.warn(`[${title}]`, datas);
+        } else if (type == 'error') {
+            console.error(`[${title}]`, datas);
+        }
+    }
+
 }
 
 const utils = new Utils;

src/main.js

@@ -3,11 +3,12 @@ import ElementUI from 'element-ui';
 import App from './App.vue';
 import router from './router';
 
-import navLinks from '../public/static/js/navLinks'
+import config from './assets/js/config';
-import utils from './assets/js/utils'
+import navLinks from './assets/js/navLinks';
+import utils from './assets/js/utils';
 
 import 'ress/ress.css';
-import 'element-ui/lib/theme-chalk/index.css';
+import './assets/css/element.scss';
 
 (function () {
     var init = utils.initNavLinkID();
@@ -25,6 +26,7 @@ new Vue({
     router,
     data: function () {
         return {
+            config,
             navLinks,
             utils
         }