From 877aee4119b69a0bb228a9108c40fa6a15a8aeb2 Mon Sep 17 00:00:00 2001 From: Frost-ZX <30585462+Frost-ZX@users.noreply.github.com> Date: Mon, 8 Feb 2021 00:46:15 +0800 Subject: [PATCH] =?UTF-8?q?=E6=9B=B4=E6=96=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/App.vue | 4 +- src/assets/css/element.scss | 8 +++ src/assets/css/global.less | 38 ++++++++++--- src/assets/js/config.js | 105 ++++++++++++++++++++++++++++++++++++ src/assets/js/utils.js | 21 +++++++- src/main.js | 8 +-- 6 files changed, 170 insertions(+), 14 deletions(-) create mode 100644 src/assets/css/element.scss create mode 100644 src/assets/js/config.js diff --git a/src/App.vue b/src/App.vue index 4208966..463d15a 100644 --- a/src/App.vue +++ b/src/App.vue @@ -5,13 +5,14 @@ - + Frost 网址导航 主页 小工具 + 设置 @@ -39,6 +40,7 @@ line-height: 2.5rem; &.is-active { + border-bottom-color: transparent; color: @colorPrimary !important; } } diff --git a/src/assets/css/element.scss b/src/assets/css/element.scss new file mode 100644 index 0000000..34ccf04 --- /dev/null +++ b/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"; diff --git a/src/assets/css/global.less b/src/assets/css/global.less index 5347a9c..7872382 100644 --- a/src/assets/css/global.less +++ b/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; +} diff --git a/src/assets/js/config.js b/src/assets/js/config.js new file mode 100644 index 0000000..b23d316 --- /dev/null +++ b/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; diff --git a/src/assets/js/utils.js b/src/assets/js/utils.js index 8571e34..771015f 100644 --- a/src/assets/js/utils.js +++ b/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; diff --git a/src/main.js b/src/main.js index 7a6534b..212f393 100644 --- a/src/main.js +++ b/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 utils from './assets/js/utils' +import config from './assets/js/config'; +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 }