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

feat: themes foundation + editors load improvements

Browse Source
This commit is contained in:
Nicolas Giard
2018-08-09 00:07:15 -04:00
parent 5620419d05
commit 2f26d731fc
30 changed files with 396 additions and 298 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
client/app.js
View File

@@ -115,6 +115,7 @@ Vue.component('nav-header', () => import(/* webpackMode: "eager" */ './component
Vue.component('profile', () => import(/* webpackChunkName: "profile" */ './components/profile.vue'))
Vue.component('setup', () => import(/* webpackChunkName: "setup" */ './components/setup.vue'))
Vue.component('v-card-chin', () => import(/* webpackMode: "eager" */ './components/common/v-card-chin.vue'))
Vue.component('page', () => import(/* webpackChunkName: "theme-page" */ './themes/' + process.env.CURRENT_THEME + '/components/app.vue'))
let bootstrap = () => {
// ====================================

2
client/components/common/nav-footer.vue
View File

@@ -1,5 +1,5 @@
<template lang="pug">
v-footer.py-2.justify-center(app, absolute, :color='darkMode ? "" : "grey lighten-3"', inset, height='auto')
v-footer.justify-center(:color='darkMode ? "" : "grey lighten-3"', inset)
.caption.grey--text.text--darken-1
span(v-if='company && company.length > 0') {{ $t('common:footer.copyright', { company: company, year: currentYear }) }} |&nbsp;
span {{ $t('common:footer.poweredBy') }} Wiki.js

46
client/components/common/nav-header.vue
View File

@@ -1,30 +1,30 @@
<template lang='pug'>
v-toolbar(color='black', dark, app, clipped-left, fixed, flat, :dense='dense')
v-menu(open-on-hover, offset-y, bottom, left, nudge-top='-18', min-width='250')
v-toolbar(color='black', dark, app, clipped-left, fixed, flat)
v-menu(open-on-hover, offset-y, bottom, left, min-width='250')
v-toolbar-side-icon(slot='activator')
v-icon view_module
v-list(dense).py-0
v-list-tile(avatar, href='/')
v-list-tile-avatar: v-icon(color='blue') home
v-list-tile-content Home
v-list-tile(avatar, @click='')
v-list-tile(avatar, @click='pageNew')
v-list-tile-avatar: v-icon(color='green') add_box
v-list-tile-content New Page
v-divider.my-0
v-subheader Current Page
v-list-tile(avatar, @click='')
v-list-tile(avatar, @click='pageEdit')
v-list-tile-avatar: v-icon(color='indigo') edit
v-list-tile-content Edit
v-list-tile(avatar, @click='')
v-list-tile(avatar, @click='pageHistory')
v-list-tile-avatar: v-icon(color='indigo') history
v-list-tile-content History
v-list-tile(avatar, @click='')
v-list-tile(avatar, @click='pageSource')
v-list-tile-avatar: v-icon(color='indigo') code
v-list-tile-content View Source
v-list-tile(avatar, @click='')
v-list-tile(avatar, @click='pageMove')
v-list-tile-avatar: v-icon(color='indigo') forward
v-list-tile-content Move / Rename
v-list-tile(avatar, @click='')
v-list-tile(avatar, @click='pageDelete')
v-list-tile-avatar: v-icon(color='red darken-2') delete
v-list-tile-content Delete
v-divider.my-0
@@ -61,11 +61,15 @@
.navHeaderLoading.mr-3
v-progress-circular(indeterminate, color='blue', :size='22', :width='2' v-show='isLoading')
slot(name='actions')
v-btn(icon, href='/a')
v-icon(color='grey') settings
v-tooltip(bottom)
v-btn(icon, href='/a', slot='activator')
v-icon(color='grey') settings
span Admin
v-menu(offset-y, min-width='300')
v-btn(icon, slot='activator')
v-icon(color='grey') account_circle
v-tooltip(bottom, slot='activator')
v-btn(icon, slot='activator')
v-icon(color='grey') account_circle
span Account
v-list.py-0
v-list-tile.py-3(avatar)
v-list-tile-avatar
@@ -116,6 +120,24 @@ export default {
methods: {
searchEnter() {
this.searchIsLoading = true
},
pageNew () {
},
pageEdit () {
},
pageHistory () {
},
pageSource () {
},
pageMove () {
},
pageDelete () {
}
}
}

20
client/components/profile/preferences.vue
View File

@@ -14,10 +14,18 @@
.subheading Display
v-card-text
v-subheader.pl-0 Locale
v-select.grey.lighten-5(solo, flat)
v-divider
v-select(
outline
background-color='grey lighten-2'
hide-details
)
v-divider.mt-3
v-subheader.pl-0 Timezone
v-select.grey.lighten-5(solo, flat)
v-select(
outline
background-color='grey lighten-2'
hide-details
)
v-card-chin
v-spacer
v-btn(color='primary')
@@ -30,7 +38,11 @@
.subheading Editing
v-card-text
v-subheader.pl-0 Default Editor
v-select.grey.lighten-5(solo, flat)
v-select(
outline
background-color='grey lighten-2'
hide-details
)
v-card-chin
v-spacer
v-btn(color='primary')

6
client/components/profile/profile.vue
View File

@@ -36,12 +36,12 @@
)
v-icon(:color='darkMode ? "grey lighten-1" : "purple darken-4"') supervised_user_circle
.subheading.ml-3 Local
v-divider
v-divider.mt-3
v-subheader.pl-0 Two-Factor Authentication (2FA)
.caption.mb-2 2FA adds an extra layer of security by requiring a unique code generated on your smartphone when signing in.
v-btn(color='purple darken-4', dark, depressed).ml-0 Enable 2FA
v-btn(color='purple darken-4', dark, depressed, disabled).ml-0 Disable 2FA
v-divider
v-divider.mt-3
v-subheader.pl-0 Change Password
v-text-field(label='Current Password', prepend-icon='last_page')
v-text-field(label='New Password', prepend-icon='last_page')
@@ -68,7 +68,7 @@
.body-1: strong January 1st, 2018 at 12:00 AM
.body-2.grey--text.mt-3 Last login on
.body-1: strong January 1st, 2018 at 12:00 AM
v-divider
v-divider.mt-3
.body-2.grey--text.mt-3 Pages created
.body-1: strong 0
.body-2.grey--text.mt-3 Comments posted

4
client/index.js
View File

@@ -2,6 +2,8 @@
require('vuetify/src/stylus/main.styl')
require('./scss/app.scss')
require('./themes/' + process.env.CURRENT_THEME + '/scss/app.scss')
require('./helpers/compatibility.js')
require('offline-plugin/runtime').install()
require('./app.js')
require('./themes/' + process.env.CURRENT_THEME + '/js/app.js')

88
client/themes/default/components/app.vue Normal file
View File

@@ -0,0 +1,88 @@
<template lang="pug">
v-app
nav-header
v-navigation-drawer.primary(dark, app, clipped, permanent)
v-list(dense)
v-list-tile.pt-2
v-list-tile-avatar: v-icon home
v-list-tile-title Home
v-divider.my-2
v-subheader.pl-4 Navigation
v-list-tile
v-list-tile-avatar: v-icon stars
v-list-tile-title The Universe
v-list-tile
v-list-tile-avatar: v-icon directions_boat
v-list-tile-title Ships
v-list-tile
v-list-tile-avatar: v-icon local_airport
v-list-tile-title Airports
v-content
v-toolbar(color='grey lighten-3', flat, dense)
v-breadcrumbs.pl-0(divider='/')
v-breadcrumbs-item Universe
v-breadcrumbs-item Galaxy
v-breadcrumbs-item Solar System
v-breadcrumbs-item Planet Earth
v-divider
v-layout(row)
v-flex(xs10)
v-toolbar(color='grey lighten-4', flat, :height='90')
div
.headline.grey--text.text--darken-3 {{title}}
.caption.grey--text.text--darken-1 {{description}}
.contents
slot(name='contents')
v-flex(xs2, fill-height)
v-toolbar(color='grey lighten-4', flat, :height='90')
div
.caption.grey--text.text--lighten-1 Last edited by
.body-2.grey--text.text--darken-3 John Doe
.caption.grey--text.text--darken-1 Monday at 12:34 PM
v-spacer
v-icon edit
v-list.grey.lighten-3(dense)
v-subheader.pl-4 Table of contents
v-list-tile
v-list-tile-avatar: v-icon chevron_right
v-list-tile-title Introduction
v-list-tile
v-list-tile-avatar: v-icon chevron_right
v-list-tile-title Cities
v-list-tile(inset)
v-list-tile-avatar: v-icon chevron_right
v-list-tile-title New York
v-divider.my-2
v-subheader.pl-4 Metadata
v-list-tile
v-list-tile-avatar: v-icon chevron_right
v-list-tile-title Test
v-list-tile
v-list-tile-avatar: v-icon chevron_right
v-list-tile-title Test
v-list-tile
v-list-tile-avatar: v-icon chevron_right
v-list-tile-title Test
nav-footer
</template>
<script>
export default {
props: {
title: {
type: String,
default: 'Untitled Page'
},
description: {
type: String,
default: ''
}
}
}
</script>
<style lang="scss">
</style>

1
client/themes/default/js/app.js Normal file
View File

@@ -0,0 +1 @@
/* THEME SPECIFIC JAVASCRIPT */

45
client/themes/default/scss/app.scss Normal file
View File

@@ -0,0 +1,45 @@
/* THEME SPECIFIC STYLES */
.contents {
h1 {
padding-left: 16px;
color: mc('blue', '800');
margin-top: 16px;
position: relative;
&::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 2px;
background: linear-gradient(to right, mc('blue', '500'), rgba(mc('blue', '500'), 0));
}
& + h2 {
margin-top: 8px;
}
}
h2 {
margin-left: 16px;
padding: 8px 0 0 0;
color: mc('grey', '800');
position: relative;
&::after {
content: '';
position: absolute;
bottom: 0;
left: 0;
width: 100%;
height: 1px;
background: linear-gradient(to right, mc('grey', '700'), rgba(mc('grey', '700'), 0));
}
}
p {
padding: 16px 16px 0 16px;
margin: 0;
}
}

7
client/themes/default/theme.yml Normal file
View File

@@ -0,0 +1,7 @@
name: Default
author: requarks.io
site: https://wiki.requarks.io/
version: 1.0.0
requirements:
minimum: '>= 2.0.0'
maximum: '< 3.0.0'

BIN
client/themes/default/thumbnail.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 22 KiB