Skip to content

W
wiki-js
Commit c6876996 authored by Nick's avatar Nick
Browse files
Options

fix: UI improvements

parent 358e79d7
Hide whitespace changes
Inline Side-by-side
Showing with 64 additions and 48 deletions
client/components/admin/admin-auth.vue
View file @ c6876996
......@@ -6,7 +6,7 @@
img(src='/svg/icon-unlock.svg', alt='Authentication', style='width: 80px;')
.admin-header-title
.headline.primary--text Authentication
.subheading.grey--text Configure the authentication settings of your wiki
.subheading.grey--text Configure the authentication settings of your wiki #[v-chip(label, color='primary', small).white--text coming soon]
v-spacer
v-btn(outline, color='grey', @click='refresh', large)
v-icon refresh
......
client/components/admin/admin-dashboard.vue
View file @ c6876996
......@@ -3,12 +3,12 @@
v-layout(row, wrap)
v-flex(xs12)
.admin-header
img(src='/svg/icon-browse-page.svg', alt='Dashboard', style='width: 80px;')
img.animated.fadeInUp(src='/svg/icon-browse-page.svg', alt='Dashboard', style='width: 80px;')
.admin-header-title
.headline.primary--text {{ $t('admin:dashboard.title') }}
.subheading.grey--text {{ $t('admin:dashboard.subtitle') }}
.headline.primary--text.animated.fadeInLeft {{ $t('admin:dashboard.title') }}
.subheading.grey--text.animated.fadeInLeft.wait-p2s {{ $t('admin:dashboard.subtitle') }}
v-flex(xs12 md6 lg4 xl3 d-flex)
v-card.primary.dashboard-card(dark)
v-card.primary.dashboard-card.animated.fadeInUp(dark)
v-card-text
v-icon.dashboard-icon insert_drive_file
.subheading Pages
......@@ -19,7 +19,7 @@
easing='easeOutQuint'
)
v-flex(xs12 md6 lg4 xl3 d-flex)
v-card.indigo.lighten-1.dashboard-card(dark)
v-card.indigo.lighten-1.dashboard-card.animated.fadeInUp.wait-p2s(dark)
v-card-text
v-icon.dashboard-icon person
.subheading Users
......@@ -30,7 +30,7 @@
easing='easeOutQuint'
)
v-flex(xs12 md6 lg4 xl3 d-flex)
v-card.indigo.lighten-2.dashboard-card(dark)
v-card.indigo.lighten-2.dashboard-card.animated.fadeInUp.wait-p4s(dark)
v-card-text
v-icon.dashboard-icon people
.subheading Groups
......@@ -41,7 +41,7 @@
easing='easeOutQuint'
)
v-flex(xs12 md6 lg12 xl3 d-flex)
v-card.dashboard-card(
v-card.dashboard-card.animated.fadeInUp.wait-p6s(
:class='isLatestVersion ? "teal lighten-2" : "red lighten-2"'
dark
)
......
client/components/admin/admin-editor.vue
View file @ c6876996
......@@ -6,7 +6,7 @@
img(src='/svg/icon-web-design.svg', alt='Editor', style='width: 80px;')
.admin-header-title
.headline.primary--text Editor
.subheading.grey--text Configure the content editors
.subheading.grey--text Configure the content editors #[v-chip(label, color='primary', small).white--text coming soon]
v-spacer
v-btn(outline, color='grey', @click='refresh', large)
v-icon refresh
......
client/components/admin/admin-mail.vue
View file @ c6876996
......@@ -127,7 +127,7 @@
<script>
import _ from 'lodash'
import { get, sync } from 'vuex-pathify'
import { get } from 'vuex-pathify'
import mailConfigQuery from 'gql/admin/mail/mail-query-config.gql'
import mailUpdateConfigMutation from 'gql/admin/mail/mail-mutation-save-config.gql'
......
client/components/admin/admin-search.vue
View file @ c6876996
......@@ -3,22 +3,22 @@
v-layout(row, wrap)
v-flex(xs12)
.admin-header
img(src='/svg/icon-search.svg', alt='Search Engine', style='width: 80px;')
img.animated.fadeInUp(src='/svg/icon-search.svg', alt='Search Engine', style='width: 80px;')
.admin-header-title
.headline.primary--text Search Engine
.subheading.grey--text Configure the search capabilities of your wiki
.headline.primary--text.animated.fadeInLeft Search Engine
.subheading.grey--text.animated.fadeInLeft.wait-p2s Configure the search capabilities of your wiki
v-spacer
v-btn(outline, color='grey', @click='refresh', large)
v-btn.animated.fadeInDown.wait-p2s(outline, color='grey', @click='refresh', large)
v-icon refresh
v-btn(color='black', dark, large, depressed, @click='rebuild')
v-btn.animated.fadeInDown.wait-p1s(color='black', dark, large, depressed, @click='rebuild')
v-icon(left) cached
span Rebuild Index
v-btn(color='success', @click='save', depressed, large)
v-btn.animated.fadeInDown(color='success', @click='save', depressed, large)
v-icon(left) check
span {{$t('common:actions.apply')}}
v-flex(lg3, xs12)
v-card
v-card.animated.fadeInUp
v-toolbar(flat, color='primary', dark, dense)
.subheading Search Engine
v-card-text
......@@ -34,7 +34,7 @@
)
v-flex(lg9, xs12)
v-card.wiki-form
v-card.wiki-form.animated.fadeInUp.wait-p2s
v-toolbar(color='primary', dense, flat, dark)
.subheading {{engine.title}}
v-card-text
......
client/components/admin/admin-system.vue
View file @ c6876996
......@@ -3,14 +3,14 @@
v-layout(row, wrap)
v-flex(xs12)
.admin-header
img(src='/svg/icon-tune.svg', alt='System Info', style='width: 80px;')
img.animated.fadeInUp(src='/svg/icon-tune.svg', alt='System Info', style='width: 80px;')
.admin-header-title
.headline.primary--text {{ $t('admin:system.title') }}
.subheading.grey--text {{ $t('admin:system.subtitle') }}
.headline.primary--text.animated.fadeInLeft {{ $t('admin:system.title') }}
.subheading.grey--text.animated.fadeInLeft.wait-p2s {{ $t('admin:system.subtitle') }}
v-layout.mt-3(row wrap)
v-flex(lg6 xs12)
v-card
v-btn(fab, absolute, right, top, small, light, @click='refresh'): v-icon refresh
v-card.animated.fadeInUp
v-btn.animated.fadeInLeft.wait-p2s(fab, absolute, right, top, small, light, @click='refresh'): v-icon refresh
v-list(two-line, dense)
v-subheader Wiki.js
v-list-tile(avatar)
......@@ -70,7 +70,7 @@
v-list-tile-sub-title {{ info.configFile }}
v-flex(lg6 xs12)
v-card.pb-3
v-card.pb-3.animated.fadeInUp.wait-p4s
v-list(dense)
v-subheader Node.js
v-list-tile(avatar)
......
client/components/admin/admin-theme.vue
View file @ c6876996
......@@ -3,18 +3,18 @@
v-layout(row wrap)
v-flex(xs12)
.admin-header
img(src='/svg/icon-paint-palette.svg', alt='Theme', style='width: 80px;')
img.animated.fadeInUp(src='/svg/icon-paint-palette.svg', alt='Theme', style='width: 80px;')
.admin-header-title
.headline.primary--text Theme
.subheading.grey--text Modify the look &amp; feel of your wiki
.headline.primary--text.animated.fadeInLeft Theme
.subheading.grey--text.animated.fadeInLeft.wait-p2s Modify the look &amp; feel of your wiki
v-spacer
v-btn(color='success', depressed, @click='save', large, :loading='loading')
v-btn.animated.fadeInRight(color='success', depressed, @click='save', large, :loading='loading')
v-icon(left) check
span {{$t('common:actions.apply')}}
v-form.pt-3
v-layout(row wrap)
v-flex(lg6 xs12)
v-card.wiki-form
v-card.wiki-form.animated.fadeInUp
v-toolbar(color='primary', dark, dense, flat)
v-toolbar-title
.subheading Theme
......@@ -43,7 +43,7 @@
persistent-hint
hint='Not recommended for accessibility. May not be supported by all themes.'
)
v-card.wiki-form.mt-3
v-card.wiki-form.mt-3.animated.fadeInUp.wait-p2s
v-toolbar(color='primary', dark, dense, flat)
v-toolbar-title
.subheading Code Injection
......@@ -79,7 +79,7 @@
auto-grow
)
v-flex(lg6 xs12)
v-card
v-card.animated.fadeInUp.wait-p2s
v-toolbar(color='teal', dark, dense, flat)
v-toolbar-title
.subheading Download Themes
......
client/components/common/nav-header.vue
View file @ c6876996
......@@ -100,15 +100,17 @@
v-toolbar(flat, color='grey darken-4', dense)
v-icon.mr-2 search
v-subheader.pl-0 Advanced Search
v-spacer
v-chip(label, small, color='primary') Coming soon
v-card-text.pa-4
v-checkbox.mt-0(
label='Restrict to Current Language'
label='Restrict to current language'
color='white'
v-model='searchRestrictLocale'
hide-details
)
v-checkbox(
label='Restrict to Below Current Path'
label='Search below current path only'
color='white'
v-model='searchRestrictPath'
hide-details
......
client/components/editor/editor-markdown.vue
View file @ c6876996
......@@ -60,15 +60,15 @@
.editor-markdown-preview-title(@click='previewShown = false') Preview
.editor-markdown-preview-content.contents(ref='editorPreview', v-html='previewHTML')
v-speed-dial.editor-markdown-insert(v-model='fabInsertMenu', :open-on-hover='true', direction='top', transition='slide-y-reverse-transition', fixed, bottom, :right='!previewShown || $vuetify.breakpoint.smAndDown')
v-btn(color='blue', fab, dark, v-model='fabInsertMenu', slot='activator')
v-icon add_circle
v-icon close
v-btn(color='teal', fab, dark): v-icon image
v-btn(color='pink', fab, dark): v-icon insert_drive_file
v-btn(color='red', fab, dark): v-icon play_circle_outline
v-btn(color='purple', fab, dark): v-icon multiline_chart
v-btn(color='indigo', fab, dark): v-icon functions
//- v-speed-dial.editor-markdown-insert(v-model='fabInsertMenu', :open-on-hover='true', direction='top', transition='slide-y-reverse-transition', fixed, bottom, :right='!previewShown || $vuetify.breakpoint.smAndDown')
//- v-btn(color='blue', fab, dark, v-model='fabInsertMenu', slot='activator')
//- v-icon add_circle
//- v-icon close
//- v-btn(color='teal', fab, dark): v-icon image
//- v-btn(color='pink', fab, dark): v-icon insert_drive_file
//- v-btn(color='red', fab, dark): v-icon play_circle_outline
//- v-btn(color='purple', fab, dark): v-icon multiline_chart
//- v-btn(color='indigo', fab, dark): v-icon functions
</template>
<script>
......@@ -229,10 +229,10 @@ export default {
* Update toolbar state
*/
toolbarSync(cm) {
const pos = cm.getCursor('start')
const token = cm.getTokenAt(pos)
// const pos = cm.getCursor('start')
// const token = cm.getTokenAt(pos)
if (!token.type) { return }
// if (!token.type) { return }
// console.info(token)
},
......
client/scss/app.scss
View file @ c6876996
......@@ -2,9 +2,10 @@
@import "base/base";
@import "base/icons";
@import "base/animation";
@import "../libs/animate/animate";
@import '~vue2-animate/src/sass/vue2-animate';
// @import "../libs/animate/animate";
// @import '~vue2-animate/src/sass/vue2-animate';
@import '~vuescroll/dist/vuescroll.css';
@import '~diff2html/dist/diff2html.min.css';
......
client/scss/base/animation.scss 0 → 100644
View file @ c6876996
$use-fade: true;
$use-zoom: true;
$use-bounce: true;
@import "~animate-sass/animate";
@for $i from 1 to 9 {
.wait-p#{$i}s {
animation-delay: $i * .1s !important;
}
}
package.json
View file @ c6876996
......@@ -137,8 +137,8 @@
"pem-jwk": "2.0.0",
"pg": "7.8.0",
"pg-hstore": "2.3.2",
"pg-tsquery": "8.0.3",
"pg-query-stream": "2.0.0",
"pg-tsquery": "8.0.3",
"pm2": "3.2.9",
"pug": "2.0.3",
"qr-image": "3.2.0",
......@@ -178,6 +178,7 @@
"@babel/polyfill": "^7.2.5",
"@babel/preset-env": "^7.3.1",
"@panter/vue-i18next": "0.15.0",
"animate-sass": "0.8.2",
"animated-number-vue": "0.1.4",
"apollo-cache-inmemory": "1.4.2",
"apollo-client": "2.4.12",
......
yarn.lock
View file @ c6876996
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