Skip to content

W
wiki-js
Commit c9b6d0ee authored by NGPixel's avatar NGPixel
Browse files
Options

feat: insert content speeddial + mobile optimizations

parent c6e81209
Hide whitespace changes
Inline Side-by-side
Showing with 96 additions and 64 deletions
client/js/app.js
View file @ c9b6d0ee
...@@ -6,6 +6,7 @@ import CONSTANTS from './constants' ...@@ -6,6 +6,7 @@ import CONSTANTS from './constants'
import Vue from 'vue' import Vue from 'vue'
import VueClipboards from 'vue-clipboards' import VueClipboards from 'vue-clipboards'
import VueSimpleBreakpoints from 'vue-simple-breakpoints'
import VeeValidate from 'vee-validate' import VeeValidate from 'vee-validate'
import { ApolloClient } from 'apollo-client' import { ApolloClient } from 'apollo-client'
import { ApolloLink } from 'apollo-link' import { ApolloLink } from 'apollo-link'
...@@ -78,6 +79,7 @@ window.graphQL = new ApolloClient({ ...@@ -78,6 +79,7 @@ window.graphQL = new ApolloClient({
// ==================================== // ====================================
Vue.use(VueClipboards) Vue.use(VueClipboards)
Vue.use(VueSimpleBreakpoints)
Vue.use(localization.VueI18Next) Vue.use(localization.VueI18Next)
Vue.use(helpers) Vue.use(helpers)
Vue.use(VeeValidate, { Vue.use(VeeValidate, {
......
client/js/compatibility.js
View file @ c9b6d0ee
// ======================================= require('babel-polyfill')
// Promise polyfill
// =======================================
// Requirement: IE 11 and below
if (!window.Promise) {
window.Promise = require('bluebird')
}
// =======================================
// Array.from polyfill
// =======================================
// Requirement: IE 11 and below
if (!Array.from) {
require('./polyfills/array-from')
}
// ======================================= // =======================================
// Fetch polyfill // Fetch polyfill
......
client/js/components/editor-code.vue
View file @ c9b6d0ee
...@@ -21,9 +21,13 @@ ...@@ -21,9 +21,13 @@
title Heading title Heading
use(xlink:href='#fa-heading') use(xlink:href='#fa-heading')
v-list v-list
v-list-tile(v-for='(n, idx) in 6', @click='') v-list-tile(v-for='(n, idx) in 6', @click='', :key='idx')
v-list-tile-action: v-icon format_size v-list-tile-action: v-icon format_size
v-list-tile-title Heading {{n}} v-list-tile-title Heading {{n}}
.editor-code-toolbar-item
svg.icons.is-18(role='img')
title Blockquote
use(xlink:href='#fa-quote-left')
.editor-code-toolbar-group .editor-code-toolbar-group
.editor-code-toolbar-item .editor-code-toolbar-item
svg.icons.is-18(role='img') svg.icons.is-18(role='img')
...@@ -58,14 +62,25 @@ ...@@ -58,14 +62,25 @@
codemirror(ref='cm', v-model='code', :options='cmOptions', @ready="onCmReady") codemirror(ref='cm', v-model='code', :options='cmOptions', @ready="onCmReady")
.editor-code-preview .editor-code-preview
.editor-code-preview-title Preview .editor-code-preview-title Preview
v-speed-dial(:hover='true', direction='left', transition='slide-y-reverse-transition', :fixed='true', :right='true', :bottom='true') v-speed-dial(:open-on-hover='true', direction='top', transition='slide-y-reverse-transition', :fixed='true', :right='!isMobile', :left='isMobile', :bottom='true')
v-btn(color='green', fab, dark, slot='activator') v-btn(color='blue', fab, dark, slot='activator')
v-icon save v-icon add_circle
v-icon close v-icon close
v-btn(color='red', fab, dark, small): v-icon not_interested v-btn(color='teal', fab, dark): v-icon image
v-btn(color='orange', fab, dark, small): v-icon vpn_lock v-btn(color='pink', fab, dark): v-icon insert_drive_file
v-btn(color='indigo', fab, dark, small): v-icon restore v-btn(color='red', fab, dark): v-icon play_circle_outline
v-btn(color='brown', fab, dark, small): v-icon archive v-btn(color='purple', fab, dark): v-icon multiline_chart
v-btn(color='indigo', fab, dark): v-icon functions
v-speed-dial(:open-on-hover='true', :direction='saveMenuDirection', transition='slide-x-reverse-transition', :fixed='true', :right='true', :top='!isMobile', :bottom='isMobile')
v-btn(color='blue', fab, dark, slot='activator')
v-icon more_horiz
v-icon close
v-btn(color='blue-grey', fab, dark): v-icon sort_by_alpha
v-btn(color='green', fab, dark): v-icon save
v-btn(color='red', fab, dark, small): v-icon not_interested
v-btn(color='orange', fab, dark, small): v-icon vpn_lock
v-btn(color='indigo', fab, dark, small): v-icon restore
v-btn(color='brown', fab, dark, small): v-icon archive
</template> </template>
...@@ -125,6 +140,12 @@ export default { ...@@ -125,6 +140,12 @@ export default {
computed: { computed: {
cm() { cm() {
return this.$refs.cm.codemirror return this.$refs.cm.codemirror
},
isMobile() {
return this.$vuetify.breakpoint.smAndDown
},
saveMenuDirection() {
return this.isMobile ? 'top' : 'bottom'
} }
}, },
methods: { methods: {
...@@ -170,6 +191,10 @@ export default { ...@@ -170,6 +191,10 @@ export default {
z-index: 2; z-index: 2;
text-transform: uppercase; text-transform: uppercase;
font-size: .7rem; font-size: .7rem;
@include until($tablet) {
display: none;
}
} }
} }
...@@ -179,6 +204,10 @@ export default { ...@@ -179,6 +204,10 @@ export default {
position: relative; position: relative;
padding: 30px 1rem 1rem 1rem; padding: 30px 1rem 1rem 1rem;
@include until($tablet) {
display: none;
}
&-title { &-title {
background-color: mc('blue', '100'); background-color: mc('blue', '100');
border-bottom-right-radius: 5px; border-bottom-right-radius: 5px;
...@@ -204,6 +233,10 @@ export default { ...@@ -204,6 +233,10 @@ export default {
color: #FFF; color: #FFF;
display: flex; display: flex;
@include until($tablet) {
justify-content: center;
}
&-group { &-group {
display: flex; display: flex;
...@@ -232,6 +265,10 @@ export default { ...@@ -232,6 +265,10 @@ export default {
&:hover { &:hover {
background-color: mc('blue', '600'); background-color: mc('blue', '600');
} }
@include until($tablet) {
width: 35px;
}
} }
svg { svg {
......
client/scss/pages/_welcome.scss
View file @ c9b6d0ee
...@@ -38,6 +38,10 @@ ...@@ -38,6 +38,10 @@
filter: grayscale(100%) brightness(160%); filter: grayscale(100%) brightness(160%);
margin-bottom: 3rem; margin-bottom: 3rem;
z-index: 2; z-index: 2;
@include until($tablet) {
width: 300px;
}
} }
h1 { h1 {
margin-bottom: 1rem; margin-bottom: 1rem;
......
client/svg/icons.svg
View file @ c9b6d0ee
...@@ -489,4 +489,8 @@ ...@@ -489,4 +489,8 @@
<title id="code-title">Code</title> <title id="code-title">Code</title>
<path fill="currentColor" d="M278.9 511.5l-61-17.7c-6.4-1.8-10-8.5-8.2-14.9L346.2 8.7c1.8-6.4 8.5-10 14.9-8.2l61 17.7c6.4 1.8 10 8.5 8.2 14.9L293.8 503.3c-1.9 6.4-8.5 10.1-14.9 8.2zm-114-112.2l43.5-46.4c4.6-4.9 4.3-12.7-.8-17.2L117 256l90.6-79.7c5.1-4.5 5.5-12.3.8-17.2l-43.5-46.4c-4.5-4.8-12.1-5.1-17-.5L3.8 247.2c-5.1 4.7-5.1 12.8 0 17.5l144.1 135.1c4.9 4.6 12.5 4.4 17-.5zm327.2.6l144.1-135.1c5.1-4.7 5.1-12.8 0-17.5L492.1 112.1c-4.8-4.5-12.4-4.3-17 .5L431.6 159c-4.6 4.9-4.3 12.7.8 17.2L523 256l-90.6 79.7c-5.1 4.5-5.5 12.3-.8 17.2l43.5 46.4c4.5 4.9 12.1 5.1 17 .6z"></path> <path fill="currentColor" d="M278.9 511.5l-61-17.7c-6.4-1.8-10-8.5-8.2-14.9L346.2 8.7c1.8-6.4 8.5-10 14.9-8.2l61 17.7c6.4 1.8 10 8.5 8.2 14.9L293.8 503.3c-1.9 6.4-8.5 10.1-14.9 8.2zm-114-112.2l43.5-46.4c4.6-4.9 4.3-12.7-.8-17.2L117 256l90.6-79.7c5.1-4.5 5.5-12.3.8-17.2l-43.5-46.4c-4.5-4.8-12.1-5.1-17-.5L3.8 247.2c-5.1 4.7-5.1 12.8 0 17.5l144.1 135.1c4.9 4.6 12.5 4.4 17-.5zm327.2.6l144.1-135.1c5.1-4.7 5.1-12.8 0-17.5L492.1 112.1c-4.8-4.5-12.4-4.3-17 .5L431.6 159c-4.6 4.9-4.3 12.7.8 17.2L523 256l-90.6 79.7c-5.1 4.5-5.5 12.3-.8 17.2l43.5 46.4c4.5 4.9 12.1 5.1 17 .6z"></path>
</symbol> </symbol>
<symbol id="fa-quote-left" viewBox="0 0 512 512">
<title id="quote-left-title">quote-left</title>
<path fill="currentColor" d="M0 432V304C0 166.982 63.772 67.676 193.827 32.828 209.052 28.748 224 40.265 224 56.027v33.895c0 10.057-6.228 19.133-15.687 22.55C142.316 136.312 104 181.946 104 256h72c26.51 0 48 21.49 48 48v128c0 26.51-21.49 48-48 48H48c-26.51 0-48-21.49-48-48zm336 48h128c26.51 0 48-21.49 48-48V304c0-26.51-21.49-48-48-48h-72c0-74.054 38.316-119.688 104.313-143.528C505.772 109.055 512 99.979 512 89.922V56.027c0-15.762-14.948-27.279-30.173-23.199C351.772 67.676 288 166.982 288 304v128c0 26.51 21.49 48 48 48z"></path>
</symbol>
</svg> </svg>
package.json
View file @ c9b6d0ee
...@@ -45,10 +45,10 @@ ...@@ -45,10 +45,10 @@
"bluebird": "3.5.1", "bluebird": "3.5.1",
"body-parser": "1.18.2", "body-parser": "1.18.2",
"bugsnag": "2.1.3", "bugsnag": "2.1.3",
"bull": "3.3.8", "bull": "3.3.9",
"cheerio": "1.0.0-rc.2", "cheerio": "1.0.0-rc.2",
"child-process-promise": "2.2.1", "child-process-promise": "2.2.1",
"chokidar": "2.0.0", "chokidar": "2.0.2",
"compression": "1.7.1", "compression": "1.7.1",
"connect-redis": "3.3.3", "connect-redis": "3.3.3",
"cookie-parser": "1.4.3", "cookie-parser": "1.4.3",
...@@ -61,15 +61,15 @@ ...@@ -61,15 +61,15 @@
"express-brute": "1.0.1", "express-brute": "1.0.1",
"express-brute-redis": "0.0.1", "express-brute-redis": "0.0.1",
"express-session": "1.15.6", "express-session": "1.15.6",
"file-type": "7.5.0", "file-type": "7.6.0",
"filesize.js": "1.0.2", "filesize.js": "1.0.2",
"follow-redirects": "1.4.1", "follow-redirects": "1.4.1",
"fs-extra": "5.0.0", "fs-extra": "5.0.0",
"graphql": "0.12.3", "graphql": "0.13.1",
"graphql-tools": "2.19.0", "graphql-tools": "2.21.0",
"highlight.js": "9.12.0", "highlight.js": "9.12.0",
"i18next": "10.3.0", "i18next": "10.4.1",
"i18next-express-middleware": "1.0.9", "i18next-express-middleware": "1.0.10",
"i18next-localstorage-cache": "1.1.1", "i18next-localstorage-cache": "1.1.1",
"i18next-node-fs-backend": "1.0.0", "i18next-node-fs-backend": "1.0.0",
"image-size": "0.6.2", "image-size": "0.6.2",
...@@ -77,8 +77,8 @@ ...@@ -77,8 +77,8 @@
"js-yaml": "3.10.0", "js-yaml": "3.10.0",
"jsonwebtoken": "8.1.1", "jsonwebtoken": "8.1.1",
"klaw": "2.1.1", "klaw": "2.1.1",
"lodash": "4.17.4", "lodash": "4.17.5",
"markdown-it": "8.4.0", "markdown-it": "8.4.1",
"markdown-it-abbr": "1.0.4", "markdown-it-abbr": "1.0.4",
"markdown-it-anchor": "4.0.0", "markdown-it-anchor": "4.0.0",
"markdown-it-attrs": "1.2.1", "markdown-it-attrs": "1.2.1",
...@@ -88,14 +88,14 @@ ...@@ -88,14 +88,14 @@
"markdown-it-footnote": "3.0.1", "markdown-it-footnote": "3.0.1",
"markdown-it-mathjax": "2.0.0", "markdown-it-mathjax": "2.0.0",
"markdown-it-task-lists": "2.1.0", "markdown-it-task-lists": "2.1.0",
"mathjax-node": "1.3.0", "mathjax-node": "2.0.1",
"mime-types": "2.1.17", "mime-types": "2.1.18",
"moment": "2.20.1", "moment": "2.20.1",
"moment-timezone": "0.5.14", "moment-timezone": "0.5.14",
"mongodb": "3.0.1", "mongodb": "3.0.2",
"multer": "1.3.0", "multer": "1.3.0",
"node-2fa": "1.1.2", "node-2fa": "1.1.2",
"ora": "1.3.0", "ora": "1.4.0",
"passport": "0.4.0", "passport": "0.4.0",
"passport-auth0": "0.6.1", "passport-auth0": "0.6.1",
"passport-azure-ad-oauth2": "0.0.4", "passport-azure-ad-oauth2": "0.0.4",
...@@ -112,7 +112,7 @@ ...@@ -112,7 +112,7 @@
"passport-windowslive": "1.0.2", "passport-windowslive": "1.0.2",
"pg": "6.4.2", "pg": "6.4.2",
"pg-hstore": "2.3.2", "pg-hstore": "2.3.2",
"pg-promise": "7.4.1", "pg-promise": "7.5.3",
"pm2": "2.9.3", "pm2": "2.9.3",
"pug": "2.0.0-rc.4", "pug": "2.0.0-rc.4",
"qr-image": "3.2.0", "qr-image": "3.2.0",
...@@ -121,10 +121,10 @@ ...@@ -121,10 +121,10 @@
"request": "2.83.0", "request": "2.83.0",
"request-promise": "4.2.2", "request-promise": "4.2.2",
"semver": "5.5.0", "semver": "5.5.0",
"sequelize": "4.32.2", "sequelize": "4.33.4",
"serve-favicon": "2.4.5", "serve-favicon": "2.4.5",
"uuid": "3.2.1", "uuid": "3.2.1",
"validator": "9.3.0", "validator": "9.4.0",
"validator-as-promised": "1.0.2", "validator-as-promised": "1.0.2",
"winston": "2.4.0", "winston": "2.4.0",
"yargs": "11.0.0" "yargs": "11.0.0"
...@@ -132,44 +132,45 @@ ...@@ -132,44 +132,45 @@
"devDependencies": { "devDependencies": {
"@glimpse/glimpse": "0.22.15", "@glimpse/glimpse": "0.22.15",
"@panter/vue-i18next": "0.9.1", "@panter/vue-i18next": "0.9.1",
"apollo-client-preset": "1.0.6", "apollo-client-preset": "1.0.8",
"apollo-fetch": "0.7.0", "apollo-fetch": "0.7.0",
"apollo-link-batch-http": "1.0.4", "apollo-link-batch-http": "1.0.5",
"autoprefixer": "7.2.5", "autoprefixer": "8.0.0",
"babel-cli": "6.26.0", "babel-cli": "6.26.0",
"babel-core": "6.26.0", "babel-core": "6.26.0",
"babel-eslint": "8.2.1", "babel-eslint": "8.2.1",
"babel-jest": "22.1.0", "babel-jest": "22.2.2",
"babel-loader": "7.1.2", "babel-loader": "7.1.2",
"babel-plugin-graphql-tag": "1.3.1", "babel-plugin-graphql-tag": "1.3.1",
"babel-plugin-lodash": "3.3.2", "babel-plugin-lodash": "3.3.2",
"babel-plugin-transform-imports": "1.4.1", "babel-plugin-transform-imports": "1.4.1",
"babel-polyfill": "6.26.0",
"babel-preset-env": "1.6.1", "babel-preset-env": "1.6.1",
"babel-preset-es2015": "6.24.1", "babel-preset-es2015": "6.24.1",
"babel-preset-stage-2": "6.24.1", "babel-preset-stage-2": "6.24.1",
"brace": "0.11.0", "brace": "0.11.1",
"cache-loader": "1.2.0", "cache-loader": "1.2.0",
"clean-webpack-plugin": "0.1.18", "clean-webpack-plugin": "0.1.18",
"colors": "1.1.2", "colors": "1.1.2",
"copy-webpack-plugin": "4.3.1", "copy-webpack-plugin": "4.4.1",
"css-loader": "0.28.9", "css-loader": "0.28.9",
"cssnano": "4.0.0-rc.2", "cssnano": "4.0.0-rc.2",
"duplicate-package-checker-webpack-plugin": "2.1.0", "duplicate-package-checker-webpack-plugin": "2.1.0",
"eslint": "4.16.0", "eslint": "4.18.0",
"eslint-config-requarks": "1.0.7", "eslint-config-requarks": "1.0.7",
"eslint-config-standard": "11.0.0-beta.0", "eslint-config-standard": "11.0.0-beta.0",
"eslint-plugin-import": "2.8.0", "eslint-plugin-import": "2.8.0",
"eslint-plugin-node": "5.2.1", "eslint-plugin-node": "6.0.0",
"eslint-plugin-promise": "3.6.0", "eslint-plugin-promise": "3.6.0",
"eslint-plugin-standard": "3.0.1", "eslint-plugin-standard": "3.0.1",
"eslint-plugin-vue": "4.2.0", "eslint-plugin-vue": "4.2.2",
"extract-text-webpack-plugin": "3.0.2", "extract-text-webpack-plugin": "3.0.2",
"file-loader": "1.1.6", "file-loader": "1.1.6",
"graphql-tag": "^2.6.1", "graphql-tag": "^2.7.3",
"hammerjs": "2.0.8", "hammerjs": "2.0.8",
"i18next-xhr-backend": "1.5.1", "i18next-xhr-backend": "1.5.1",
"jest": "22.1.4", "jest": "22.3.0",
"jest-junit": "3.4.1", "jest-junit": "3.6.0",
"js-cookie": "2.2.0", "js-cookie": "2.2.0",
"lodash-webpack-plugin": "0.11.4", "lodash-webpack-plugin": "0.11.4",
"name-all-modules-plugin": "1.0.1", "name-all-modules-plugin": "1.0.1",
...@@ -177,32 +178,32 @@ ...@@ -177,32 +178,32 @@
"offline-plugin": "4.9.0", "offline-plugin": "4.9.0",
"postcss-flexbugs-fixes": "3.3.0", "postcss-flexbugs-fixes": "3.3.0",
"postcss-flexibility": "2.0.0", "postcss-flexibility": "2.0.0",
"postcss-loader": "2.0.10", "postcss-loader": "2.1.0",
"postcss-selector-parser": "3.1.1", "postcss-selector-parser": "3.1.1",
"pug-lint": "2.5.0", "pug-lint": "2.5.0",
"raw-loader": "0.5.1", "raw-loader": "0.5.1",
"sass-loader": "6.0.6", "sass-loader": "6.0.6",
"sass-resources-loader": "1.3.1", "sass-resources-loader": "1.3.2",
"simple-progress-webpack-plugin": "1.0.4", "simple-progress-webpack-plugin": "1.0.4",
"style-loader": "0.20.1", "style-loader": "0.20.2",
"stylus": "0.54.5", "stylus": "0.54.5",
"stylus-loader": "3.0.1", "stylus-loader": "3.0.1",
"twemoji-awesome": "1.0.6", "twemoji-awesome": "1.0.6",
"uglifyjs-webpack-plugin": "1.1.6", "uglifyjs-webpack-plugin": "1.2.0",
"vee-validate": "2.0.3", "vee-validate": "2.0.4",
"vue": "2.5.13", "vue": "2.5.13",
"vue-clipboards": "1.2.1", "vue-clipboards": "1.2.1",
"vue-codemirror": "4.0.3", "vue-codemirror": "4.0.3",
"vue-hot-reload-api": "2.2.4", "vue-hot-reload-api": "2.2.4",
"vue-loader": "13.7.0", "vue-loader": "14.1.1",
"vue-simple-breakpoints": "1.0.3", "vue-simple-breakpoints": "1.0.3",
"vue-template-compiler": "2.5.13", "vue-template-compiler": "2.5.13",
"vuetify": "0.17.7", "vuetify": "1.0.1",
"vuex": "3.0.1", "vuex": "3.0.1",
"vuex-persistedstate": "2.4.2", "vuex-persistedstate": "2.4.2",
"webpack": "3.10.0", "webpack": "3.11.0",
"webpack-bundle-analyzer": "2.9.2", "webpack-bundle-analyzer": "2.10.0",
"webpack-dev-middleware": "2.0.4", "webpack-dev-middleware": "2.0.5",
"webpack-hot-middleware": "2.21.0", "webpack-hot-middleware": "2.21.0",
"webpack-merge": "4.1.1", "webpack-merge": "4.1.1",
"whatwg-fetch": "2.0.3", "whatwg-fetch": "2.0.3",
......
yarn.lock
View file @ c9b6d0ee
This diff was suppressed by a .gitattributes entry.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment