diff --git a/package-lock.json b/package-lock.json index 4a3c3581..0927b8f2 100644 --- a/package-lock.json +++ b/package-lock.json @@ -3195,6 +3195,17 @@ "integrity": "sha1-2jCcwmPfFZlMaIypAheco8fNfH4=", "dev": true }, + "clone-deep": { + "version": "4.0.1", + "resolved": "https://registry.npmjs.org/clone-deep/-/clone-deep-4.0.1.tgz", + "integrity": "sha512-neHB9xuzh/wk0dIHweyAXv2aPGZIVk3pLMe+/RNzINf17fe0OG96QroktYAUm7SM1PBnzTabaLboqqxDyMU+SQ==", + "dev": true, + "requires": { + "is-plain-object": "^2.0.4", + "kind-of": "^6.0.2", + "shallow-clone": "^3.0.0" + } + }, "coa": { "version": "2.0.2", "resolved": "https://registry.npmjs.org/coa/-/coa-2.0.2.tgz", @@ -3640,6 +3651,11 @@ "randomfill": "^1.0.3" } }, + "crypto-js": { + "version": "3.3.0", + "resolved": "https://registry.npmjs.org/crypto-js/-/crypto-js-3.3.0.tgz", + "integrity": "sha512-DIT51nX0dCfKltpRiXV+/TVZq+Qq2NgF4644+K7Ttnla7zEzqc+kjJyiB96BHNyUTBxyjzRcZYpUdZa+QAqi6Q==" + }, "css-color-names": { "version": "0.0.4", "resolved": "https://registry.npmjs.org/css-color-names/-/css-color-names-0.0.4.tgz", @@ -5246,6 +5262,11 @@ } } }, + "font-awesome": { + "version": "4.7.0", + "resolved": "https://registry.npmjs.org/font-awesome/-/font-awesome-4.7.0.tgz", + "integrity": "sha1-j6jPBBGhoxr9B7BtKQK7n8gVoTM=" + }, "for-in": { "version": "1.0.2", "resolved": "https://registry.npmjs.org/for-in/-/for-in-1.0.2.tgz", @@ -6665,6 +6686,12 @@ } } }, + "interpret": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/interpret/-/interpret-1.2.0.tgz", + "integrity": "sha512-mT34yGKMNceBQUoVn7iCDKDntA7SC6gycMAWzGx1z/CMCTV7b2AAtXlo3nRyHZ1FelRkQbQjprHSYGwzLtkVbw==", + "dev": true + }, "invariant": { "version": "2.2.4", "resolved": "https://registry.npmjs.org/invariant/-/invariant-2.2.4.tgz", @@ -10050,6 +10077,15 @@ "readable-stream": "^2.0.2" } }, + "rechoir": { + "version": "0.6.2", + "resolved": "https://registry.npmjs.org/rechoir/-/rechoir-0.6.2.tgz", + "integrity": "sha1-hSBLVNuoLVdC4oyWdW70OvUOM4Q=", + "dev": true, + "requires": { + "resolve": "^1.1.6" + } + }, "regenerate": { "version": "1.4.0", "resolved": "https://registry.npmjs.org/regenerate/-/regenerate-1.4.0.tgz", @@ -10386,6 +10422,11 @@ "inherits": "^2.0.1" } }, + "roboto-fontface": { + "version": "0.10.0", + "resolved": "https://registry.npmjs.org/roboto-fontface/-/roboto-fontface-0.10.0.tgz", + "integrity": "sha512-OlwfYEgA2RdboZohpldlvJ1xngOins5d7ejqnIBWr9KaMxsnBqotpptRXTyfNRLnFpqzX6sTDt+X+a+6udnU8g==" + }, "run-async": { "version": "2.4.0", "resolved": "https://registry.npmjs.org/run-async/-/run-async-2.4.0.tgz", @@ -10440,6 +10481,36 @@ "integrity": "sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==", "dev": true }, + "sass": { + "version": "1.26.3", + "resolved": "https://registry.npmjs.org/sass/-/sass-1.26.3.tgz", + "integrity": "sha512-5NMHI1+YFYw4sN3yfKjpLuV9B5l7MqQ6FlkTcC4FT+oHbBRUZoSjHrrt/mE0nFXJyY2kQtU9ou9HxvFVjLFuuw==", + "dev": true, + "requires": { + "chokidar": ">=2.0.0 <4.0.0" + } + }, + "sass-loader": { + "version": "8.0.2", + "resolved": "https://registry.npmjs.org/sass-loader/-/sass-loader-8.0.2.tgz", + "integrity": "sha512-7o4dbSK8/Ol2KflEmSco4jTjQoV988bM82P9CZdmo9hR3RLnvNc0ufMNdMrB0caq38JQ/FgF4/7RcbcfKzxoFQ==", + "dev": true, + "requires": { + "clone-deep": "^4.0.1", + "loader-utils": "^1.2.3", + "neo-async": "^2.6.1", + "schema-utils": "^2.6.1", + "semver": "^6.3.0" + }, + "dependencies": { + "semver": { + "version": "6.3.0", + "resolved": "https://registry.npmjs.org/semver/-/semver-6.3.0.tgz", + "integrity": "sha512-b39TBaTSfV6yBrapU89p5fKekE2m/NwnDocOVruQFS1/veMgdzuPcnOM34M6CwxW8jH/lxEa5rBoDeUwu5HHTw==", + "dev": true + } + } + }, "sax": { "version": "1.2.4", "resolved": "https://registry.npmjs.org/sax/-/sax-1.2.4.tgz", @@ -10660,6 +10731,15 @@ "safe-buffer": "^5.0.1" } }, + "shallow-clone": { + "version": "3.0.1", + "resolved": "https://registry.npmjs.org/shallow-clone/-/shallow-clone-3.0.1.tgz", + "integrity": "sha512-/6KqX+GVUdqPuPPd2LxDDxzX6CAbjJehAAOKlNpqqUpAqPM6HeL8f+o3a+JsyGjn2lv0WY8UsTgUJjU9Ok55NA==", + "dev": true, + "requires": { + "kind-of": "^6.0.2" + } + }, "shebang-command": { "version": "1.2.0", "resolved": "https://registry.npmjs.org/shebang-command/-/shebang-command-1.2.0.tgz", @@ -10681,6 +10761,17 @@ "integrity": "sha512-mRz/m/JVscCrkMyPqHc/bczi3OQHkLTqXHEFu0zDhK/qfv3UcOA4SVmRCLmos4bhjr9ekVQubj/R7waKapmiQg==", "dev": true }, + "shelljs": { + "version": "0.8.3", + "resolved": "https://registry.npmjs.org/shelljs/-/shelljs-0.8.3.tgz", + "integrity": "sha512-fc0BKlAWiLpwZljmOvAOTE/gXawtCoNrP5oaY7KIaQbbyHeQVg01pSEuEGvGh3HEdBU4baCD7wQBwADmM/7f7A==", + "dev": true, + "requires": { + "glob": "^7.0.0", + "interpret": "^1.0.0", + "rechoir": "^0.6.2" + } + }, "signal-exit": { "version": "3.0.3", "resolved": "https://registry.npmjs.org/signal-exit/-/signal-exit-3.0.3.tgz", @@ -12013,6 +12104,37 @@ "resolved": "https://registry.npmjs.org/vue/-/vue-2.6.11.tgz", "integrity": "sha512-VfPwgcGABbGAue9+sfrD4PuwFar7gPb1yl1UK1MwXoQPAw0BKSqWfoYCT/ThFrdEVWoI51dBuyCoiNU9bZDZxQ==" }, + "vue-async-computed": { + "version": "3.8.2", + "resolved": "https://registry.npmjs.org/vue-async-computed/-/vue-async-computed-3.8.2.tgz", + "integrity": "sha512-If5roOhp/x0WWd0TWRD77YsuFoiIw3MbkcRlIB/FE3TqQCPje52eQp5CV5NN/7B0VAyPuGX5JQa+rc9AOcGAYw==" + }, + "vue-cli-plugin-vuetify": { + "version": "2.0.5", + "resolved": "https://registry.npmjs.org/vue-cli-plugin-vuetify/-/vue-cli-plugin-vuetify-2.0.5.tgz", + "integrity": "sha512-jtxcidjLT5f1H9QLYKLFjo/ZG42ud4pI9bK3WNO5DXyhiMDMTwSZ7b3NcJVRH7tKYbv5/ty0VPdDGlf4w22AMA==", + "dev": true, + "requires": { + "semver": "^7.1.2", + "shelljs": "^0.8.3" + }, + "dependencies": { + "semver": { + "version": "7.2.1", + "resolved": "https://registry.npmjs.org/semver/-/semver-7.2.1.tgz", + "integrity": "sha512-aHhm1pD02jXXkyIpq25qBZjr3CQgg8KST8uX0OWXch3xE6jw+1bfbWnCjzMwojsTquroUmKFHNzU6x26mEiRxw==", + "dev": true + } + } + }, + "vue-cryptojs": { + "version": "2.1.4", + "resolved": "https://registry.npmjs.org/vue-cryptojs/-/vue-cryptojs-2.1.4.tgz", + "integrity": "sha512-AmJ5HAbvW81X4DLzq5Q3YlFbFIr1vSAmjXcr5SxyJCJeoH/2R+HHuU6D21pI2pAv4LCqfRpakWMWs6Cl8XvtAA==", + "requires": { + "crypto-js": "^3.3.0" + } + }, "vue-eslint-parser": { "version": "7.0.0", "resolved": "https://registry.npmjs.org/vue-eslint-parser/-/vue-eslint-parser-7.0.0.tgz", @@ -12105,6 +12227,25 @@ "integrity": "sha512-4gDntzrifFnCEvyoO8PqyJDmguXgVPxKiIxrBKjIowvL9l+N66196+72XVYR8BBf1Uv1Fgt3bGevJ+sEmxfZzw==", "dev": true }, + "vuetify": { + "version": "2.2.20", + "resolved": "https://registry.npmjs.org/vuetify/-/vuetify-2.2.20.tgz", + "integrity": "sha512-tiij3ammBiG7QrdwRBJxW917AyDLcMekRtLosdyVshDKHA5CpKrru8Ljn1gAmeUyhYZyUw4gz3XbrrIJ++TP7w==" + }, + "vuetify-loader": { + "version": "1.4.3", + "resolved": "https://registry.npmjs.org/vuetify-loader/-/vuetify-loader-1.4.3.tgz", + "integrity": "sha512-fS0wRil682Ebsj2as+eruBoMPKaQYDhu/fDAndnTItzSY4RK4LOEIsssVL4vD6QY8dvUgoGL84SUQ6vGr777CA==", + "dev": true, + "requires": { + "loader-utils": "^1.2.0" + } + }, + "vuetify-toast-snackbar": { + "version": "0.6.1", + "resolved": "https://registry.npmjs.org/vuetify-toast-snackbar/-/vuetify-toast-snackbar-0.6.1.tgz", + "integrity": "sha512-F2bLPMXiw7qQgX68adSu0zQrMTKODN5JAzCP8AP/HGhz/Bz1z24QbvYcX0fyHnG/yP6PAPkpMCXsLQSq6HV0Ag==" + }, "watchpack": { "version": "1.6.1", "resolved": "https://registry.npmjs.org/watchpack/-/watchpack-1.6.1.tgz", diff --git a/package.json b/package.json index ce075383..de264d17 100644 --- a/package.json +++ b/package.json @@ -9,9 +9,15 @@ }, "dependencies": { "core-js": "^3.6.4", + "font-awesome": "^4.7.0", "register-service-worker": "^1.7.1", + "roboto-fontface": "*", "vue": "^2.6.11", - "vue-router": "^3.1.6" + "vue-async-computed": "^3.8.2", + "vue-cryptojs": "^2.1.4", + "vue-router": "^3.1.6", + "vuetify": "^2.2.11", + "vuetify-toast-snackbar": "^0.6.1" }, "devDependencies": { "@vue/cli-plugin-babel": "~4.3.0", @@ -25,7 +31,11 @@ "less": "^3.0.4", "less-loader": "^5.0.0", "lint-staged": "^9.5.0", - "vue-template-compiler": "^2.6.11" + "sass": "^1.19.0", + "sass-loader": "^8.0.0", + "vue-cli-plugin-vuetify": "~2.0.5", + "vue-template-compiler": "^2.6.11", + "vuetify-loader": "^1.3.0" }, "gitHooks": { "pre-commit": "lint-staged" diff --git a/src/App.vue b/src/App.vue index 1a221f08..4defee6e 100644 --- a/src/App.vue +++ b/src/App.vue @@ -1,32 +1,172 @@ - + + + \ No newline at end of file diff --git a/src/assets/logo.svg b/src/assets/logo.svg new file mode 100644 index 00000000..145b6d13 --- /dev/null +++ b/src/assets/logo.svg @@ -0,0 +1 @@ +Artboard 46 diff --git a/src/components/Hash.vue b/src/components/Hash.vue new file mode 100644 index 00000000..3a88a03a --- /dev/null +++ b/src/components/Hash.vue @@ -0,0 +1,73 @@ + + + + + + diff --git a/src/components/HelloWorld.vue b/src/components/HelloWorld.vue deleted file mode 100644 index 9f230acc..00000000 --- a/src/components/HelloWorld.vue +++ /dev/null @@ -1,60 +0,0 @@ - - - - - - diff --git a/src/components/TokenGenerator.vue b/src/components/TokenGenerator.vue new file mode 100644 index 00000000..e01f92a8 --- /dev/null +++ b/src/components/TokenGenerator.vue @@ -0,0 +1,90 @@ + + + + + \ No newline at end of file diff --git a/src/main.js b/src/main.js index 9f15cebd..40a2dd68 100644 --- a/src/main.js +++ b/src/main.js @@ -2,10 +2,17 @@ import Vue from 'vue' import App from './App.vue' import './registerServiceWorker' import router from './router' +import vuetify from './plugins/vuetify' +import 'roboto-fontface/css/roboto/roboto-fontface.css' +import 'font-awesome/css/font-awesome.css' +import './plugins/async-computed' +import './plugins/crypto-js' +import './plugins/toast-snackbar' Vue.config.productionTip = false new Vue({ router, + vuetify, render: h => h(App) }).$mount('#app') diff --git a/src/plugins/async-computed.js b/src/plugins/async-computed.js new file mode 100644 index 00000000..c085eab6 --- /dev/null +++ b/src/plugins/async-computed.js @@ -0,0 +1,4 @@ +import Vue from 'vue'; +import AsyncComputed from 'vue-async-computed' + +Vue.use(AsyncComputed) diff --git a/src/plugins/crypto-js.js b/src/plugins/crypto-js.js new file mode 100644 index 00000000..96a2c2e1 --- /dev/null +++ b/src/plugins/crypto-js.js @@ -0,0 +1,4 @@ +import Vue from 'vue' +import VueCryptojs from 'vue-cryptojs' + +Vue.use(VueCryptojs) \ No newline at end of file diff --git a/src/plugins/toast-snackbar.js b/src/plugins/toast-snackbar.js new file mode 100644 index 00000000..174ebde5 --- /dev/null +++ b/src/plugins/toast-snackbar.js @@ -0,0 +1,4 @@ +import Vue from 'vue' +import VuetifyToast from 'vuetify-toast-snackbar' + +Vue.use(VuetifyToast) diff --git a/src/plugins/vuetify.js b/src/plugins/vuetify.js new file mode 100644 index 00000000..231a4d4e --- /dev/null +++ b/src/plugins/vuetify.js @@ -0,0 +1,28 @@ +import Vue from 'vue'; +import Vuetify, { VSnackbar, VBtn, VIcon } from 'vuetify/lib' + +Vue.use(Vuetify, { + components: { + VSnackbar, + VBtn, + VIcon + } +}) +export default new Vuetify({ + theme: { + themes: { + light: { + primary: '#4CAF50', + secondary: '#424242', + accent: '#4CAF50', + error: '#FF5252', + info: '#2196F3', + success: '#4CAF50', + warning: '#FFC107' + }, + }, + }, + icons: { + iconfont: 'fa4', + }, +}); diff --git a/src/router.js b/src/router.js new file mode 100644 index 00000000..4c37d03d --- /dev/null +++ b/src/router.js @@ -0,0 +1,35 @@ +import Vue from 'vue' +import VueRouter from 'vue-router' +import Home from './routes/Home.vue' +import TokenGenerator from "./components/TokenGenerator"; +import Hash from "./components/Hash"; + +Vue.use(VueRouter) + +const routes = [ + { + path: '/', + component: Home + }, + { + path: '/token-generator', + component: TokenGenerator + }, + { + path: '/hash', + component: Hash + }, + { + path: '/about', + name: 'About', + component: () => import('./routes/About.vue') + } +] + +const router = new VueRouter({ + mode: 'history', + base: process.env.BASE_URL, + routes +}) + +export default router diff --git a/src/router/index.js b/src/router/index.js deleted file mode 100644 index 711f9d9a..00000000 --- a/src/router/index.js +++ /dev/null @@ -1,29 +0,0 @@ -import Vue from 'vue' -import VueRouter from 'vue-router' -import Home from '../views/Home.vue' - -Vue.use(VueRouter) - - const routes = [ - { - path: '/', - name: 'Home', - component: Home - }, - { - path: '/about', - name: 'About', - // route level code-splitting - // this generates a separate chunk (about.[hash].js) for this route - // which is lazy-loaded when the route is visited. - component: () => import(/* webpackChunkName: "about" */ '../views/About.vue') - } -] - -const router = new VueRouter({ - mode: 'history', - base: process.env.BASE_URL, - routes -}) - -export default router diff --git a/src/views/About.vue b/src/routes/About.vue similarity index 100% rename from src/views/About.vue rename to src/routes/About.vue diff --git a/src/routes/Home.vue b/src/routes/Home.vue new file mode 100644 index 00000000..3643101f --- /dev/null +++ b/src/routes/Home.vue @@ -0,0 +1,14 @@ + + + diff --git a/src/utils/helpers.js b/src/utils/helpers.js new file mode 100644 index 00000000..d8694539 --- /dev/null +++ b/src/utils/helpers.js @@ -0,0 +1,13 @@ +const copyToClipboard = (text) => { + const input = document.createElement('textarea'); + input.innerHTML = text; + document.body.appendChild(input); + input.select(); + const result = document.execCommand('copy'); + document.body.removeChild(input); + return result; +} + +export { + copyToClipboard +} \ No newline at end of file diff --git a/src/views/Home.vue b/src/views/Home.vue deleted file mode 100644 index 8bd6c57f..00000000 --- a/src/views/Home.vue +++ /dev/null @@ -1,18 +0,0 @@ - - - diff --git a/vue.config.js b/vue.config.js new file mode 100644 index 00000000..62048c49 --- /dev/null +++ b/vue.config.js @@ -0,0 +1,18 @@ +const webpack = require('webpack'); + +module.exports = { + "transpileDependencies": [ + "vuetify" + ], + configureWebpack: () => { + return { + plugins: [ + new webpack.DefinePlugin({ + 'process.env': { + 'APPLICATION_VERSION': JSON.stringify(require('./package.json').version), + } + }) + ] + } + } +} \ No newline at end of file