diff --git a/.electron-vue/dev-runner.js b/.electron-vue/dev-runner.js index 51633de..a0338df 100644 --- a/.electron-vue/dev-runner.js +++ b/.electron-vue/dev-runner.js @@ -41,6 +41,7 @@ function logStats (proc, data) { function startRenderer () { return new Promise((resolve, reject) => { rendererConfig.entry.renderer = [path.join(__dirname, 'dev-client')].concat(rendererConfig.entry.renderer) + //console.warn('warring123:'+rendererConfig.entry.renderer) rendererConfig.mode = 'development' const compiler = webpack(rendererConfig) hotMiddleware = webpackHotMiddleware(compiler, { diff --git a/.electron-vue/webpack.renderer.config.js b/.electron-vue/webpack.renderer.config.js index a0fc222..9419706 100644 --- a/.electron-vue/webpack.renderer.config.js +++ b/.electron-vue/webpack.renderer.config.js @@ -19,12 +19,15 @@ const { VueLoaderPlugin } = require('vue-loader') * that provide pure *.vue files that need compiling * https://simulatedgreg.gitbooks.io/electron-vue/content/en/webpack-configurations.html#white-listing-externals */ -let whiteListedModules = ['vue','ant-design-vue'] - +let whiteListedModules = ['vue'] let rendererConfig = { devtool: '#cheap-module-eval-source-map', entry: { - renderer: path.join(__dirname, '../src/renderer/main.js') + + renderer: path.join(__dirname, '../src/renderer/main.js'), + editor: path.join(__dirname,'../src/renderer/editor.js'), + + }, externals: [ ...Object.keys(dependencies || {}).filter(d => !whiteListedModules.includes(d)) @@ -56,15 +59,18 @@ let rendererConfig = { }, { test: /\.css$/, - use: ['vue-style-loader', 'css-loader'] + use: ['vue-style-loader', 'css-loader'], + }, + { test: /\.styl(us)?$/, use: [ 'vue-style-loader', 'css-loader', 'stylus-loader' - ] + ], + }, { test: /\.html$/, @@ -127,21 +133,89 @@ let rendererConfig = { __dirname: process.env.NODE_ENV !== 'production', __filename: process.env.NODE_ENV !== 'production' }, + optimization: { + minimize: process.env.NODE_ENV === 'production' ? true : false, //是否进行代码压缩 + splitChunks: { + chunks: "initial", + minSize: 30000, //模块大于30k会被抽离到公共模块 + minChunks: 2, //模块出现1次就会被抽离到公共模块 + maxAsyncRequests: 5, //异步模块,一次最多只能被加载5个 + maxInitialRequests: 3, //入口模块最多只能加载3个 + name: true, + cacheGroups: { + default: { + name : 'default', + minChunks: 2, + priority: -20, + reuseExistingChunk: true, + }, + vendors: { + test: /[\\/]node_modules[\\/]/, + priority: -10, + name : 'vendors' + } + } + }, + runtimeChunk:{ + name: "runtime" + } + }, plugins: [ new VueLoaderPlugin(), new MiniCssExtractPlugin({filename: 'styles.css'}), + new HtmlWebpackPlugin({ filename: 'index.html', template: path.resolve(__dirname, '../src/index.ejs'), + templateParameters(compilation, assets, options) { + return { + compilation: compilation, + webpack: compilation.getStats().toJson(), + webpackConfig: compilation.options, + htmlWebpackPlugin: { + files: assets, + options: options + }, + process, + }; + }, minify: { collapseWhitespace: true, removeAttributeQuotes: true, removeComments: true }, + chunks:['runtime','vendors','default','renderer'], + nodeModules: process.env.NODE_ENV !== 'production' ? path.resolve(__dirname, '../node_modules') : false }), + new HtmlWebpackPlugin({ + filename: 'editor.html', + template: path.resolve(__dirname, '../src/index.ejs'), + templateParameters(compilation, assets, options) { + return { + compilation: compilation, + webpack: compilation.getStats().toJson(), + webpackConfig: compilation.options, + htmlWebpackPlugin: { + files: assets, + options: options + }, + process, + }; + }, + minify: { + collapseWhitespace: true, + removeAttributeQuotes: true, + removeComments: true + }, + chunks:['runtime', 'vendors', 'default','editor'], + nodeModules: process.env.NODE_ENV !== 'production' + ? path.resolve(__dirname, '../node_modules') + : false + }) + , new webpack.HotModuleReplacementPlugin(), new webpack.NoEmitOnErrorsPlugin() ], diff --git a/.electron-vue/webpack.web.config.js b/.electron-vue/webpack.web.config.js index bde6701..95d7365 100644 --- a/.electron-vue/webpack.web.config.js +++ b/.electron-vue/webpack.web.config.js @@ -14,7 +14,8 @@ const { VueLoaderPlugin } = require('vue-loader') let webConfig = { devtool: '#cheap-module-eval-source-map', entry: { - web: path.join(__dirname, '../src/renderer/main.js') + web: path.join(__dirname, '../src/renderer/main.js'), + editor: path.join(__dirname,'../src/renderer/editor.js') }, module: { rules: [ @@ -43,8 +44,10 @@ let webConfig = { }, { test: /\.css$/, - use: ['vue-style-loader', 'css-loader'] + use: ['vue-style-loader','css-loader'], + }, + { test: /\.html$/, use: 'vue-html-loader' @@ -94,7 +97,7 @@ let webConfig = { plugins: [ new VueLoaderPlugin(), new MiniCssExtractPlugin({filename: 'styles.css'}), - new HtmlWebpackPlugin({ + ...[new HtmlWebpackPlugin({ filename: 'index.html', template: path.resolve(__dirname, '../src/index.ejs'), minify: { @@ -104,6 +107,29 @@ let webConfig = { }, nodeModules: false }), + new HtmlWebpackPlugin({ + filename: 'editor.html', + template: path.resolve(__dirname, '../src/editor.ejs'), + templateParameters(compilation, assets, options) { + return { + compilation: compilation, + webpack: compilation.getStats().toJson(), + webpackConfig: compilation.options, + htmlWebpackPlugin: { + files: assets, + options: options + }, + process, + }; + }, + minify: { + collapseWhitespace: true, + removeAttributeQuotes: true, + removeComments: true + }, + nodeModules: false + }), + ], new webpack.DefinePlugin({ 'process.env.IS_WEB': 'true' }), diff --git a/.eslintignore b/.eslintignore index d8b0d0a..a89fcff 100644 --- a/.eslintignore +++ b/.eslintignore @@ -1,3 +1,4 @@ test/unit/coverage/** test/unit/*.js test/e2e/*.js +node_modules/** diff --git a/.gitignore b/.gitignore index d6a56c0..6205477 100644 --- a/.gitignore +++ b/.gitignore @@ -1,4 +1,3 @@ - .DS_Store dist/electron/* dist/web/* @@ -14,4 +13,4 @@ thumbs.db yarn-error.log docs/dist/ yarn.lock -package-lock.json \ No newline at end of file +package-lock.json diff --git a/.vscode/settings.json b/.vscode/settings.json new file mode 100644 index 0000000..9431390 --- /dev/null +++ b/.vscode/settings.json @@ -0,0 +1,15 @@ +{ + "eslint.autoFixOnSave": true, + "eslint.validate": [ + "javascript", + "javascriptreact", + { + "language": "html", + "autoFix": true + }, + { + "language": "vue", + "autoFix": true + } + ] +} \ No newline at end of file diff --git a/README.md b/README.md index b2564f8..a22b159 100644 --- a/README.md +++ b/README.md @@ -1,21 +1,35 @@ # bloggo - +> 我的博客地址: https://gofugui.github.io/ > GitHub免费博客上传与管理工具 ## 产品愿景 > 用户可以通过本平台对自己的GitHub Pages进行构建和更新 -支持的功能有: +#### 当前支持的功能有: + - 文本编辑与记录 ✅ +#### feature + - markdown导入导出 + - 选择主题构建博客主题 + - 编辑博客内容并上传 + - 完善项目文档 +#### 图片展示 + +##### windows + +![1566785768](./doc/1566785768.jpg) - - 选择主题构建博客主题 - - 编辑博客内容并上传 - - ... +##### macOS +![WeChatf1d5cdd94ba1c5c50ab0712e316bd1da](./doc/WeChatf1d5cdd94ba1c5c50ab0712e316bd1da.png) +![WeChat1e375dbd1ad14707514792892c96e66d](./doc/WeChat1e375dbd1ad14707514792892c96e66d.png) +![WeChat5aea2e78492fad027c7ad23df2e7fdff](./doc/WeChat5aea2e78492fad027c7ad23df2e7fdff.png) +#### 目前支持的平台 +macOS、Windows #### Build Setup ``` bash # install dependencies -npm install +npm install or yarn # serve with hot reload at localhost:9080 npm run dev @@ -35,8 +49,8 @@ npm run lint ## 更新日志 > 项目在2019/05/10开始启动 -### v0.0.1 -项目初始化 +### v1.0.0 +项目初始化完成(2019/08/24) --- diff --git a/doc/1566785768.jpg b/doc/1566785768.jpg new file mode 100644 index 0000000..4eb7ea6 Binary files /dev/null and b/doc/1566785768.jpg differ diff --git a/doc/WeChat1e375dbd1ad14707514792892c96e66d.png b/doc/WeChat1e375dbd1ad14707514792892c96e66d.png new file mode 100644 index 0000000..cce5209 Binary files /dev/null and b/doc/WeChat1e375dbd1ad14707514792892c96e66d.png differ diff --git a/doc/WeChat5aea2e78492fad027c7ad23df2e7fdff.png b/doc/WeChat5aea2e78492fad027c7ad23df2e7fdff.png new file mode 100644 index 0000000..7a1635a Binary files /dev/null and b/doc/WeChat5aea2e78492fad027c7ad23df2e7fdff.png differ diff --git a/doc/WeChatf1d5cdd94ba1c5c50ab0712e316bd1da.png b/doc/WeChatf1d5cdd94ba1c5c50ab0712e316bd1da.png new file mode 100644 index 0000000..4e02394 Binary files /dev/null and b/doc/WeChatf1d5cdd94ba1c5c50ab0712e316bd1da.png differ diff --git a/package.json b/package.json index 2a2a935..b1aaea4 100644 --- a/package.json +++ b/package.json @@ -27,14 +27,28 @@ "postinstall": "npm run lint:fix" }, "dependencies": { + "@editorjs/checklist": "^1.1.0", + "@editorjs/code": "^2.4.1", + "@editorjs/embed": "^2.2.1", + "@editorjs/inline-code": "^1.3.0", + "@editorjs/link": "^2.1.3", + "@editorjs/list": "^1.4.0", + "@editorjs/marker": "^1.2.1", + "@editorjs/table": "^1.2.0", + "@editorjs/warning": "^1.1.1", "ant-design-vue": "^1.3.8", "axios": "^0.18.0", + "blueimp-md5": "^2.11.1", + "comws": "^2.1.0", "fs-extra": "^8.0.1", "hexo-cli": "^2.0.0", "iview": "^3.4.1", "lodash-id": "^0.14.0", "lowdb": "^1.0.0", - "mavon-editor": "^2.7.5", + + "moment": "^2.24.0", + "uuid": "^3.3.2", + "v-contextmenu": "^2.8.0", "vue": "^2.5.16", "vue-electron": "^1.0.6", "vue-router": "^3.0.1", @@ -43,6 +57,13 @@ "wordwrap": "^1.0.0" }, "devDependencies": { + "@editorjs/attaches": "^1.0.1", + "@editorjs/delimiter": "^1.1.0", + "@editorjs/editorjs": "^2.15.0", + "@editorjs/header": "^2.3.0", + "@editorjs/personality": "^2.0.1", + "@editorjs/quote": "^2.3.0", + "@editorjs/simple-image": "^1.3.2", "ajv": "^6.5.0", "babel-core": "^6.26.3", "babel-eslint": "^8.2.3", @@ -62,7 +83,7 @@ "css-loader": "^0.28.11", "del": "^3.0.0", "devtron": "^1.4.0", - "electron": "^2.0.4", + "electron": "^6.0.2", "electron-debug": "^1.5.0", "electron-devtools-installer": "^2.2.4", "electron-log": "^3.0.6", diff --git a/src/db/datastore.js b/src/db/datastore.js index 572b4bb..cd0a638 100644 --- a/src/db/datastore.js +++ b/src/db/datastore.js @@ -2,20 +2,38 @@ import Datastore from 'lowdb'; import FileSync from 'lowdb/adapters/FileSync'; import path from 'path'; import fs from 'fs-extra'; + import { app, remote } from 'electron'; const APP = process.type === 'renderer' ? remote.app : app; // 根据process.type来分辨在哪种模式使用哪种模块 const STORE_PATH = APP.getPath('userData'); // 获取electron应用的用户目录 - +console.log(STORE_PATH); if (process.type !== 'renderer') { if (!fs.pathExistsSync(STORE_PATH)) { fs.mkdirpSync(STORE_PATH); } } + const adapter = new FileSync(path.join(STORE_PATH, '/data.json')); // 初始化lowdb读写的json文件名以及存储路径 const db = Datastore(adapter); // lowdb接管该文件 +if (!db.get('tags').value()) { + db.defaults({ + tags: [], + posts: [], + images: [], + user: {}, + count: 0, + }).write(); +} + +if (!db.get('tags').value().length) { + const uuidV4 = require('uuid/v4'); + db.get('tags') + .push({ id: uuidV4(), name: '备忘录' }, { id: uuidV4(), name: '最近删除', EmptyNotShow: true }) + .write(); +} export default db; // 暴露出去 diff --git a/src/db/index.js b/src/db/index.js new file mode 100644 index 0000000..1b10c0e --- /dev/null +++ b/src/db/index.js @@ -0,0 +1,31 @@ +import db from './datastore'; +const uuidV4 = require('uuid/v4'); +// const _ = require('lodash-id'); + +export default { + add: (type, value) => { + if (!value.id) { + value.id = uuidV4(); + + value.timestamp = new Date().getTime(); + } + + db.get(type).push(value).write(); + return value.id; + }, + addAt: (type, value, index) => { + if (!value.id) { + value.id = uuidV4(); + } + db.get(type).splice(index, 0, value).sortBy('name').write(); + }, + + deleteById: (type, id) => db.get(type).remove({ id }).write(), + deleteByName: (type, name) => db.get(type).remove({ name }).write(), + select: (type, key, id) => (key ? db.get(type).value().filter(item => item[key] === id) : + db.get(type).value().concat([])), + selectCount: (type, key, id) => db.get(type).value().filter(item => item[key] === id).length, + update: (type, id, obj) => db.get(type).find({ id }).assign(obj).write(), + state: () => db.getState(), + setState: newState => db.setState(newState), +}; diff --git a/src/index.ejs b/src/index.ejs index c9f13da..05ac68c 100644 --- a/src/index.ejs +++ b/src/index.ejs @@ -2,24 +2,33 @@ - bloggo + + + BlogGO + <% if (htmlWebpackPlugin.options.nodeModules) { %> <% } %> +
+
+ <% if (!process.browser) { %> <% } %> - + diff --git a/src/main/index.js b/src/main/index.js index 507216e..a44117c 100644 --- a/src/main/index.js +++ b/src/main/index.js @@ -1,4 +1,5 @@ -import { app, BrowserWindow } from 'electron' // eslint-disable-line +import { app, BrowserWindow, ipcMain, systemPreferences } from 'electron'; +import store from '../renderer/store'; // eslint-disable-line /** * Set `__static` path to static files in production @@ -8,26 +9,52 @@ if (process.env.NODE_ENV !== 'development') { global.__static = require('path').join(__dirname, '/static').replace(/\\/g, '\\\\') // eslint-disable-line } +const childWindow = {}; let mainWindow; const winURL = process.env.NODE_ENV === 'development' ? 'http://localhost:9080' : `file://${__dirname}/index.html`; - +// const frame = process.platform === 'darwin'; function createWindow() { /** * Initial window options */ mainWindow = new BrowserWindow({ - height: 563, + useContentSize: true, - width: 1000, + fullscreenWindowTitle: true, + autoHideMenuBar: true, + backgroundColor: '#272c37', + width: 830, + minWidth: 550, + height: 900, + minHeight: 387, + darkTheme: true, + + webPreferences: { + nodeIntegration: true, + nodeIntegrationInWorker: true, + backgroundThrottling: false, + scrollBounce: true, + }, }); mainWindow.loadURL(winURL); mainWindow.on('closed', () => { + if (childWindow) { + Object.values(childWindow).forEach(item => item.close()); + } mainWindow = null; }); + // mainWindow.once('ready-to-show', () => { + // let canUseTouchBar = false; + // if (process.platform === 'darwin' && systemPreferences.canPromptTouchID()) { + // canUseTouchBar = true; + // } + + // store.dispatch('app/init', { canUseTouchBar, isUnLock: false }); + // }); } app.on('ready', createWindow); @@ -43,3 +70,66 @@ app.on('activate', () => { createWindow(); } }); + +ipcMain.on('asynchronous-message', (event, args) => { + const { time, id, isLock } = args; + if (childWindow[id]) { + const win = childWindow[id]; + win.restore(); + return; + } + const child = new BrowserWindow({ + show: false, + backgroundColor: '#272c37', + darkTheme: true, + minWidth: 550, + minHeight: 387, + webPreferences: { + nodeIntegration: true, + nodeIntegrationInWorker: true, + backgroundThrottling: false, + scrollBounce: true, + }, + }); + child.loadURL(`${winURL}/editor.html?id=${id}&&time=${time}&&isLock=${isLock}`); + child.once('ready-to-show', () => { + child.show(); + }); + child.once('closed', () => { + childWindow[id] = null; + }); + childWindow[id] = child; +}); + +/** + * type:事件类型 + * params + */ +ipcMain.on('asynchronous-touchBar', async (event, { type, tipInfo, params }) => { + if (process.platform === 'darwin') { + try { + const canPromptTouchID = systemPreferences.canPromptTouchID(); + if (!canPromptTouchID) return; + const [error, res] = await systemPreferences.promptTouchID(tipInfo) + .then(() => [null, true]).catch(err => [err, null]); + if (!error) { + if (res) { + event.reply('asynchronous-touchBar-ok'); + store.dispatch(type, params); + // console.log('You have successfully authenticated with Touch ID!'); + } + } + } catch (e) { + console.log(e); + } + } +}); + +// ipcMain.on('asynchronous-init', () => { +// let canUseTouchBar = false; +// if (process.platform === 'darwin' && systemPreferences.canPromptTouchID()) { +// canUseTouchBar = true; +// } +// console.log(canUseTouchBar); +// store.dispatch('app/init', { canUseTouchBar, isUnLock: false }); +// }); diff --git a/src/main/touchbar.js b/src/main/touchbar.js new file mode 100644 index 0000000..560e457 --- /dev/null +++ b/src/main/touchbar.js @@ -0,0 +1,27 @@ + + +const { TouchBar } = require('electron'); +const { TouchBarColorPicker, TouchBarButton } = TouchBar; + +module.exports = (dirname, eventEmitter) => { + const colorpicker = new TouchBarColorPicker({ + change: color => eventEmitter.emit('changeColor', color), + }); + const eyedropper = new TouchBarButton({ + icon: `${dirname}/resources/eyedropper-touchbar.png`, + click: () => eventEmitter.emit('launchPicker'), + }); + const colorsbook = new TouchBarButton({ + icon: `${dirname}/resources/colorsbook-touchbar.png`, + click: () => eventEmitter.emit('launchColorsbook'), + }); + const settings = new TouchBarButton({ + icon: `${dirname}/resources/settings-touchbar.png`, + click: () => eventEmitter.emit('showPreferences'), + }); + + const touchbar = new TouchBar([colorpicker, eyedropper, colorsbook, settings]); + + + return touchbar; +}; diff --git a/src/renderer/App.vue b/src/renderer/App.vue index 53c0cb1..b5f031c 100644 --- a/src/renderer/App.vue +++ b/src/renderer/App.vue @@ -1,28 +1,44 @@ - +import ContextMenu from './components/menu/ContextMenu'; + +import RouterLayout from './layouts/RouterLayout'; +export default { + + components: { + ContextMenu, RouterLayout, + }, + +}; + + ::-webkit-scrollbar + width 10px + ::-webkit-scrollbar-thumb + border-radius 10px + -webkit-box-shadow inset 0 0 8px rgba(0,0,0,0.2) + background #535353 + + ::-webkit-scrollbar-track + -webkit-box-shadow inset 0 0 8px rgba(0,0,0,0.3) + border-radius 10px + background-color rgba(85,85,93,.5) + #app + font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen", "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif; + font-size: 14px; + line-height: 1.5em; + background-color rgba(62,63,65,1) + color #fff + width 100vw + height 100vh + padding 0 + margin 0 + overflow hidden + \ No newline at end of file diff --git a/src/renderer/assets/eyedropper-touchbar.png b/src/renderer/assets/eyedropper-touchbar.png new file mode 100644 index 0000000..dd37573 Binary files /dev/null and b/src/renderer/assets/eyedropper-touchbar.png differ diff --git a/src/renderer/assets/font1/LICENSE.txt b/src/renderer/assets/font1/LICENSE.txt new file mode 100755 index 0000000..c20204e --- /dev/null +++ b/src/renderer/assets/font1/LICENSE.txt @@ -0,0 +1,75 @@ +Font license info + + +## Font Awesome + + Copyright (C) 2016 by Dave Gandy + + Author: Dave Gandy + License: SIL () + Homepage: http://fortawesome.github.com/Font-Awesome/ + + +## Typicons + + (c) Stephen Hutchings 2012 + + Author: Stephen Hutchings + License: SIL (http://scripts.sil.org/OFL) + Homepage: http://typicons.com/ + + +## Entypo + + Copyright (C) 2012 by Daniel Bruce + + Author: Daniel Bruce + License: SIL (http://scripts.sil.org/OFL) + Homepage: http://www.entypo.com + + +## Iconic + + Copyright (C) 2012 by P.J. Onori + + Author: P.J. Onori + License: SIL (http://scripts.sil.org/OFL) + Homepage: http://somerandomdude.com/work/iconic/ + + +## Web Symbols + + Copyright (c) 2011 by Just Be Nice studio. All rights reserved. + + Author: Just Be Nice studio + License: SIL (http://scripts.sil.org/OFL) + Homepage: http://www.justbenicestudio.com/ + + +## Elusive + + Copyright (C) 2013 by Aristeides Stathopoulos + + Author: Aristeides Stathopoulos + License: SIL (http://scripts.sil.org/OFL) + Homepage: http://aristeides.com/ + + +## Linecons + + Copyright (C) 2013 by Designmodo + + Author: Designmodo for Smashing Magazine + License: CC BY () + Homepage: http://designmodo.com/linecons-free/ + + +## MFG Labs + + Copyright (C) 2012 by Daniel Bruce + + Author: MFG Labs + License: SIL (http://scripts.sil.org/OFL) + Homepage: http://www.mfglabs.com/ + + diff --git a/src/renderer/assets/font1/README.txt b/src/renderer/assets/font1/README.txt new file mode 100755 index 0000000..beaab33 --- /dev/null +++ b/src/renderer/assets/font1/README.txt @@ -0,0 +1,75 @@ +This webfont is generated by http://fontello.com open source project. + + +================================================================================ +Please, note, that you should obey original font licenses, used to make this +webfont pack. Details available in LICENSE.txt file. + +- Usually, it's enough to publish content of LICENSE.txt file somewhere on your + site in "About" section. + +- If your project is open-source, usually, it will be ok to make LICENSE.txt + file publicly available in your repository. + +- Fonts, used in Fontello, don't require a clickable link on your site. + But any kind of additional authors crediting is welcome. +================================================================================ + + +Comments on archive content +--------------------------- + +- /font/* - fonts in different formats + +- /css/* - different kinds of css, for all situations. Should be ok with + twitter bootstrap. Also, you can skip style and assign icon classes + directly to text elements, if you don't mind about IE7. + +- demo.html - demo file, to show your webfont content + +- LICENSE.txt - license info about source fonts, used to build your one. + +- config.json - keeps your settings. You can import it back into fontello + anytime, to continue your work + + +Why so many CSS files ? +----------------------- + +Because we like to fit all your needs :) + +- basic file, .css - is usually enough, it contains @font-face + and character code definitions + +- *-ie7.css - if you need IE7 support, but still don't wish to put char codes + directly into html + +- *-codes.css and *-ie7-codes.css - if you like to use your own @font-face + rules, but still wish to benefit from css generation. That can be very + convenient for automated asset build systems. When you need to update font - + no need to manually edit files, just override old version with archive + content. See fontello source code for examples. + +- *-embedded.css - basic css file, but with embedded WOFF font, to avoid + CORS issues in Firefox and IE9+, when fonts are hosted on the separate domain. + We strongly recommend to resolve this issue by `Access-Control-Allow-Origin` + server headers. But if you ok with dirty hack - this file is for you. Note, + that data url moved to separate @font-face to avoid problems with + + + + + + + +
+

columns font demo

+ +
+
+
+
icon-cw0xe800
+
icon-ccw0xe801
+
icon-trash0xe802
+
icon-ok-circled20xe803
+
+
+
icon-trash-empty0xe804
+
icon-resize-full0xe805
+
icon-resize-small0xe806
+
icon-edit0xe807
+
+
+
icon-eye0xe808
+
icon-eye-off0xe809
+
icon-cancel0xe80a
+
icon-cog0xe80b
+
+
+
icon-indent-left0xe80c
+
icon-indent-right0xe80d
+
icon-menu0xe80e
+
icon-upload0xe80f
+
+
+
icon-upload-10xe810
+
icon-attach0xe811
+
icon-attach-10xe812
+
icon-attach-20xe813
+
+
+
icon-attach-circled0xe814
+
icon-th-large-outline0xe815
+
icon-attach-30xe816
+
icon-trash-20xe817
+
+
+
icon-cog-10xe818
+
icon-th-large0xe819
+
icon-link0xe81a
+
icon-cog-20xe81b
+
+
+
icon-search0xe81c
+
icon-th-thumb-empty0xf00b
+
icon-columns0xf0db
+
icon-upload-cloud0xf0ee
+
+
+
icon-doc-text0xf0f6
+
icon-circle-empty0xf10c
+
icon-ellipsis0xf141
+
icon-ellipsis-vert0xf142
+
+
+
icon-pencil-squared0xf14b
+
icon-dot-circled0xf192
+
icon-trash-10xf1f8
+
+
+ + + \ No newline at end of file diff --git a/src/renderer/assets/font1/font/columns.eot b/src/renderer/assets/font1/font/columns.eot new file mode 100755 index 0000000..4e27986 Binary files /dev/null and b/src/renderer/assets/font1/font/columns.eot differ diff --git a/src/renderer/assets/font1/font/columns.svg b/src/renderer/assets/font1/font/columns.svg new file mode 100755 index 0000000..8f53394 --- /dev/null +++ b/src/renderer/assets/font1/font/columns.svg @@ -0,0 +1,88 @@ + + + +Copyright (C) 2019 by original authors @ fontello.com + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + \ No newline at end of file diff --git a/src/renderer/assets/font1/font/columns.ttf b/src/renderer/assets/font1/font/columns.ttf new file mode 100755 index 0000000..9fab257 Binary files /dev/null and b/src/renderer/assets/font1/font/columns.ttf differ diff --git a/src/renderer/assets/font1/font/columns.woff b/src/renderer/assets/font1/font/columns.woff new file mode 100755 index 0000000..ba44597 Binary files /dev/null and b/src/renderer/assets/font1/font/columns.woff differ diff --git a/src/renderer/assets/font1/font/columns.woff2 b/src/renderer/assets/font1/font/columns.woff2 new file mode 100755 index 0000000..df1ea31 Binary files /dev/null and b/src/renderer/assets/font1/font/columns.woff2 differ diff --git a/src/renderer/assets/font2/demo.css b/src/renderer/assets/font2/demo.css new file mode 100644 index 0000000..a67054a --- /dev/null +++ b/src/renderer/assets/font2/demo.css @@ -0,0 +1,539 @@ +/* Logo 字体 */ +@font-face { + font-family: "iconfont logo"; + src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834'); + src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834#iefix') format('embedded-opentype'), + url('https://at.alicdn.com/t/font_985780_km7mi63cihi.woff?t=1545807318834') format('woff'), + url('https://at.alicdn.com/t/font_985780_km7mi63cihi.ttf?t=1545807318834') format('truetype'), + url('https://at.alicdn.com/t/font_985780_km7mi63cihi.svg?t=1545807318834#iconfont') format('svg'); +} + +.logo { + font-family: "iconfont logo"; + font-size: 160px; + font-style: normal; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +/* tabs */ +.nav-tabs { + position: relative; +} + +.nav-tabs .nav-more { + position: absolute; + right: 0; + bottom: 0; + height: 42px; + line-height: 42px; + color: #666; +} + +#tabs { + border-bottom: 1px solid #eee; +} + +#tabs li { + cursor: pointer; + width: 100px; + height: 40px; + line-height: 40px; + text-align: center; + font-size: 16px; + border-bottom: 2px solid transparent; + position: relative; + z-index: 1; + margin-bottom: -1px; + color: #666; +} + + +#tabs .active { + border-bottom-color: #f00; + color: #222; +} + +.tab-container .content { + display: none; +} + +/* 页面布局 */ +.main { + padding: 30px 100px; + width: 960px; + margin: 0 auto; +} + +.main .logo { + color: #333; + text-align: left; + margin-bottom: 30px; + line-height: 1; + height: 110px; + margin-top: -50px; + overflow: hidden; + *zoom: 1; +} + +.main .logo a { + font-size: 160px; + color: #333; +} + +.helps { + margin-top: 40px; +} + +.helps pre { + padding: 20px; + margin: 10px 0; + border: solid 1px #e7e1cd; + background-color: #fffdef; + overflow: auto; +} + +.icon_lists { + width: 100% !important; + overflow: hidden; + *zoom: 1; +} + +.icon_lists li { + width: 100px; + margin-bottom: 10px; + margin-right: 20px; + text-align: center; + list-style: none !important; + cursor: default; +} + +.icon_lists li .code-name { + line-height: 1.2; +} + +.icon_lists .icon { + display: block; + height: 100px; + line-height: 100px; + font-size: 42px; + margin: 10px auto; + color: #333; + -webkit-transition: font-size 0.25s linear, width 0.25s linear; + -moz-transition: font-size 0.25s linear, width 0.25s linear; + transition: font-size 0.25s linear, width 0.25s linear; +} + +.icon_lists .icon:hover { + font-size: 100px; +} + +.icon_lists .svg-icon { + /* 通过设置 font-size 来改变图标大小 */ + width: 1em; + /* 图标和文字相邻时,垂直对齐 */ + vertical-align: -0.15em; + /* 通过设置 color 来改变 SVG 的颜色/fill */ + fill: currentColor; + /* path 和 stroke 溢出 viewBox 部分在 IE 下会显示 + normalize.css 中也包含这行 */ + overflow: hidden; +} + +.icon_lists li .name, +.icon_lists li .code-name { + color: #666; +} + +/* markdown 样式 */ +.markdown { + color: #666; + font-size: 14px; + line-height: 1.8; +} + +.highlight { + line-height: 1.5; +} + +.markdown img { + vertical-align: middle; + max-width: 100%; +} + +.markdown h1 { + color: #404040; + font-weight: 500; + line-height: 40px; + margin-bottom: 24px; +} + +.markdown h2, +.markdown h3, +.markdown h4, +.markdown h5, +.markdown h6 { + color: #404040; + margin: 1.6em 0 0.6em 0; + font-weight: 500; + clear: both; +} + +.markdown h1 { + font-size: 28px; +} + +.markdown h2 { + font-size: 22px; +} + +.markdown h3 { + font-size: 16px; +} + +.markdown h4 { + font-size: 14px; +} + +.markdown h5 { + font-size: 12px; +} + +.markdown h6 { + font-size: 12px; +} + +.markdown hr { + height: 1px; + border: 0; + background: #e9e9e9; + margin: 16px 0; + clear: both; +} + +.markdown p { + margin: 1em 0; +} + +.markdown>p, +.markdown>blockquote, +.markdown>.highlight, +.markdown>ol, +.markdown>ul { + width: 80%; +} + +.markdown ul>li { + list-style: circle; +} + +.markdown>ul li, +.markdown blockquote ul>li { + margin-left: 20px; + padding-left: 4px; +} + +.markdown>ul li p, +.markdown>ol li p { + margin: 0.6em 0; +} + +.markdown ol>li { + list-style: decimal; +} + +.markdown>ol li, +.markdown blockquote ol>li { + margin-left: 20px; + padding-left: 4px; +} + +.markdown code { + margin: 0 3px; + padding: 0 5px; + background: #eee; + border-radius: 3px; +} + +.markdown strong, +.markdown b { + font-weight: 600; +} + +.markdown>table { + border-collapse: collapse; + border-spacing: 0px; + empty-cells: show; + border: 1px solid #e9e9e9; + width: 95%; + margin-bottom: 24px; +} + +.markdown>table th { + white-space: nowrap; + color: #333; + font-weight: 600; +} + +.markdown>table th, +.markdown>table td { + border: 1px solid #e9e9e9; + padding: 8px 16px; + text-align: left; +} + +.markdown>table th { + background: #F7F7F7; +} + +.markdown blockquote { + font-size: 90%; + color: #999; + border-left: 4px solid #e9e9e9; + padding-left: 0.8em; + margin: 1em 0; +} + +.markdown blockquote p { + margin: 0; +} + +.markdown .anchor { + opacity: 0; + transition: opacity 0.3s ease; + margin-left: 8px; +} + +.markdown .waiting { + color: #ccc; +} + +.markdown h1:hover .anchor, +.markdown h2:hover .anchor, +.markdown h3:hover .anchor, +.markdown h4:hover .anchor, +.markdown h5:hover .anchor, +.markdown h6:hover .anchor { + opacity: 1; + display: inline-block; +} + +.markdown>br, +.markdown>p>br { + clear: both; +} + + +.hljs { + display: block; + background: white; + padding: 0.5em; + color: #333333; + overflow-x: auto; +} + +.hljs-comment, +.hljs-meta { + color: #969896; +} + +.hljs-string, +.hljs-variable, +.hljs-template-variable, +.hljs-strong, +.hljs-emphasis, +.hljs-quote { + color: #df5000; +} + +.hljs-keyword, +.hljs-selector-tag, +.hljs-type { + color: #a71d5d; +} + +.hljs-literal, +.hljs-symbol, +.hljs-bullet, +.hljs-attribute { + color: #0086b3; +} + +.hljs-section, +.hljs-name { + color: #63a35c; +} + +.hljs-tag { + color: #333333; +} + +.hljs-title, +.hljs-attr, +.hljs-selector-id, +.hljs-selector-class, +.hljs-selector-attr, +.hljs-selector-pseudo { + color: #795da3; +} + +.hljs-addition { + color: #55a532; + background-color: #eaffea; +} + +.hljs-deletion { + color: #bd2c00; + background-color: #ffecec; +} + +.hljs-link { + text-decoration: underline; +} + +/* 代码高亮 */ +/* PrismJS 1.15.0 +https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript */ +/** + * prism.js default theme for JavaScript, CSS and HTML + * Based on dabblet (http://dabblet.com) + * @author Lea Verou + */ +code[class*="language-"], +pre[class*="language-"] { + color: black; + background: none; + text-shadow: 0 1px white; + font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace; + text-align: left; + white-space: pre; + word-spacing: normal; + word-break: normal; + word-wrap: normal; + line-height: 1.5; + + -moz-tab-size: 4; + -o-tab-size: 4; + tab-size: 4; + + -webkit-hyphens: none; + -moz-hyphens: none; + -ms-hyphens: none; + hyphens: none; +} + +pre[class*="language-"]::-moz-selection, +pre[class*="language-"] ::-moz-selection, +code[class*="language-"]::-moz-selection, +code[class*="language-"] ::-moz-selection { + text-shadow: none; + background: #b3d4fc; +} + +pre[class*="language-"]::selection, +pre[class*="language-"] ::selection, +code[class*="language-"]::selection, +code[class*="language-"] ::selection { + text-shadow: none; + background: #b3d4fc; +} + +@media print { + + code[class*="language-"], + pre[class*="language-"] { + text-shadow: none; + } +} + +/* Code blocks */ +pre[class*="language-"] { + padding: 1em; + margin: .5em 0; + overflow: auto; +} + +:not(pre)>code[class*="language-"], +pre[class*="language-"] { + background: #f5f2f0; +} + +/* Inline code */ +:not(pre)>code[class*="language-"] { + padding: .1em; + border-radius: .3em; + white-space: normal; +} + +.token.comment, +.token.prolog, +.token.doctype, +.token.cdata { + color: slategray; +} + +.token.punctuation { + color: #999; +} + +.namespace { + opacity: .7; +} + +.token.property, +.token.tag, +.token.boolean, +.token.number, +.token.constant, +.token.symbol, +.token.deleted { + color: #905; +} + +.token.selector, +.token.attr-name, +.token.string, +.token.char, +.token.builtin, +.token.inserted { + color: #690; +} + +.token.operator, +.token.entity, +.token.url, +.language-css .token.string, +.style .token.string { + color: #9a6e3a; + background: hsla(0, 0%, 100%, .5); +} + +.token.atrule, +.token.attr-value, +.token.keyword { + color: #07a; +} + +.token.function, +.token.class-name { + color: #DD4A68; +} + +.token.regex, +.token.important, +.token.variable { + color: #e90; +} + +.token.important, +.token.bold { + font-weight: bold; +} + +.token.italic { + font-style: italic; +} + +.token.entity { + cursor: help; +} diff --git a/src/renderer/assets/font2/demo_index.html b/src/renderer/assets/font2/demo_index.html new file mode 100644 index 0000000..16f3e76 --- /dev/null +++ b/src/renderer/assets/font2/demo_index.html @@ -0,0 +1,375 @@ + + + + + IconFont Demo + + + + + + + + + + + +
+

+ +
+
+
    + +
  • + 󰀣 +
    unlock
    +
    &#xf0023;
    +
  • + +
  • + +
    fix
    +
    &#xe68d;
    +
  • + +
  • + +
    指纹
    +
    &#xe602;
    +
  • + +
  • + +
    editor-siderbar
    +
    &#xe6b5;
    +
  • + +
  • + +
    unlock
    +
    &#xe69a;
    +
  • + +
  • + +
    columns
    +
    &#xe796;
    +
  • + +
  • + +
    签到
    +
    &#xe78f;
    +
  • + +
  • + +
    删除
    +
    &#xe790;
    +
  • + +
  • + +
    设置2
    +
    &#xe791;
    +
  • + +
+
+

Unicode 引用

+
+ +

Unicode 是字体在网页端最原始的应用方式,特点是:

+
    +
  • 兼容性最好,支持 IE6+,及所有现代浏览器。
  • +
  • 支持按字体的方式去动态调整图标大小,颜色等等。
  • +
  • 但是因为是字体,所以不支持多色。只能使用平台里单色的图标,就算项目里有多色图标也会自动去色。
  • +
+
+

注意:新版 iconfont 支持多色图标,这些多色图标在 Unicode 模式下将不能使用,如果有需求建议使用symbol 的引用方式

+
+

Unicode 使用步骤如下:

+

第一步:拷贝项目下面生成的 @font-face

+
@font-face {
+  font-family: 'iconfont';
+  src: url('iconfont.eot');
+  src: url('iconfont.eot?#iefix') format('embedded-opentype'),
+      url('iconfont.woff2') format('woff2'),
+      url('iconfont.woff') format('woff'),
+      url('iconfont.ttf') format('truetype'),
+      url('iconfont.svg#iconfont') format('svg');
+}
+
+

第二步:定义使用 iconfont 的样式

+
.iconfont {
+  font-family: "iconfont" !important;
+  font-size: 16px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+

第三步:挑选相应图标并获取字体编码,应用于页面

+
+<span class="iconfont">&#x33;</span>
+
+
+

"iconfont" 是你项目下的 font-family。可以通过编辑项目查看,默认是 "iconfont"。

+
+
+
+
+
    + +
  • + +
    + unlock +
    +
    .icon-unlock +
    +
  • + +
  • + +
    + fix +
    +
    .icon-fix +
    +
  • + +
  • + +
    + 指纹 +
    +
    .icon-zhiwen +
    +
  • + +
  • + +
    + editor-siderbar +
    +
    .icon-editor-siderbar +
    +
  • + +
  • + +
    + unlock +
    +
    .icon-unlock1 +
    +
  • + +
  • + +
    + columns +
    +
    .icon-columns +
    +
  • + +
  • + +
    + 签到 +
    +
    .icon-qiandao +
    +
  • + +
  • + +
    + 删除 +
    +
    .icon-shanchu +
    +
  • + +
  • + +
    + 设置2 +
    +
    .icon-shezhi +
    +
  • + +
+
+

font-class 引用

+
+ +

font-class 是 Unicode 使用方式的一种变种,主要是解决 Unicode 书写不直观,语意不明确的问题。

+

与 Unicode 使用方式相比,具有如下特点:

+
    +
  • 兼容性良好,支持 IE8+,及所有现代浏览器。
  • +
  • 相比于 Unicode 语意明确,书写更直观。可以很容易分辨这个 icon 是什么。
  • +
  • 因为使用 class 来定义图标,所以当要替换图标时,只需要修改 class 里面的 Unicode 引用。
  • +
  • 不过因为本质上还是使用的字体,所以多色图标还是不支持的。
  • +
+

使用步骤如下:

+

第一步:引入项目下面生成的 fontclass 代码:

+
<link rel="stylesheet" href="./iconfont.css">
+
+

第二步:挑选相应图标并获取类名,应用于页面:

+
<span class="iconfont icon-xxx"></span>
+
+
+

" + iconfont" 是你项目下的 font-family。可以通过编辑项目查看,默认是 "iconfont"。

+
+
+
+
+
    + +
  • + +
    unlock
    +
    #icon-unlock
    +
  • + +
  • + +
    fix
    +
    #icon-fix
    +
  • + +
  • + +
    指纹
    +
    #icon-zhiwen
    +
  • + +
  • + +
    editor-siderbar
    +
    #icon-editor-siderbar
    +
  • + +
  • + +
    unlock
    +
    #icon-unlock1
    +
  • + +
  • + +
    columns
    +
    #icon-columns
    +
  • + +
  • + +
    签到
    +
    #icon-qiandao
    +
  • + +
  • + +
    删除
    +
    #icon-shanchu
    +
  • + +
  • + +
    设置2
    +
    #icon-shezhi
    +
  • + +
+
+

Symbol 引用

+
+ +

这是一种全新的使用方式,应该说这才是未来的主流,也是平台目前推荐的用法。相关介绍可以参考这篇文章 + 这种用法其实是做了一个 SVG 的集合,与另外两种相比具有如下特点:

+
    +
  • 支持多色图标了,不再受单色限制。
  • +
  • 通过一些技巧,支持像字体那样,通过 font-size, color 来调整样式。
  • +
  • 兼容性较差,支持 IE9+,及现代浏览器。
  • +
  • 浏览器渲染 SVG 的性能一般,还不如 png。
  • +
+

使用步骤如下:

+

第一步:引入项目下面生成的 symbol 代码:

+
<script src="./iconfont.js"></script>
+
+

第二步:加入通用 CSS 代码(引入一次就行):

+
<style>
+.icon {
+  width: 1em;
+  height: 1em;
+  vertical-align: -0.15em;
+  fill: currentColor;
+  overflow: hidden;
+}
+</style>
+
+

第三步:挑选相应图标并获取类名,应用于页面:

+
<svg class="icon" aria-hidden="true">
+  <use xlink:href="#icon-xxx"></use>
+</svg>
+
+
+
+ +
+
+ + + diff --git a/src/renderer/assets/font2/iconfont.css b/src/renderer/assets/font2/iconfont.css new file mode 100644 index 0000000..8169d7c --- /dev/null +++ b/src/renderer/assets/font2/iconfont.css @@ -0,0 +1,53 @@ +@font-face {font-family: "iconfont"; + src: url('iconfont.eot?t=1566200528974'); /* IE9 */ + src: url('iconfont.eot?t=1566200528974#iefix') format('embedded-opentype'), /* IE6-IE8 */ + url('data:application/x-font-woff2;charset=utf-8;base64,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') format('woff2'), + url('iconfont.woff?t=1566200528974') format('woff'), + url('iconfont.ttf?t=1566200528974') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */ + url('iconfont.svg?t=1566200528974#iconfont') format('svg'); /* iOS 4.1- */ +} + +.iconfont { + font-family: "iconfont" !important; + font-size: 16px; + font-style: normal; + -webkit-font-smoothing: antialiased; + -moz-osx-font-smoothing: grayscale; +} + +.icon-unlock:before { + content: "\f0023"; +} + +.icon-fix:before { + content: "\e68d"; +} + +.icon-zhiwen:before { + content: "\e602"; +} + +.icon-editor-siderbar:before { + content: "\e6b5"; +} + +.icon-unlock1:before { + content: "\e69a"; +} + +.icon-columns:before { + content: "\e796"; +} + +.icon-qiandao:before { + content: "\e78f"; +} + +.icon-shanchu:before { + content: "\e790"; +} + +.icon-shezhi:before { + content: "\e791"; +} + diff --git a/src/renderer/assets/font2/iconfont.eot b/src/renderer/assets/font2/iconfont.eot new file mode 100644 index 0000000..d17388d Binary files /dev/null and b/src/renderer/assets/font2/iconfont.eot differ diff --git a/src/renderer/assets/font2/iconfont.js b/src/renderer/assets/font2/iconfont.js new file mode 100644 index 0000000..4375f85 --- /dev/null +++ b/src/renderer/assets/font2/iconfont.js @@ -0,0 +1,13 @@ +!(function (n) { + let c, + a = '', + l = (c = document.getElementsByTagName('script'))[c.length - 1].getAttribute('data-injectcss'); if (l && !n.__iconfont__svg__cssinject__) { n.__iconfont__svg__cssinject__ = !0; try { document.write(''); } catch (c) { console && console.log(c); } }!(function (c) { + if (document.addEventListener) if (~['complete', 'loaded', 'interactive'].indexOf(document.readyState))setTimeout(c, 0); else { var l = function () { document.removeEventListener('DOMContentLoaded', l, !1), c(); }; document.addEventListener('DOMContentLoaded', l, !1); } else document.attachEvent && (t = c, e = n.document, i = !1, (o = function () { try { e.documentElement.doScroll('left'); } catch (c) { return void setTimeout(o, 50); }a(); })(), e.onreadystatechange = function () { e.readyState == 'complete' && (e.onreadystatechange = null, a()); }); function a() { i || (i = !0, t()); } let t, + e, + i, + o; + }(() => { + let c, + l; (c = document.createElement('div')).innerHTML = a, a = null, (l = c.getElementsByTagName('svg')[0]) && (l.setAttribute('aria-hidden', 'true'), l.style.position = 'absolute', l.style.width = 0, l.style.height = 0, l.style.overflow = 'hidden', (function (c, l) { l.firstChild ? (function (c, l) { l.parentNode.insertBefore(c, l); }(c, l.firstChild)) : l.appendChild(c); }(l, document.body))); + })); +}(window)); diff --git a/src/renderer/assets/font2/iconfont.svg b/src/renderer/assets/font2/iconfont.svg new file mode 100644 index 0000000..43f2e3a --- /dev/null +++ b/src/renderer/assets/font2/iconfont.svg @@ -0,0 +1,53 @@ + + + + + +Created by iconfont + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/renderer/assets/font2/iconfont.ttf b/src/renderer/assets/font2/iconfont.ttf new file mode 100644 index 0000000..25131f2 Binary files /dev/null and b/src/renderer/assets/font2/iconfont.ttf differ diff --git a/src/renderer/assets/font2/iconfont.woff b/src/renderer/assets/font2/iconfont.woff new file mode 100644 index 0000000..db12c07 Binary files /dev/null and b/src/renderer/assets/font2/iconfont.woff differ diff --git a/src/renderer/assets/font2/iconfont.woff2 b/src/renderer/assets/font2/iconfont.woff2 new file mode 100644 index 0000000..b957c8c Binary files /dev/null and b/src/renderer/assets/font2/iconfont.woff2 differ diff --git a/src/renderer/assets/settings-touchbar.png b/src/renderer/assets/settings-touchbar.png new file mode 100644 index 0000000..7b24464 Binary files /dev/null and b/src/renderer/assets/settings-touchbar.png differ diff --git a/src/renderer/common/js/bus.js b/src/renderer/common/js/bus.js new file mode 100644 index 0000000..c17d88a --- /dev/null +++ b/src/renderer/common/js/bus.js @@ -0,0 +1,2 @@ +import Vue from 'vue'; +export default new Vue(); diff --git a/src/renderer/components/menu/ContextMenu.vue b/src/renderer/components/menu/ContextMenu.vue new file mode 100644 index 0000000..55d761f --- /dev/null +++ b/src/renderer/components/menu/ContextMenu.vue @@ -0,0 +1,188 @@ + + + + \ No newline at end of file diff --git a/src/renderer/components/menu/SiderMenu.vue b/src/renderer/components/menu/SiderMenu.vue index a07df79..d01890f 100644 --- a/src/renderer/components/menu/SiderMenu.vue +++ b/src/renderer/components/menu/SiderMenu.vue @@ -23,7 +23,7 @@ export default { text-align: center background-color: rgba(57,58,61,255) position: fixed - height: 100vh + height: 100% .icon margin-top: 1.25rem diff --git a/src/renderer/components/menu/TopMenu.vue b/src/renderer/components/menu/TopMenu.vue new file mode 100644 index 0000000..3e991b5 --- /dev/null +++ b/src/renderer/components/menu/TopMenu.vue @@ -0,0 +1,127 @@ + + + \ No newline at end of file diff --git a/src/renderer/components/setting/index.vue b/src/renderer/components/setting/index.vue deleted file mode 100644 index 805995b..0000000 --- a/src/renderer/components/setting/index.vue +++ /dev/null @@ -1,13 +0,0 @@ - - - \ No newline at end of file diff --git a/src/renderer/components/sider/DrawerSider.vue b/src/renderer/components/sider/DrawerSider.vue new file mode 100644 index 0000000..382c477 --- /dev/null +++ b/src/renderer/components/sider/DrawerSider.vue @@ -0,0 +1,217 @@ + + + \ No newline at end of file diff --git a/src/renderer/components/sider/LeftSider.vue b/src/renderer/components/sider/LeftSider.vue index 8807598..1c10bb5 100644 --- a/src/renderer/components/sider/LeftSider.vue +++ b/src/renderer/components/sider/LeftSider.vue @@ -1,100 +1,505 @@ - \ No newline at end of file diff --git a/src/renderer/components/sider/index.vue b/src/renderer/components/sider/index.vue deleted file mode 100644 index 4dc2062..0000000 --- a/src/renderer/components/sider/index.vue +++ /dev/null @@ -1,123 +0,0 @@ - - - \ No newline at end of file diff --git a/src/renderer/components/split-pane/index.vue b/src/renderer/components/split-pane/index.vue new file mode 100644 index 0000000..7ba4a25 --- /dev/null +++ b/src/renderer/components/split-pane/index.vue @@ -0,0 +1,155 @@ + + + + + \ No newline at end of file diff --git a/src/renderer/components/split-pane/pane.vue b/src/renderer/components/split-pane/pane.vue new file mode 100644 index 0000000..cafbd79 --- /dev/null +++ b/src/renderer/components/split-pane/pane.vue @@ -0,0 +1,55 @@ + + + + + \ No newline at end of file diff --git a/src/renderer/components/split-pane/resizer.vue b/src/renderer/components/split-pane/resizer.vue new file mode 100644 index 0000000..b08910d --- /dev/null +++ b/src/renderer/components/split-pane/resizer.vue @@ -0,0 +1,54 @@ + + + + + \ No newline at end of file diff --git a/src/renderer/components/tools/Drawer.vue b/src/renderer/components/tools/Drawer.vue index d9547cc..9c91158 100644 --- a/src/renderer/components/tools/Drawer.vue +++ b/src/renderer/components/tools/Drawer.vue @@ -1,6 +1,6 @@