fix: UI improvements

This commit is contained in:
Nick 2019-08-25 14:23:56 -04:00
parent 7f67c72757
commit 10e19700e5
16 changed files with 125 additions and 158 deletions

6
.gitignore vendored
View File

@ -18,9 +18,9 @@ npm-debug.log*
# Generated assets # Generated assets
/assets /assets
server/views/master.pug /server/views/master.pug
server/views/legacy.pug /server/views/legacy/master.pug
server/views/setup.pug /server/views/setup.pug
# Webpack # Webpack
.webpack-cache .webpack-cache

View File

@ -28,7 +28,7 @@
v-list-item-action v-list-item-action
v-list-item-action-text {{ $t('admin:system.published') }} {{ info.latestVersionReleaseDate | moment('from') }} v-list-item-action-text {{ $t('admin:system.published') }} {{ info.latestVersionReleaseDate | moment('from') }}
v-divider.mt-3 v-card.mt-4.animated.fadeInUp.wait-p2s
v-subheader {{ $t('admin:system.hostInfo') }} v-subheader {{ $t('admin:system.hostInfo') }}
v-list(two-line, dense) v-list(two-line, dense)
v-list-item v-list-item

View File

@ -7,42 +7,47 @@
flat flat
reverse reverse
v-model='minutes' v-model='minutes'
style='flex: 1 1 70px;'
) )
.body-2.mx-3 {{$t('common:duration.minutes')}} .body-2.mx-3 {{$t('common:duration.minutes')}}
v-divider.mr-3() v-divider.mr-3
v-text-field( v-text-field(
solo solo
hide-details hide-details
flat flat
reverse reverse
v-model='hours' v-model='hours'
style='flex: 1 1 70px;'
) )
.body-2.mx-3 {{$t('common:duration.hours')}} .body-2.mx-3 {{$t('common:duration.hours')}}
v-divider.mr-3() v-divider.mr-3
v-text-field( v-text-field(
solo solo
hide-details hide-details
flat flat
reverse reverse
v-model='days' v-model='days'
style='flex: 1 1 70px;'
) )
.body-2.mx-3 {{$t('common:duration.days')}} .body-2.mx-3 {{$t('common:duration.days')}}
v-divider.mr-3() v-divider.mr-3
v-text-field( v-text-field(
solo solo
hide-details hide-details
flat flat
reverse reverse
v-model='months' v-model='months'
style='flex: 1 1 70px;'
) )
.body-2.mx-3 {{$t('common:duration.months')}} .body-2.mx-3 {{$t('common:duration.months')}}
v-divider.mr-3() v-divider.mr-3
v-text-field( v-text-field(
solo solo
hide-details hide-details
flat flat
reverse reverse
v-model='years' v-model='years'
style='flex: 1 1 70px;'
) )
.body-2.mx-3 {{$t('common:duration.years')}} .body-2.mx-3 {{$t('common:duration.years')}}
</template> </template>

View File

@ -81,50 +81,50 @@
@keyup.down='searchMove(`down`)' @keyup.down='searchMove(`down`)'
@keyup.up='searchMove(`up`)' @keyup.up='searchMove(`up`)'
) )
v-menu( //- v-menu(
v-model='searchAdvMenuShown' //- v-model='searchAdvMenuShown'
left //- left
offset-y //- offset-y
min-width='450' //- min-width='450'
:close-on-content-click='false' //- :close-on-content-click='false'
nudge-bottom='7' //- nudge-bottom='7'
nudge-right='5' //- nudge-right='5'
v-if='searchIsShown' //- v-if='searchIsShown'
) //- )
template(v-slot:activator='{ on }') //- template(v-slot:activator='{ on }')
v-btn.nav-header-search-adv(icon, color='grey darken-2', v-on='on') //- v-btn.nav-header-search-adv(icon, color='grey darken-2', v-on='on')
v-icon(color='white') mdi-chevron-down //- v-icon(color='white') mdi-chevron-down
v-card.radius-0(dark) //- v-card.radius-0(dark)
v-toolbar(flat, color='grey darken-4', dense) //- v-toolbar(flat, color='grey darken-4', dense)
v-icon.mr-2 mdi-feature-search-outline //- v-icon.mr-2 mdi-feature-search-outline
v-subheader.pl-0 Advanced Search //- v-subheader.pl-0 Advanced Search
v-spacer //- v-spacer
v-chip(label, small, color='primary') Coming soon //- v-chip(label, small, color='primary') Coming soon
v-card-text.pa-4 //- v-card-text.pa-4
v-checkbox.mt-0( //- v-checkbox.mt-0(
label='Restrict to current language' //- label='Restrict to current language'
color='white' //- color='white'
v-model='searchRestrictLocale' //- v-model='searchRestrictLocale'
hide-details //- hide-details
) //- )
v-checkbox( //- v-checkbox(
label='Search below current path only' //- label='Search below current path only'
color='white' //- color='white'
v-model='searchRestrictPath' //- v-model='searchRestrictPath'
hide-details //- hide-details
) //- )
v-divider //- v-divider
v-card-actions.grey.darken-3-d4 //- v-card-actions.grey.darken-3-d4
v-container.pa-0(grid-list-md) //- v-container.pa-0(grid-list-md)
v-layout(row) //- v-layout(row)
v-flex(xs6) //- v-flex(xs6)
v-btn(depressed, color='grey darken-3', block) //- v-btn(depressed, color='grey darken-3', block)
v-icon(left) mdi-chevron-right //- v-icon(left) mdi-chevron-right
span Save as defaults //- span Save as defaults
v-flex(xs6) //- v-flex(xs6)
v-btn(depressed, color='grey darken-3', block) //- v-btn(depressed, color='grey darken-3', block)
v-icon(left) mdi-cached //- v-icon(left) mdi-cached
span Reset //- span Reset
v-flex(xs6, md4) v-flex(xs6, md4)
v-toolbar.nav-header-inner.pr-4(color='black', dark, flat) v-toolbar.nav-header-inner.pr-4(color='black', dark, flat)
v-spacer v-spacer

View File

@ -1,6 +1,6 @@
<template lang='pug'> <template lang='pug'>
v-dialog(v-model='isShown', max-width='550', persistent) v-dialog(v-model='isShown', max-width='550', persistent)
v-card.wiki-form v-card
.dialog-header.is-short.is-red .dialog-header.is-short.is-red
v-icon.mr-2(color='white') mdi-file-document-box-remove-outline v-icon.mr-2(color='white') mdi-file-document-box-remove-outline
span {{$t('common:page.delete')}} span {{$t('common:page.delete')}}

View File

@ -45,9 +45,9 @@
v-list-item-title(v-html='term') v-list-item-title(v-html='term')
v-divider(v-if='idx < suggestions.length - 1') v-divider(v-if='idx < suggestions.length - 1')
.text-xs-center.pt-5(v-if='search.length > 1') .text-xs-center.pt-5(v-if='search.length > 1')
v-btn.mx-2(outlined, color='orange', @click='search = ``', v-if='results.length > 0') //- v-btn.mx-2(outlined, color='orange', @click='search = ``', v-if='results.length > 0')
v-icon(left) mdi-content-save //- v-icon(left) mdi-content-save
span {{$t('common:header.searchCopyLink')}} //- span {{$t('common:header.searchCopyLink')}}
v-btn.mx-2(outlined, color='pink', @click='search = ``') v-btn.mx-2(outlined, color='pink', @click='search = ``')
v-icon(left) mdi-close v-icon(left) mdi-close
span {{$t('common:header.searchClose')}} span {{$t('common:header.searchClose')}}

View File

@ -214,6 +214,7 @@ export default {
}) })
this.$store.set('editor/id', _.get(resp, 'page.id')) this.$store.set('editor/id', _.get(resp, 'page.id'))
this.$store.set('editor/mode', 'update') this.$store.set('editor/mode', 'update')
this.exitConfirmed = true
window.location.assign(`/${this.$store.get('page/locale')}/${this.$store.get('page/path')}`) window.location.assign(`/${this.$store.get('page/locale')}/${this.$store.get('page/path')}`)
} else { } else {
throw new Error(_.get(resp, 'responseResult.message')) throw new Error(_.get(resp, 'responseResult.message'))

View File

@ -114,49 +114,49 @@
span {{$t('editor:markup.insertLink')}} span {{$t('editor:markup.insertLink')}}
v-tooltip(right, color='teal') v-tooltip(right, color='teal')
template(v-slot:activator='{ on }') template(v-slot:activator='{ on }')
v-btn.animated.fadeInLeft.wait-p1s(icon, tile, v-on='on', dark, @click='toggleModal(`editorModalMedia`)').mx-0 v-btn.mt-3.animated.fadeInLeft.wait-p1s(icon, tile, v-on='on', dark, @click='toggleModal(`editorModalMedia`)').mx-0
v-icon(:color='activeModal === `editorModalMedia` ? `teal` : ``') mdi-folder-multiple-image v-icon(:color='activeModal === `editorModalMedia` ? `teal` : ``') mdi-folder-multiple-image
span {{$t('editor:markup.insertAssets')}} span {{$t('editor:markup.insertAssets')}}
v-tooltip(right, color='teal') v-tooltip(right, color='teal')
template(v-slot:activator='{ on }') template(v-slot:activator='{ on }')
v-btn.animated.fadeInLeft.wait-p2s(icon, tile, v-on='on', dark, @click='toggleModal(`editorModalBlocks`)').mx-0 v-btn.mt-3.animated.fadeInLeft.wait-p2s(icon, tile, v-on='on', dark, @click='toggleModal(`editorModalBlocks`)', disabled).mx-0
v-icon(:color='activeModal === `editorModalBlocks` ? `teal` : ``') mdi-view-dashboard-outline v-icon(:color='activeModal === `editorModalBlocks` ? `teal` : ``') mdi-view-dashboard-outline
span {{$t('editor:markup.insertBlock')}} span {{$t('editor:markup.insertBlock')}}
v-tooltip(right, color='teal') v-tooltip(right, color='teal')
template(v-slot:activator='{ on }') template(v-slot:activator='{ on }')
v-btn.animated.fadeInLeft.wait-p3s(icon, tile, v-on='on', dark, disabled).mx-0 v-btn.mt-3.animated.fadeInLeft.wait-p3s(icon, tile, v-on='on', dark, disabled).mx-0
v-icon mdi-code-braces v-icon mdi-code-braces
span {{$t('editor:markup.insertCodeBlock')}} span {{$t('editor:markup.insertCodeBlock')}}
v-tooltip(right, color='teal') v-tooltip(right, color='teal')
template(v-slot:activator='{ on }') template(v-slot:activator='{ on }')
v-btn.animated.fadeInLeft.wait-p4s(icon, tile, v-on='on', dark, disabled).mx-0 v-btn.mt-3.animated.fadeInLeft.wait-p4s(icon, tile, v-on='on', dark, disabled).mx-0
v-icon mdi-library-video v-icon mdi-library-video
span {{$t('editor:markup.insertVideoAudio')}} span {{$t('editor:markup.insertVideoAudio')}}
v-tooltip(right, color='teal') v-tooltip(right, color='teal')
template(v-slot:activator='{ on }') template(v-slot:activator='{ on }')
v-btn.animated.fadeInLeft.wait-p5s(icon, tile, v-on='on', dark, disabled).mx-0 v-btn.mt-3.animated.fadeInLeft.wait-p5s(icon, tile, v-on='on', dark, disabled).mx-0
v-icon mdi-chart-multiline v-icon mdi-chart-multiline
span {{$t('editor:markup.insertDiagram')}} span {{$t('editor:markup.insertDiagram')}}
v-tooltip(right, color='teal') v-tooltip(right, color='teal')
template(v-slot:activator='{ on }') template(v-slot:activator='{ on }')
v-btn.animated.fadeInLeft.wait-p6s(icon, tile, v-on='on', dark, disabled).mx-0 v-btn.mt-3.animated.fadeInLeft.wait-p6s(icon, tile, v-on='on', dark, disabled).mx-0
v-icon mdi-function-variant v-icon mdi-function-variant
span {{$t('editor:markup.insertMathExpression')}} span {{$t('editor:markup.insertMathExpression')}}
v-tooltip(right, color='teal') v-tooltip(right, color='teal')
template(v-slot:activator='{ on }') template(v-slot:activator='{ on }')
v-btn.animated.fadeInLeft.wait-p7s(icon, tile, v-on='on', dark, disabled).mx-0 v-btn.mt-3.animated.fadeInLeft.wait-p7s(icon, tile, v-on='on', dark, disabled).mx-0
v-icon mdi-table-plus v-icon mdi-table-plus
span {{$t('editor:markup.tableHelper')}} span {{$t('editor:markup.tableHelper')}}
template(v-if='$vuetify.breakpoint.mdAndUp') template(v-if='$vuetify.breakpoint.mdAndUp')
v-spacer v-spacer
v-tooltip(right, color='teal') v-tooltip(right, color='teal')
template(v-slot:activator='{ on }') template(v-slot:activator='{ on }')
v-btn.animated.fadeInLeft.wait-p8s(icon, tile, v-on='on', dark, @click='toggleFullscreen').mx-0 v-btn.mt-3.animated.fadeInLeft.wait-p8s(icon, tile, v-on='on', dark, @click='toggleFullscreen').mx-0
v-icon mdi-arrow-expand-all v-icon mdi-arrow-expand-all
span {{$t('editor:markup.distractionFreeMode')}} span {{$t('editor:markup.distractionFreeMode')}}
v-tooltip(right, color='teal') v-tooltip(right, color='teal')
template(v-slot:activator='{ on }') template(v-slot:activator='{ on }')
v-btn.animated.fadeInLeft.wait-p9s(icon, tile, v-on='on', dark, @click='toggleHelp').mx-0 v-btn.mt-3.animated.fadeInLeft.wait-p9s(icon, tile, v-on='on', dark, @click='toggleHelp').mx-0
v-icon(:color='helpShown ? `teal` : ``') mdi-help-circle v-icon(:color='helpShown ? `teal` : ``') mdi-help-circle
span {{$t('editor:markup.markdownFormattingHelp')}} span {{$t('editor:markup.markdownFormattingHelp')}}
.editor-markdown-editor .editor-markdown-editor
@ -384,7 +384,7 @@ export default {
}, 500), }, 500),
onCmPaste (cm, ev) { onCmPaste (cm, ev) {
const clipItems = (ev.clipboardData || ev.originalEvent.clipboardData).items const clipItems = (ev.clipboardData || ev.originalEvent.clipboardData).items
for (const clipItem of clipItems) { for (let clipItem of clipItems) {
if (_.startsWith(clipItem.type, 'image/')) { if (_.startsWith(clipItem.type, 'image/')) {
const file = clipItem.getAsFile() const file = clipItem.getAsFile()
const reader = new FileReader() const reader = new FileReader()

View File

@ -9,7 +9,7 @@
v-toolbar.radius-7(:color='$vuetify.theme.dark ? `teal` : `teal lighten-5`', dense, flat, height='44') v-toolbar.radius-7(:color='$vuetify.theme.dark ? `teal` : `teal lighten-5`', dense, flat, height='44')
.body-2(:class='$vuetify.theme.dark ? `white--text` : `teal--text`') {{$t('editor:assets.title')}} .body-2(:class='$vuetify.theme.dark ? `white--text` : `teal--text`') {{$t('editor:assets.title')}}
v-spacer v-spacer
v-btn(flat, icon, @click='refresh', tile, small) v-btn(text, icon, @click='refresh')
v-icon(:color='$vuetify.theme.dark ? `white` : `teal`') mdi-refresh v-icon(:color='$vuetify.theme.dark ? `white` : `teal`') mdi-refresh
v-dialog(v-model='newFolderDialog', max-width='550') v-dialog(v-model='newFolderDialog', max-width='550')
template(v-slot:activator='{ on }') template(v-slot:activator='{ on }')
@ -18,7 +18,7 @@
span.hidden-sm-and-down(:class='$vuetify.theme.dark ? `teal--text text--lighten-3` : ``') {{$t('editor:assets.newFolder')}} span.hidden-sm-and-down(:class='$vuetify.theme.dark ? `teal--text text--lighten-3` : ``') {{$t('editor:assets.newFolder')}}
v-card v-card
.dialog-header.is-short.subtitle-1 {{$t('editor:assets.newFolder')}} .dialog-header.is-short.subtitle-1 {{$t('editor:assets.newFolder')}}
v-card-text v-card-text.pt-5
v-text-field.md2( v-text-field.md2(
outlined outlined
prepend-icon='mdi-folder-outline' prepend-icon='mdi-folder-outline'
@ -48,7 +48,7 @@
v-icon mdi-folder-upload v-icon mdi-folder-upload
v-btn.btn-normalcase.mx-1(v-for='folder of folders', :key='folder.id', depressed, color='grey darken-2', dark, @click='downFolder(folder)') v-btn.btn-normalcase.mx-1(v-for='folder of folders', :key='folder.id', depressed, color='grey darken-2', dark, @click='downFolder(folder)')
v-icon(left) mdi-folder v-icon(left) mdi-folder
span.caption {{ folder.name }} span.caption(style='text-transform: none;') {{ folder.name }}
v-divider.mt-2 v-divider.mt-2
v-data-table( v-data-table(
:items='assets' :items='assets'
@ -186,14 +186,14 @@
//- RENAME DIALOG //- RENAME DIALOG
v-dialog(v-model='renameDialog', max-width='550', persistent) v-dialog(v-model='renameDialog', max-width='550', persistent)
v-card.wiki-form v-card
.dialog-header.is-short.is-orange .dialog-header.is-short.is-orange
v-icon.mr-2(color='white') keyboard v-icon.mr-2(color='white') mdi-keyboard
span {{$t('editor:assets.renameAsset')}} span {{$t('editor:assets.renameAsset')}}
v-card-text v-card-text.pt-5
.body-2 {{$t('editor:assets.renameAssetSubtitle')}} .body-2 {{$t('editor:assets.renameAssetSubtitle')}}
v-text-field( v-text-field(
outline outlined
single-line single-line
:counter='255' :counter='255'
v-model='renameAssetName' v-model='renameAssetName'
@ -202,24 +202,24 @@
) )
v-card-chin v-card-chin
v-spacer v-spacer
v-btn(flat, @click='renameDialog = false', :disabled='renameAssetLoading') {{$t('common:actions.cancel')}} v-btn(text, @click='renameDialog = false', :disabled='renameAssetLoading') {{$t('common:actions.cancel')}}
v-btn(color='orange darken-3', @click='renameAsset', :loading='renameAssetLoading').white--text {{$t('common:actions.rename')}} v-btn.px-3(color='orange darken-3', @click='renameAsset', :loading='renameAssetLoading').white--text {{$t('common:actions.rename')}}
//- DELETE DIALOG //- DELETE DIALOG
v-dialog(v-model='deleteDialog', max-width='550', persistent) v-dialog(v-model='deleteDialog', max-width='550', persistent)
v-card.wiki-form v-card
.dialog-header.is-short.is-red .dialog-header.is-short.is-red
v-icon.mr-2(color='white') highlight_off v-icon.mr-2(color='white') mdi-trash-can-outline
span {{$t('editor:assets.deleteAsset')}} span {{$t('editor:assets.deleteAsset')}}
v-card-text v-card-text.pt-5
.body-2 {{$t('editor:assets.deleteAssetConfirm')}} .body-2 {{$t('editor:assets.deleteAssetConfirm')}}
.body-2.red--text.text--darken-2 {{currentAsset.filename}}? .body-2.red--text.text--darken-2 {{currentAsset.filename}}?
.caption.mt-3 {{$t('editor:assets.deleteAssetWarn')}} .caption.mt-3 {{$t('editor:assets.deleteAssetWarn')}}
v-card-chin v-card-chin
v-spacer v-spacer
v-btn(flat, @click='deleteDialog = false', :disabled='deleteAssetLoading') {{$t('common:actions.cancel')}} v-btn(text, @click='deleteDialog = false', :disabled='deleteAssetLoading') {{$t('common:actions.cancel')}}
v-btn(color='red darken-2', @click='deleteAsset', :loading='deleteAssetLoading').white--text {{$t('common:actions.delete')}} v-btn.px-3(color='red darken-2', @click='deleteAsset', :loading='deleteAssetLoading').white--text {{$t('common:actions.delete')}}
</template> </template>
<script> <script>

View File

@ -16,8 +16,8 @@
) )
v-icon(left) mdi-check v-icon(left) mdi-check
span {{ $t('common:actions.ok') }} span {{ $t('common:actions.ok') }}
v-card.wiki-form(tile) v-card(tile)
v-card-text v-card-text.pt-5
.overline.pb-5 {{$t('editor:props.pageInfo')}} .overline.pb-5 {{$t('editor:props.pageInfo')}}
v-text-field( v-text-field(
ref='iptTitle' ref='iptTitle'
@ -35,7 +35,7 @@
:hint='$t(`editor:props.shortDescriptionHint`)' :hint='$t(`editor:props.shortDescriptionHint`)'
) )
v-divider v-divider
v-card-text.grey(:class='darkMode ? `darken-3-d3` : `lighten-5`') v-card-text.grey.pt-5(:class='darkMode ? `darken-3-d3` : `lighten-5`')
.overline.pb-5 {{$t('editor:props.pathCategorization')}} .overline.pb-5 {{$t('editor:props.pathCategorization')}}
v-container.pa-0(fluid, grid-list-lg) v-container.pa-0(fluid, grid-list-lg)
v-layout(row, wrap) v-layout(row, wrap)
@ -73,7 +73,7 @@
disabled disabled
) )
v-divider v-divider
v-card-text.pb-5.grey(:class='darkMode ? `darken-3-d5` : `lighten-4`') v-card-text.py-5.grey(:class='darkMode ? `darken-3-d5` : `lighten-4`')
.overline.pb-5 {{$t('editor:props.publishState')}} #[v-chip.ml-3(label, color='grey', small, outlined).white--text coming soon] .overline.pb-5 {{$t('editor:props.publishState')}} #[v-chip.ml-3(label, color='grey', small, outlined).white--text coming soon]
v-container.pa-0(fluid, grid-list-lg) v-container.pa-0(fluid, grid-list-lg)
v-layout(row, wrap) v-layout(row, wrap)

View File

@ -36,12 +36,14 @@
v-if='diffSource === ph.versionId' v-if='diffSource === ph.versionId'
small small
color='pink' color='pink'
label
) )
.caption.white--text Source .caption.white--text Source
v-chip.ml-0.mr-3( v-chip.ml-0.mr-3(
v-if='diffTarget === ph.versionId' v-if='diffTarget === ph.versionId'
small small
color='pink' color='pink'
label
) )
.caption.white--text Target .caption.white--text Target
.caption(v-if='ph.actionType === `edit`') Edited by #[strong {{ ph.authorName }}] .caption(v-if='ph.actionType === `edit`') Edited by #[strong {{ ph.authorName }}]
@ -49,32 +51,28 @@
.caption(v-else-if='ph.actionType === `initial`') Created by #[strong {{ ph.authorName }}] .caption(v-else-if='ph.actionType === `initial`') Created by #[strong {{ ph.authorName }}]
.caption(v-else) Unknown Action by #[strong {{ ph.authorName }}] .caption(v-else) Unknown Action by #[strong {{ ph.authorName }}]
v-spacer v-spacer
.caption {{ ph.createdAt | moment('calendar') }} .caption.mr-3 {{ ph.createdAt | moment('calendar') }}
v-menu(offset-x, left) v-menu(offset-x, left)
v-btn(icon, slot='activator'): v-icon more_horiz template(v-slot:activator='{ on }')
v-list(dense).history-promptmenu v-btn.mr-0(icon, v-on='on', small, tile): v-icon mdi-dots-horizontal
v-list(dense, nav).history-promptmenu
v-list-item(@click='setDiffTarget(ph.versionId)') v-list-item(@click='setDiffTarget(ph.versionId)')
v-list-item-avatar: v-icon call_made v-list-item-avatar(size='24'): v-icon mdi-call-received
v-list-item-title Set as Differencing Target v-list-item-title Set as Differencing Target
v-divider
v-list-item(@click='setDiffSource(ph.versionId)') v-list-item(@click='setDiffSource(ph.versionId)')
v-list-item-avatar: v-icon call_received v-list-item-avatar(size='24'): v-icon mdi-call-made
v-list-item-title Set as Differencing Source v-list-item-title Set as Differencing Source
v-divider
v-list-item v-list-item
v-list-item-avatar: v-icon code v-list-item-avatar(size='24'): v-icon mdi-code-tags
v-list-item-title View Source v-list-item-title View Source
v-divider
v-list-item v-list-item
v-list-item-avatar: v-icon cloud_download v-list-item-avatar(size='24'): v-icon mdi-cloud-download-outline
v-list-item-title Download Version v-list-item-title Download Version
v-divider
v-list-item v-list-item
v-list-item-avatar: v-icon restore v-list-item-avatar(size='24'): v-icon mdi-history
v-list-item-title Restore v-list-item-title Restore
v-divider
v-list-item v-list-item
v-list-item-avatar: v-icon call_split v-list-item-avatar(size='24'): v-icon mdi-source-branch
v-list-item-title Branch off from here v-list-item-title Branch off from here
v-btn.ma-0.radius-7( v-btn.ma-0.radius-7(
@ -223,11 +221,11 @@ export default {
trailIcon(actionType) { trailIcon(actionType) {
switch (actionType) { switch (actionType) {
case 'edit': case 'edit':
return 'edit' return 'mdi-pencil'
case 'move': case 'move':
return 'forward' return 'forward'
case 'initial': case 'initial':
return 'add' return 'mdi-plus'
default: default:
return 'warning' return 'warning'
} }

View File

@ -49,14 +49,14 @@
v-divider v-divider
v-container.grey.pa-0(fluid, :class='darkMode ? `darken-4-l3` : `lighten-4`') v-container.grey.pa-0(fluid, :class='darkMode ? `darken-4-l3` : `lighten-4`')
v-row(no-gutters, align-content='center', style='height: 90px;') v-row(no-gutters, align-content='center', style='height: 90px;')
v-col.pl-4(offset-xl='2', offset-lg='3') v-col.pl-4.page-col-content(offset-xl='2', offset-lg='3')
.headline.grey--text(:class='darkMode ? `text--lighten-2` : `text--darken-3`') {{title}} .headline.grey--text(:class='darkMode ? `text--lighten-2` : `text--darken-3`') {{title}}
.caption.grey--text.text--darken-1 {{description}} .caption.grey--text.text--darken-1 {{description}}
v-divider v-divider
v-container.pl-5.pt-4(fluid, grid-list-xl) v-container.pl-5.pt-4(fluid, grid-list-xl)
v-layout(row) v-layout(row)
v-flex.page-col-sd(lg3, xl2, v-if='$vuetify.breakpoint.lgAndUp', style='margin-top: -90px;') v-flex.page-col-sd(lg3, xl2, v-if='$vuetify.breakpoint.lgAndUp', style='margin-top: -90px;')
v-card(v-if='toc.length') v-card.mb-5(v-if='toc.length')
.overline.pa-5.pb-0(:class='darkMode ? `blue--text text--lighten-2` : `primary--text`') {{$t('common:page.toc')}} .overline.pa-5.pb-0(:class='darkMode ? `blue--text text--lighten-2` : `primary--text`') {{$t('common:page.toc')}}
v-list.pb-3(dense, nav, :class='darkMode ? `darken-3-d3` : ``') v-list.pb-3(dense, nav, :class='darkMode ? `darken-3-d3` : ``')
template(v-for='(tocItem, tocIdx) in toc') template(v-for='(tocItem, tocIdx) in toc')
@ -70,7 +70,7 @@
v-list-item-title.px-3.caption.grey--text(:class='darkMode ? `text--lighten-1` : `text--darken-1`') {{tocSubItem.title}} v-list-item-title.px-3.caption.grey--text(:class='darkMode ? `text--lighten-1` : `text--darken-1`') {{tocSubItem.title}}
//- v-divider(inset, v-if='tocIdx < toc.length - 1') //- v-divider(inset, v-if='tocIdx < toc.length - 1')
v-card.mt-5(v-if='tags.length > 0') v-card.mb-5(v-if='tags.length > 0')
.pa-5 .pa-5
.overline.teal--text.pb-2(:class='$vuetify.theme.dark ? `text--lighten-3` : ``') Tags .overline.teal--text.pb-2(:class='$vuetify.theme.dark ? `text--lighten-3` : ``') Tags
v-chip.mr-1( v-chip.mr-1(
@ -83,7 +83,7 @@
v-icon(color='teal', left, small) mdi-label v-icon(color='teal', left, small) mdi-label
span.teal--text.text--darken-2 {{tag.text}} span.teal--text.text--darken-2 {{tag.text}}
v-card.mt-5 v-card.mb-5
.pa-5 .pa-5
.overline.indigo--text.d-flex.align-center(:class='$vuetify.theme.dark ? `text--lighten-3` : ``') .overline.indigo--text.d-flex.align-center(:class='$vuetify.theme.dark ? `text--lighten-3` : ``')
span {{$t('common:page.lastEditedBy')}} span {{$t('common:page.lastEditedBy')}}
@ -96,7 +96,7 @@
.body-2.grey--text(:class='darkMode ? `` : `text--darken-3`') {{ authorName }} .body-2.grey--text(:class='darkMode ? `` : `text--darken-3`') {{ authorName }}
.caption.grey--text.text--darken-1 {{ updatedAt | moment('calendar') }} .caption.grey--text.text--darken-1 {{ updatedAt | moment('calendar') }}
v-card.mt-5 v-card.mb-5
.pa-5 .pa-5
.overline.pb-2.yellow--text(:class='$vuetify.theme.dark ? `text--darken-3` : `text--darken-4`') Rating .overline.pb-2.yellow--text(:class='$vuetify.theme.dark ? `text--darken-3` : `text--darken-4`') Rating
.text-center .text-center
@ -109,8 +109,8 @@
) )
.caption.grey--text 5 votes .caption.grey--text 5 votes
v-card.mt-5(flat) v-card(flat)
v-toolbar(:color='darkMode ? `grey darken-3` : `grey lighten-3`', flat, dense) v-toolbar(:color='darkMode ? `grey darken-4-d3` : `grey lighten-3`', flat, dense)
v-spacer v-spacer
v-tooltip(bottom) v-tooltip(bottom)
template(v-slot:activator='{ on }') template(v-slot:activator='{ on }')
@ -122,7 +122,7 @@
span {{$t('common:page.share')}} span {{$t('common:page.share')}}
v-tooltip(bottom) v-tooltip(bottom)
template(v-slot:activator='{ on }') template(v-slot:activator='{ on }')
v-btn(icon, tile, v-on='on'): v-icon(color='grey') mdi-printer v-btn(icon, tile, v-on='on', @click='print'): v-icon(color='grey') mdi-printer
span {{$t('common:page.printFormat')}} span {{$t('common:page.printFormat')}}
v-spacer v-spacer
@ -320,6 +320,9 @@ export default {
upBtnScroll () { upBtnScroll () {
const scrollOffset = window.pageYOffset || document.documentElement.scrollTop const scrollOffset = window.pageYOffset || document.documentElement.scrollTop
this.upBtnShown = scrollOffset > window.innerHeight * 0.33 this.upBtnShown = scrollOffset > window.innerHeight * 0.33
},
print () {
window.print()
} }
} }
} }

View File

@ -654,16 +654,17 @@
.nav-header, .nav-header,
.v-navigation-drawer, .v-navigation-drawer,
.v-footer, .v-footer,
.v-btn--floating, .v-btn--fab,
.page-col-sd .page-col-sd
{ {
display: none; display: none !important;
} }
.page-col-content { .page-col-content {
flex-basis: 100% !important; flex-basis: 100% !important;
flex-grow: 1 !important; flex-grow: 1 !important;
max-width: 100% !important; max-width: 100% !important;
margin-left: 0 !important;
> .v-toolbar { > .v-toolbar {
border: 1px solid mc('grey', '300') !important; border: 1px solid mc('grey', '300') !important;
@ -677,6 +678,7 @@
.v-content { .v-content {
padding: 0 !important; padding: 0 !important;
font-size: 14px;
} }

View File

@ -44,16 +44,6 @@ html
//- CSS //- CSS
link(
type='text/css'
rel='stylesheet'
href='/css/legacy.b8600c4bfa9b6d21f54c.css'
integrity='sha256-c43Iog8YvFPD9EQvD11jnxb0IYOFUtxYA2ABtJIQPmM= sha512-g1nj/OKi7ykTfsdrhgu4lqOqyKMZBvAGvjS98r9cXI96DaciNfgXtlLIGmR3wgQuGrV3n3rCs94BB6lK9OI7qA=='
crossorigin='use-credentials'
)
script( script(
crossorigin='anonymous' crossorigin='anonymous'
src='https://polyfill.io/v3/polyfill.min.js?features=EventSource' src='https://polyfill.io/v3/polyfill.min.js?features=EventSource'
@ -64,18 +54,14 @@ html
script( script(
type='text/javascript' type='text/javascript'
src='/js/runtime.fc95297b6e8ae6e2e003.js' src='/js/runtime.js'
integrity='sha256-6bZfGqlPATFeFRP90SGQYPuIILZahs+tXrS/eQdEUzc= sha512-tBIg4dA1HmUAT8xl3YuZu9eyiB1KWmSkI74kM2bi+BzZe12YXogJ5PHNzxb+Cnw6fjavInmnljB4X1QFzumrUw=='
crossorigin='use-credentials'
) )
script( script(
type='text/javascript' type='text/javascript'
src='/js/legacy.b8600c4bfa9b6d21f54c.js' src='/js/legacy.js'
integrity='sha256-KYTyzCk08U1fUx2pAcphdJOBWcWNe3m4jAcIeeZJX2U= sha512-vOBKbPZkD3HfjP2MfM6O4yhXBXZ5WJNzukJVZMtQKw84yvUePUnJstJ6t90jy2NPO9UTaEpF3J2SNh+3DBofKQ=='
crossorigin='use-credentials'
) )

View File

@ -48,33 +48,19 @@ html(lang=siteConfig.lang)
//- CSS //- CSS
link(
type='text/css'
rel='stylesheet'
href='/css/app.303f1e1fbb500ede4cef.css'
integrity='sha256-wmeXKjjPKSCWT+1pyn38uD5929SyTO0vx1rq3xjLFcE= sha512-Qjh++VFQQnL0y3E0WAzvHmpT9UwTwtQBoo9vwZu02OqxG9OXRGCEJWzRPLkn/fRVP6wrlBPMSz/DVaAaeUhW1w=='
crossorigin='use-credentials'
)
//- JS //- JS
script( script(
type='text/javascript' type='text/javascript'
src='/js/runtime.fc95297b6e8ae6e2e003.js' src='/js/runtime.js'
integrity='sha256-6bZfGqlPATFeFRP90SGQYPuIILZahs+tXrS/eQdEUzc= sha512-tBIg4dA1HmUAT8xl3YuZu9eyiB1KWmSkI74kM2bi+BzZe12YXogJ5PHNzxb+Cnw6fjavInmnljB4X1QFzumrUw=='
crossorigin='use-credentials'
) )
script( script(
type='text/javascript' type='text/javascript'
src='/js/app.303f1e1fbb500ede4cef.js' src='/js/app.js'
integrity='sha256-cSXcjyRtFGAvQ5BnRPbLxcr3itR1X8wgcNO5RlvMLEU= sha512-dy3W6c8IlJpAfGpMi3FibzOI6g1o65CpsEWgIZU/Fl/l0ofUxrxXP3xpfNuAaLgmQfc5l+x3IomXmeM8OBEIUQ=='
crossorigin='use-credentials'
) )

View File

@ -24,33 +24,19 @@ html
//- CSS //- CSS
link(
type='text/css'
rel='stylesheet'
href='/css/setup.35a646a90c01e5e5f6f5.css'
integrity='sha256-HNu607cPBzAhzYo8xjvM307b5k18J+Vr2OWTFlMuiIw= sha512-b0KTirC8Myjz1FnIYY9fFrYoexiVj7/3N3TeuHU+IfCx2ZM+uMilVoZPe4sBC+xXTuuJIoJWwgjH3ZI1Lt6eAQ=='
crossorigin='use-credentials'
)
//- JS //- JS
script( script(
type='text/javascript' type='text/javascript'
src='/js/runtime.fc95297b6e8ae6e2e003.js' src='/js/runtime.js'
integrity='sha256-6bZfGqlPATFeFRP90SGQYPuIILZahs+tXrS/eQdEUzc= sha512-tBIg4dA1HmUAT8xl3YuZu9eyiB1KWmSkI74kM2bi+BzZe12YXogJ5PHNzxb+Cnw6fjavInmnljB4X1QFzumrUw=='
crossorigin='use-credentials'
) )
script( script(
type='text/javascript' type='text/javascript'
src='/js/setup.35a646a90c01e5e5f6f5.js' src='/js/setup.js'
integrity='sha256-DS7oIW0jf1JjTIBH/NfUxFTx9ZCUd67yy0OdZ4+PqZc= sha512-dHe0IsiBCGYirAl+JqFIjQEtG/sV/QShDoppFskoqunXxGnzqM1zphxfRCX8ooKLaQrGfW9F8HNBVsUSK02HNg=='
crossorigin='use-credentials'
) )