liz/wikijs-fork
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: admin dark mode

Browse Source
This commit is contained in:
NGPixel
2018-06-09 20:11:00 -04:00
parent 5efbfc7370
commit 1d2d1c66c1
20 changed files with 259 additions and 217 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
client/components/admin/admin-api.vue
View File

@@ -1,6 +1,6 @@
<template lang='pug'>
v-card(flat)
v-card(flat, color='grey lighten-5').pa-3.pt-4
v-card(flat, tile, :color='$vuetify.dark ? "grey darken-4" : "grey lighten-5"').pa-3.pt-4
.headline.blue--text.text--darken-2 API
.subheading.grey--text Manage keys to access the API
v-card

7
client/components/admin/admin-auth.vue
View File

@@ -1,9 +1,9 @@
<template lang='pug'>
v-card(tile, color='grey lighten-5')
v-card(tile, :color='$vuetify.dark ? "grey darken-4" : "grey lighten-5"')
.pa-3.pt-4
.headline.primary--text Authentication
.subheading.grey--text Configure the authentication settings of your wiki
v-tabs(color='grey lighten-4', fixed-tabs, slider-color='primary', show-arrows)
v-tabs(:color='$vuetify.dark ? "primary" : "grey lighten-4"', fixed-tabs, :slider-color='$vuetify.dark ? "white" : "primary"', show-arrows)
v-tab(key='settings'): v-icon settings
v-tab(v-for='strategy in activeStrategies', :key='strategy.key') {{ strategy.title }}
@@ -41,8 +41,7 @@
v-text-field.ml-3(label='Limit to specific email domains', prepend-icon='mail_outline')
v-text-field.ml-3(label='Assign to group', prepend-icon='people')
v-divider.my-0
v-card-actions.grey.lighten-4
v-card-chin
v-btn(color='primary')
v-icon(left) chevron_right
span Save

54
client/components/admin/admin-contribute.vue
View File

@@ -1,33 +1,31 @@
<template lang='pug'>
v-card(flat)
v-card(color='grey lighten-5')
.pa-3.pt-4
.headline.primary--text Contribute
.subheading.grey--text Help support Wiki.js development and operations
v-card.pa-3
.body-1.pl-3 Wiki.js is a #[strong free and open-source software] brought to you with #[v-icon(color='red') favorite] by #[a(href='https://requarks.io', target='_blank') requarks.io] and #[a(href='https://github.com/Requarks/wiki/graphs/contributors', target='_blank') contributors].
.body-1.pt-3.pl-3 We need your help to keep improving the software and run the various associated services (e.g. hosting and networking).
v-divider
v-subheader Fund our work
.body-1.pl-3 Wiki.js is part of the Open Collective initiative. You can contribute financially by making a monthly or one-time donation:
v-card-actions.mt-3.ml-2
v-btn(depressed, color='primary', href='https://opencollective.com/wikijs')
v-icon(left) local_atm
| Make a donation
v-divider
v-subheader Contribute
.body-1.pl-3
ul
li Submit an idea or vote on a proposed one on the #[a(href='https://requests.requarks.io/wiki', target='_blank') feature requests board].
li Found a bug? Submit an issue on #[a(href='https://github.com/Requarks/wiki/issues', target='_blank') Github].
li Help translate Wiki.js in your language. Let us know on #[a(href='https://gitter.im/Requarks/wiki', target='_blank') Gitter].
v-divider
v-subheader Spread the word
.body-1.pl-3
ul
li Talk to your friends and colleagues about how awesome Wiki.js is!
li Follow us on #[a(href='https://twitter.com/requarks', target='_blank') Twitter].
v-card(flat, tile, :color='$vuetify.dark ? "grey darken-4" : "grey lighten-5"').pa-3.pt-4
.headline.primary--text Contribute
.subheading.grey--text Help support Wiki.js development and operations
v-card.pa-3
.body-1.pl-3 Wiki.js is a #[strong free and open-source software] brought to you with #[v-icon(color='red') favorite] by #[a(href='https://requarks.io', target='_blank') requarks.io] and #[a(href='https://github.com/Requarks/wiki/graphs/contributors', target='_blank') contributors].
.body-1.pt-3.pl-3 We need your help to keep improving the software and run the various associated services (e.g. hosting and networking).
v-divider
v-subheader Fund our work
.body-1.pl-3 Wiki.js is part of the Open Collective initiative. You can contribute financially by making a monthly or one-time donation:
v-card-actions.mt-3.ml-2
v-btn(depressed, color='primary', href='https://opencollective.com/wikijs')
v-icon(left) local_atm
| Make a donation
v-divider
v-subheader Contribute
.body-1.pl-3
ul
li Submit an idea or vote on a proposed one on the #[a(href='https://requests.requarks.io/wiki', target='_blank') feature requests board].
li Found a bug? Submit an issue on #[a(href='https://github.com/Requarks/wiki/issues', target='_blank') Github].
li Help translate Wiki.js in your language. Let us know on #[a(href='https://gitter.im/Requarks/wiki', target='_blank') Gitter].
v-divider
v-subheader Spread the word
.body-1.pl-3
ul
li Talk to your friends and colleagues about how awesome Wiki.js is!
li Follow us on #[a(href='https://twitter.com/requarks', target='_blank') Twitter].
</template>

32
client/components/admin/admin-dev.vue
View File

@@ -1,18 +1,24 @@
<template lang='pug'>
v-card(flat)
v-card(color='grey lighten-5')
.pa-3.pt-4
.headline.primary--text Developer Tools
.subheading.grey--text ¯\_(ツ)_/¯
v-tabs(v-model='selectedTab', color='grey lighten-4', fixed-tabs, slider-color='primary', show-arrows, @input='tabChanged')
v-tab(key='0') Graph API Playground
v-tab(key='1') Graph API Map
v-tabs-items(v-model='selectedTab')
v-tab-item(key='0', :transition='false', :reverse-transition='false')
#graphiql
div
v-card(flat, :color='$vuetify.dark ? "grey darken-4" : "grey lighten-5"').pa-3.pt-4
.headline.primary--text Developer Tools
.subheading.grey--text ¯\_(ツ)_/¯
v-tabs(
v-model='selectedTab'
:color='$vuetify.dark ? "primary" : "grey lighten-4"'
fixed-tabs
:slider-color='$vuetify.dark ? "white" : "primary"'
show-arrows
@input='tabChanged'
)
v-tab(key='0') Graph API Playground
v-tab(key='1') Graph API Map
v-tabs-items(v-model='selectedTab')
v-tab-item(key='0', :transition='false', :reverse-transition='false')
#graphiql
v-tab-item(key='1', :transition='false', :reverse-transition='false')
#voyager
v-tab-item(key='1', :transition='false', :reverse-transition='false')
#voyager
</template>

45
client/components/admin/admin-editor.vue
View File

@@ -1,29 +1,28 @@
<template lang='pug'>
v-card(flat)
v-card(color='grey lighten-5')
.pa-3.pt-4
.headline.primary--text Editor
.subheading.grey--text Configure the content editor
v-tabs(color='grey lighten-4', fixed-tabs, slider-color='primary', show-arrows)
v-tab(key='settings'): v-icon settings
v-tab(key='code') Markdown
v-card(flat, :color='$vuetify.dark ? "grey darken-4" : "grey lighten-5"').pa-3.pt-4
.headline.primary--text Editor
.subheading.grey--text Configure the content editor
v-tabs(:color='$vuetify.dark ? "primary" : "grey lighten-4"', fixed-tabs, :slider-color='$vuetify.dark ? "white" : "primary"', show-arrows)
v-tab(key='settings'): v-icon settings
v-tab(key='code') Markdown
v-tab-item(key='settings', :transition='false', :reverse-transition='false')
v-card.pa-3
v-form
v-radio-group(v-model='selectedEditor')
v-radio(v-for='(editor, n) in editors', :key='n', :label='editor.text', :value='editor.value', color='primary')
v-divider
v-btn(color='primary')
v-icon(left) chevron_right
| Set Editor
v-btn(icon)
v-icon.grey--text refresh
v-tab-item(key='code', :transition='false', :reverse-transition='false')
v-card.pa-3
v-form
v-subheader Editor Configuration
.body-1 This editor has no configuration options you can modify.
v-tab-item(key='settings', :transition='false', :reverse-transition='false')
v-card.pa-3
v-form
v-radio-group(v-model='selectedEditor')
v-radio(v-for='(editor, n) in editors', :key='n', :label='editor.text', :value='editor.value', color='primary')
v-divider
v-btn(color='primary')
v-icon(left) chevron_right
| Set Editor
v-btn(icon)
v-icon.grey--text refresh
v-tab-item(key='code', :transition='false', :reverse-transition='false')
v-card.pa-3
v-form
v-subheader Editor Configuration
.body-1 This editor has no configuration options you can modify.
</template>

3
client/components/admin/admin-general.vue
View File

@@ -21,8 +21,7 @@
v-text-field(label='Site Description', :counter='255', prepend-icon='public')
v-text-field(label='Site Keywords', :counter='255', prepend-icon='public')
v-select(label='Meta Robots', chips, tags, :items='metaRobots', v-model='metaRobotsSelection', prepend-icon='public')
v-divider.my-0
v-card-actions.grey.lighten-4
v-card-chin
v-spacer
v-btn(color='primary')
v-icon(left) chevron_right

4
client/components/admin/admin-groups-edit.vue
View File

@@ -1,10 +1,10 @@
<template lang='pug'>
v-card
v-card(flat, color='grey lighten-5').pa-3.pt-4
v-card(flat, :color='$vuetify.dark ? "grey darken-4" : "grey lighten-5"').pa-3.pt-4
.headline.blue--text.text--darken-2 Edit Group
.subheading.grey--text {{name}}
v-btn(color='primary', fab, absolute, bottom, right, small, to='/groups'): v-icon arrow_upward
v-tabs(v-model='tab', color='grey lighten-4', fixed-tabs, slider-color='primary', show-arrows)
v-tabs(v-model='tab', :color='$vuetify.dark ? "primary" : "grey lighten-4"', fixed-tabs, :slider-color='$vuetify.dark ? "white" : "primary"', show-arrows)
v-tab(key='properties') Properties
v-tab(key='rights') Permissions
v-tab(key='users') Users

2
client/components/admin/admin-groups.vue
View File

@@ -1,6 +1,6 @@
<template lang='pug'>
v-card(flat)
v-card(flat, color='grey lighten-5').pa-3.pt-4
v-card(flat, tile, :color='$vuetify.dark ? "grey darken-4" : "grey lighten-5"').pa-3.pt-4
.headline.blue--text.text--darken-2 Groups
.subheading.grey--text Manage groups and their permissions
v-card

6
client/components/admin/admin-locale.vue
View File

@@ -39,8 +39,7 @@
persistent-hint
:hint='namespacing ? "Automatically download updates to all namespaced locales enabled below." : "Automatically download updates to this locale as they become available."'
)
v-divider.my-0
v-card-actions.grey.lighten-4
v-card-chin
v-spacer
v-btn(color='primary', :loading='loading', @click='save')
v-icon(left) chevron_right
@@ -92,8 +91,7 @@
v-list-tile-sub-title(v-html='data.item.nativeName')
v-list-tile-action
v-checkbox(:input-value='data.tile.props.value', color='primary', value)
v-divider.my-0
v-card-actions.grey.lighten-4
v-card-chin
v-spacer
v-btn(color='primary', :loading='loading', @click='save')
v-icon(left) chevron_right

85
client/components/admin/admin-logging.vue
View File

@@ -1,50 +1,49 @@
<template lang='pug'>
v-card(flat)
v-card(color='grey lighten-5')
.pa-3.pt-4
.headline.primary--text Logging
.subheading.grey--text Configure the system logger(s)
v-tabs(color='grey lighten-4', fixed-tabs, slider-color='primary', show-arrows)
v-tab(key='settings'): v-icon settings
v-tab(v-for='svc in activeServices', :key='svc.key') {{ svc.title }}
v-card(flat, :color='$vuetify.dark ? "grey darken-4" : "grey lighten-5"').pa-3.pt-4
.headline.primary--text Logging
.subheading.grey--text Configure the system logger(s)
v-tabs(:color='$vuetify.dark ? "primary" : "grey lighten-4"', fixed-tabs, :slider-color='$vuetify.dark ? "white" : "primary"', show-arrows)
v-tab(key='settings'): v-icon settings
v-tab(v-for='svc in activeServices', :key='svc.key') {{ svc.title }}
v-tab-item(key='settings', :transition='false', :reverse-transition='false')
v-card.pa-3
.body-2.pb-2 Select which logging service to enable:
v-form
v-checkbox(
v-for='(svc, n) in services',
v-model='selectedServices',
:key='svc.key',
:label='svc.title',
:value='svc.key',
color='primary',
:disabled='svc.key === `console`'
hide-details
)
v-divider
v-btn(color='primary')
v-icon(left) chevron_right
| Set Services
v-btn(color='black', dark)
v-icon(left) keyboard
| View Console
v-btn(color='black', dark)
v-icon(left) layers_clear
| Purge Logs
v-btn(icon, @click='refresh')
v-icon.grey--text refresh
v-tab-item(key='settings', :transition='false', :reverse-transition='false')
v-card.pa-3
.body-2.pb-2 Select which logging service to enable:
v-form
v-checkbox(
v-for='(svc, n) in services',
v-model='selectedServices',
:key='svc.key',
:label='svc.title',
:value='svc.key',
color='primary',
:disabled='svc.key === `console`'
hide-details
)
v-divider
v-btn(color='primary')
v-icon(left) chevron_right
| Set Services
v-btn(color='black', dark)
v-icon(left) keyboard
| View Console
v-btn(color='black', dark)
v-icon(left) layers_clear
| Purge Logs
v-btn(icon, @click='refresh')
v-icon.grey--text refresh
v-tab-item(v-for='(svc, n) in activeServices', :key='svc.key', :transition='false', :reverse-transition='false')
v-card.pa-3
v-form
v-subheader Service Configuration
.body-1(v-if='!svc.props || svc.props.length < 1') This logging service has no configuration options you can modify.
v-text-field(v-else, v-for='prop in svc.props', :key='prop', :label='prop', prepend-icon='mode_edit')
v-divider
v-btn(color='primary')
v-icon(left) chevron_right
| Save Configuration
v-tab-item(v-for='(svc, n) in activeServices', :key='svc.key', :transition='false', :reverse-transition='false')
v-card.pa-3
v-form
v-subheader Service Configuration
.body-1(v-if='!svc.props || svc.props.length < 1') This logging service has no configuration options you can modify.
v-text-field(v-else, v-for='prop in svc.props', :key='prop', :label='prop', prepend-icon='mode_edit')
v-divider
v-btn(color='primary')
v-icon(left) chevron_right
| Save Configuration
v-snackbar(
color='success'

59
client/components/admin/admin-search.vue
View File

@@ -1,36 +1,35 @@
<template lang='pug'>
v-card(flat)
v-card(color='grey lighten-5')
.pa-3.pt-4
.headline.primary--text Search Engine
.subheading.grey--text Configure the search capabilities of your wiki
v-tabs(color='grey lighten-4', fixed-tabs, slider-color='primary', show-arrows)
v-tab(key='settings'): v-icon settings
v-tab(key='db') Database
v-tab(key='algolia') Algolia
v-tab(key='elasticsearch') Elasticsearch
v-tab(key='solr') Solr
v-card(flat, tile, :color='$vuetify.dark ? "grey darken-4" : "grey lighten-5"').pa-3.pt-4
.headline.primary--text Search Engine
.subheading.grey--text Configure the search capabilities of your wiki
v-tabs(:color='$vuetify.dark ? "primary" : "grey lighten-4"', fixed-tabs, :slider-color='$vuetify.dark ? "white" : "primary"', show-arrows)
v-tab(key='settings'): v-icon settings
v-tab(key='db') Database
v-tab(key='algolia') Algolia
v-tab(key='elasticsearch') Elasticsearch
v-tab(key='solr') Solr
v-tab-item(key='settings')
v-card.pa-3
v-form
v-radio-group(v-model='selectedEngine')
v-radio(v-for='(engine, n) in engines', :key='n', :label='engine.text', :value='engine.value', color='primary')
v-divider
v-btn(color='primary')
v-icon(left) chevron_right
| Set Engine
v-btn(color='black', dark)
v-icon(left) refresh
| Rebuild Index
v-tab-item(key='db')
v-card.pa-3 TODO
v-tab-item(key='algolia')
v-card.pa-3 TODO
v-tab-item(key='elasticsearch')
v-card.pa-3 TODO
v-tab-item(key='solr')
v-card.pa-3 TODO
v-tab-item(key='settings')
v-card.pa-3
v-form
v-radio-group(v-model='selectedEngine')
v-radio(v-for='(engine, n) in engines', :key='n', :label='engine.text', :value='engine.value', color='primary')
v-divider
v-btn(color='primary')
v-icon(left) chevron_right
| Set Engine
v-btn(color='black', dark)
v-icon(left) refresh
| Rebuild Index
v-tab-item(key='db')
v-card.pa-3 TODO
v-tab-item(key='algolia')
v-card.pa-3 TODO
v-tab-item(key='elasticsearch')
v-card.pa-3 TODO
v-tab-item(key='solr')
v-card.pa-3 TODO
</template>

61
client/components/admin/admin-storage.vue
View File

@@ -1,37 +1,36 @@
<template lang='pug'>
v-card(flat)
v-card(color='grey lighten-5')
.pa-3.pt-4
.headline.primary--text Storage
.subheading.grey--text Set backup and sync targets for your content
v-tabs(color='grey lighten-4', fixed-tabs, slider-color='primary', show-arrows)
v-tab(key='settings'): v-icon settings
v-tab(key='local') Local FS
v-tab(key='git') Git
v-tab(key='s3') Amazon S3
v-tab(key='azure') Azure Blob Storage
v-tab(key='digitalocean') DigitalOcean Spaces
v-tab(key='dropbox') Dropbox
v-tab(key='gdrive') Google Drive
v-tab(key='onedrive') OneDrive
v-tab(key='scp') SCP (SSH)
v-card(flat, :color='$vuetify.dark ? "grey darken-4" : "grey lighten-5"').pa-3.pt-4
.headline.primary--text Storage
.subheading.grey--text Set backup and sync targets for your content
v-tabs(:color='$vuetify.dark ? "primary" : "grey lighten-4"', fixed-tabs, :slider-color='$vuetify.dark ? "white" : "primary"', show-arrows)
v-tab(key='settings'): v-icon settings
v-tab(key='local') Local FS
v-tab(key='git') Git
v-tab(key='s3') Amazon S3
v-tab(key='azure') Azure Blob Storage
v-tab(key='digitalocean') DigitalOcean Spaces
v-tab(key='dropbox') Dropbox
v-tab(key='gdrive') Google Drive
v-tab(key='onedrive') OneDrive
v-tab(key='scp') SCP (SSH)
v-tab-item(key='settings')
v-card.pa-3
v-form
v-checkbox(
v-for='(target, n) in targets',
v-model='auths',
:key='n',
:label='target.text',
:value='target.value',
color='primary',
hide-details
)
v-divider
v-btn(color='primary')
v-icon(left) chevron_right
| Set Backup Targets
v-tab-item(key='settings')
v-card.pa-3
v-form
v-checkbox(
v-for='(target, n) in targets',
v-model='auths',
:key='n',
:label='target.text',
:value='target.value',
color='primary',
hide-details
)
v-divider
v-btn(color='primary')
v-icon(left) chevron_right
| Set Backup Targets
</template>

9
client/components/admin/admin-theme.vue
View File

@@ -21,8 +21,7 @@
v-list-tile-sub-title(v-html='data.item.author')
v-divider
v-switch(v-model='darkMode', label='Dark Mode', color='primary', persistent-hint, hint='Not recommended for accessibility.')
v-divider.my-0
v-card-actions.grey.lighten-4
v-card-chin
v-spacer
v-btn(color='primary', :loading='loading', @click='save')
v-icon(left) chevron_right
@@ -45,6 +44,12 @@ export default {
selectedTheme: 'default',
darkMode: false
}
},
watch: {
darkMode(newValue, oldValue) {
this.$store.commit('admin/setThemeDarkMode', newValue)
console.info(this.$vuetify.dark)
}
}
}
</script>

2
client/components/admin/admin-users.vue
View File

@@ -1,6 +1,6 @@
<template lang='pug'>
v-card(flat)
v-card(flat, color='grey lighten-5').pa-3.pt-4
v-card(flat, tile, :color='$vuetify.dark ? "grey darken-4" : "grey lighten-5"').pa-3.pt-4
.headline.blue--text.text--darken-2 Users
.subheading.grey--text Manage users
v-card

19
client/components/admin/admin-utilities.vue
View File

@@ -1,20 +1,19 @@
<template lang='pug'>
v-card(flat)
v-card(color='grey lighten-5')
.pa-3.pt-4
.headline.primary--text Utilities
.subheading.grey--text Maintenance and troubleshooting tools
v-tabs(v-model='tab', color='grey lighten-4', fixed-tabs, slider-color='primary', show-arrows)
div
v-card(flat, :color='$vuetify.dark ? "grey darken-4" : "grey lighten-5"').pa-3.pt-4
.headline.primary--text Utilities
.subheading.grey--text Maintenance and troubleshooting tools
v-tabs(:color='$vuetify.dark ? "primary" : "grey lighten-4"', fixed-tabs, :slider-color='$vuetify.dark ? "white" : "primary"', show-arrows)
v-tab(key='tools') Tools
v-tab(key='telemetry') Telemetry
v-tab(key='telemetry') Support
v-tab-item(key='tools', :transition='false', :reverse-transition='false')
v-container.grey.lighten-5(fluid, grid-list-lg)
v-container(fluid, grid-list-lg, :class='$vuetify.dark ? "" : "grey lighten-5"')
v-layout(row, wrap)
v-flex(xs12, sm6)
v-card
v-toolbar(color='grey darken-3', dark, dense, flat)
v-toolbar(:color='$vuetify.dark ? "" : "grey darken-3"', dark, dense, flat)
v-toolbar-title
.subheading Authentication
v-subheader Flush User Sessions
@@ -31,7 +30,7 @@
span Proceed
v-flex(xs12, sm6)
v-card
v-toolbar(color='grey darken-3', dark, dense, flat)
v-toolbar(:color='$vuetify.dark ? "" : "grey darken-3"', dark, dense, flat)
v-toolbar-title
.subheading Maintenance Mode
v-card-text
@@ -40,7 +39,7 @@
icon-home-alert.mr-2(fillColor='#FFFFFF')
| Turn On Maintenance Mode
v-card.mt-3
v-toolbar(color='grey darken-3', dark, dense, flat)
v-toolbar(:color='$vuetify.dark ? "" : "grey darken-3"', dark, dense, flat)
v-toolbar-title
.subheading Graph Endpoint
v-card-text