fix: nav external blank option

pull/1865/head
NGPixel 5 years ago
parent 98bf0d9ccb
commit cc9f022051

@ -27,13 +27,13 @@
v-list-item-avatar(size='24', tile): v-icon mdi-file-document-outline v-list-item-avatar(size='24', tile): v-icon mdi-file-document-outline
v-list-item-title {{ $t('admin:pages.title') }} v-list-item-title {{ $t('admin:pages.title') }}
v-list-item-action(style='min-width:auto;') v-list-item-action(style='min-width:auto;')
v-chip(x-small, :color='darkMode ? `grey darken-3-d4` : `grey lighten-5`') v-chip(x-small, :color='$vuetify.theme.dark ? `grey darken-3-d4` : `grey lighten-5`')
.caption.grey--text {{ info.pagesTotal }} .caption.grey--text {{ info.pagesTotal }}
v-list-item(to='/tags', v-if='hasPermission([`manage:system`])') v-list-item(to='/tags', v-if='hasPermission([`manage:system`])')
v-list-item-avatar(size='24', tile): v-icon mdi-tag-multiple v-list-item-avatar(size='24', tile): v-icon mdi-tag-multiple
v-list-item-title {{ $t('admin:tags.title') }} v-list-item-title {{ $t('admin:tags.title') }}
v-list-item-action(style='min-width:auto;') v-list-item-action(style='min-width:auto;')
v-chip(x-small, :color='darkMode ? `grey darken-3-d4` : `grey lighten-5`') v-chip(x-small, :color='$vuetify.theme.dark ? `grey darken-3-d4` : `grey lighten-5`')
.caption.grey--text {{ info.tagsTotal }} .caption.grey--text {{ info.tagsTotal }}
v-list-item(to='/theme', color='primary', v-if='hasPermission([`manage:system`, `manage:theme`])') v-list-item(to='/theme', color='primary', v-if='hasPermission([`manage:system`, `manage:theme`])')
v-list-item-avatar(size='24', tile): v-icon mdi-palette-outline v-list-item-avatar(size='24', tile): v-icon mdi-palette-outline
@ -45,13 +45,13 @@
v-list-item-avatar(size='24', tile): v-icon mdi-account-group v-list-item-avatar(size='24', tile): v-icon mdi-account-group
v-list-item-title {{ $t('admin:groups.title') }} v-list-item-title {{ $t('admin:groups.title') }}
v-list-item-action(style='min-width:auto;') v-list-item-action(style='min-width:auto;')
v-chip(x-small, :color='darkMode ? `grey darken-3-d4` : `grey lighten-4`') v-chip(x-small, :color='$vuetify.theme.dark ? `grey darken-3-d4` : `grey lighten-4`')
.caption.grey--text {{ info.groupsTotal }} .caption.grey--text {{ info.groupsTotal }}
v-list-item(to='/users', color='primary', v-if='hasPermission([`manage:system`, `manage:groups`, `write:groups`, `manage:users`, `write:users`])') v-list-item(to='/users', color='primary', v-if='hasPermission([`manage:system`, `manage:groups`, `write:groups`, `manage:users`, `write:users`])')
v-list-item-avatar(size='24', tile): v-icon mdi-account-box v-list-item-avatar(size='24', tile): v-icon mdi-account-box
v-list-item-title {{ $t('admin:users.title') }} v-list-item-title {{ $t('admin:users.title') }}
v-list-item-action(style='min-width:auto;') v-list-item-action(style='min-width:auto;')
v-chip(x-small, :color='darkMode ? `grey darken-3-d4` : `grey lighten-4`') v-chip(x-small, :color='$vuetify.theme.dark ? `grey darken-3-d4` : `grey lighten-4`')
.caption.grey--text {{ info.usersTotal }} .caption.grey--text {{ info.usersTotal }}
template(v-if='hasPermission(`manage:system`)') template(v-if='hasPermission(`manage:system`)')
v-divider.my-2 v-divider.my-2
@ -123,7 +123,7 @@
v-list-item-avatar(size='24', tile): v-icon mdi-heart-outline v-list-item-avatar(size='24', tile): v-icon mdi-heart-outline
v-list-item-title {{ $t('admin:contribute.title') }} v-list-item-title {{ $t('admin:contribute.title') }}
v-content(:class='darkMode ? "grey darken-5" : "grey lighten-5"') v-content(:class='$vuetify.theme.dark ? "grey darken-5" : "grey lighten-5"')
transition(name='admin-router') transition(name='admin-router')
router-view router-view
@ -210,7 +210,6 @@ export default {
} }
}, },
computed: { computed: {
darkMode: get('site/dark'),
info: sync('admin/info'), info: sync('admin/info'),
permissions: get('user/permissions') permissions: get('user/permissions')
}, },

@ -260,7 +260,7 @@
<script> <script>
import _ from 'lodash' import _ from 'lodash'
import { get, sync } from 'vuex-pathify' import { sync } from 'vuex-pathify'
import gql from 'graphql-tag' import gql from 'graphql-tag'
import editorStore from '../../store/editor' import editorStore from '../../store/editor'
@ -323,7 +323,6 @@ export default {
} }
}, },
computed: { computed: {
darkMode: get('site/dark'),
siteTitle: sync('site/title'), siteTitle: sync('site/title'),
logoUrl: sync('site/logoUrl'), logoUrl: sync('site/logoUrl'),
company: sync('site/company'), company: sync('site/company'),

@ -168,7 +168,7 @@
hide-details hide-details
) )
v-text-field.mt-4( v-text-field.mt-4(
v-if='current.targetType === `external`' v-if='current.targetType === `external` || current.targetType === `externalblank`'
outlined outlined
:label='$t("navigation.target")' :label='$t("navigation.target")'
prepend-icon='mdi-near-me' prepend-icon='mdi-near-me'
@ -302,6 +302,7 @@ export default {
navTypes () { navTypes () {
return [ return [
{ text: this.$t('navigation.navType.external'), value: 'external' }, { text: this.$t('navigation.navType.external'), value: 'external' },
{ text: this.$t('navigation.navType.externalblank'), value: 'externalblank' },
{ text: this.$t('navigation.navType.home'), value: 'home' }, { text: this.$t('navigation.navType.home'), value: 'home' },
{ text: this.$t('navigation.navType.page'), value: 'page' } { text: this.$t('navigation.navType.page'), value: 'page' }
// { text: this.$t('navigation.navType.searchQuery'), value: 'search' } // { text: this.$t('navigation.navType.searchQuery'), value: 'search' }

@ -51,7 +51,7 @@
v-list-item( v-list-item(
:key='rdr.key' :key='rdr.key'
@click='selectRenderer(rdr.key)' @click='selectRenderer(rdr.key)'
:class='currentRenderer.key === rdr.key ? (darkMode ? `grey darken-4-l4` : `blue lighten-5`) : ``' :class='currentRenderer.key === rdr.key ? ($vuetify.theme.dark ? `grey darken-4-l4` : `blue lighten-5`) : ``'
) )
v-list-item-avatar(size='24', tile) v-list-item-avatar(size='24', tile)
v-icon(:color='currentRenderer.key === rdr.key ? "primary" : "grey"') {{rdr.icon}} v-icon(:color='currentRenderer.key === rdr.key ? "primary" : "grey"') {{rdr.icon}}
@ -126,7 +126,6 @@
<script> <script>
import _ from 'lodash' import _ from 'lodash'
import { DepGraph } from 'dependency-graph' import { DepGraph } from 'dependency-graph'
import { get } from 'vuex-pathify'
import { StatusIndicator } from 'vue-status-indicator' import { StatusIndicator } from 'vue-status-indicator'
@ -144,9 +143,6 @@ export default {
currentRenderer: {} currentRenderer: {}
} }
}, },
computed: {
darkMode: get('site/dark')
},
watch: { watch: {
renderers(newValue, oldValue) { renderers(newValue, oldValue) {
_.delay(() => { _.delay(() => {

@ -41,7 +41,7 @@
:hint='$t(`editor:props.shortDescriptionHint`)' :hint='$t(`editor:props.shortDescriptionHint`)'
) )
v-divider v-divider
v-card-text.grey.pt-5(:class='darkMode ? `darken-3-d3` : `lighten-5`') v-card-text.grey.pt-5(:class='$vuetify.theme.dark ? `darken-3-d3` : `lighten-5`')
.overline.pb-5 {{$t('editor:props.path')}} .overline.pb-5 {{$t('editor:props.path')}}
v-container.pa-0(fluid, grid-list-lg) v-container.pa-0(fluid, grid-list-lg)
v-layout(row, wrap) v-layout(row, wrap)
@ -65,7 +65,7 @@
@click:append='showPathSelector' @click:append='showPathSelector'
) )
v-divider v-divider
v-card-text.grey.pt-5(:class='darkMode ? `darken-3-d5` : `lighten-4`') v-card-text.grey.pt-5(:class='$vuetify.theme.dark ? `darken-3-d5` : `lighten-4`')
.overline.pb-5 {{$t('editor:props.categorization')}} .overline.pb-5 {{$t('editor:props.categorization')}}
v-chip-group.radius-5.mb-5(column, v-if='tags && tags.length > 0') v-chip-group.radius-5.mb-5(column, v-if='tags && tags.length > 0')
v-chip( v-chip(
@ -101,7 +101,7 @@
inset inset
) )
v-divider v-divider
v-card-text.grey.pt-5(:class='darkMode ? `darken-3-d3` : `lighten-5`') v-card-text.grey.pt-5(:class='$vuetify.theme.dark ? `darken-3-d3` : `lighten-5`')
v-container.pa-0(fluid, grid-list-lg) v-container.pa-0(fluid, grid-list-lg)
v-row v-row
v-col(cols='6') v-col(cols='6')
@ -197,7 +197,7 @@
persistent-hint persistent-hint
) )
v-divider v-divider
v-card-text.grey.pt-5(:class='darkMode ? `darken-3-d3` : `lighten-5`') v-card-text.grey.pt-5(:class='$vuetify.theme.dark ? `darken-3-d3` : `lighten-5`')
.overline.pb-3 {{$t('editor:props.css')}} .overline.pb-3 {{$t('editor:props.css')}}
v-textarea( v-textarea(
outlined outlined
@ -279,7 +279,6 @@ export default {
get() { return this.value }, get() { return this.value },
set(val) { this.$emit('input', val) } set(val) { this.$emit('input', val) }
}, },
darkMode: get('site/dark'),
mode: get('editor/mode'), mode: get('editor/mode'),
title: sync('page/title'), title: sync('page/title'),
description: sync('page/description'), description: sync('page/description'),

@ -1,5 +1,5 @@
<template lang='pug'> <template lang='pug'>
v-app(:dark='darkMode').history v-app(:dark='$vuetify.theme.dark').history
nav-header nav-header
v-content v-content
v-toolbar(color='primary', dark) v-toolbar(color='primary', dark)
@ -15,8 +15,8 @@
v-chip.my-0.ml-6( v-chip.my-0.ml-6(
label label
small small
:color='darkMode ? `grey darken-2` : `grey lighten-2`' :color='$vuetify.theme.dark ? `grey darken-2` : `grey lighten-2`'
:class='darkMode ? `grey--text text--lighten-2` : `grey--text text--darken-2`' :class='$vuetify.theme.dark ? `grey--text text--lighten-2` : `grey--text text--darken-2`'
) )
span Live span Live
v-timeline( v-timeline(
@ -92,14 +92,14 @@
v-else v-else
label label
small small
:color='darkMode ? `grey darken-2` : `grey lighten-2`' :color='$vuetify.theme.dark ? `grey darken-2` : `grey lighten-2`'
:class='darkMode ? `grey--text text--lighten-2` : `grey--text text--darken-2`' :class='$vuetify.theme.dark ? `grey--text text--lighten-2` : `grey--text text--darken-2`'
) End of history trail ) End of history trail
v-flex(xs12, md8) v-flex(xs12, md8)
v-card.radius-7(:class='$vuetify.breakpoint.mdAndUp ? `mt-8` : ``') v-card.radius-7(:class='$vuetify.breakpoint.mdAndUp ? `mt-8` : ``')
v-card-text v-card-text
v-card.grey.radius-7(flat, :class='darkMode ? `darken-2` : `lighten-4`') v-card.grey.radius-7(flat, :class='$vuetify.theme.dark ? `darken-2` : `lighten-4`')
v-row(no-gutters, align='center') v-row(no-gutters, align='center')
v-col v-col
v-card-text v-card-text
@ -132,7 +132,6 @@
<script> <script>
import * as Diff2Html from 'diff2html' import * as Diff2Html from 'diff2html'
import { createPatch } from 'diff' import { createPatch } from 'diff'
import { get } from 'vuex-pathify'
import _ from 'lodash' import _ from 'lodash'
import gql from 'graphql-tag' import gql from 'graphql-tag'
@ -224,7 +223,6 @@ export default {
} }
}, },
computed: { computed: {
darkMode: get('site/dark'),
fullTrail () { fullTrail () {
const liveTrailItem = { const liveTrailItem = {
versionId: 0, versionId: 0,
@ -501,13 +499,13 @@ export default {
trailBgColor (actionType) { trailBgColor (actionType) {
switch (actionType) { switch (actionType) {
case 'move': case 'move':
return this.darkMode ? 'purple' : 'purple lighten-5' return this.$vuetify.theme.dark ? 'purple' : 'purple lighten-5'
case 'initial': case 'initial':
return this.darkMode ? 'teal darken-3' : 'teal lighten-5' return this.$vuetify.theme.dark ? 'teal darken-3' : 'teal lighten-5'
case 'live': case 'live':
return this.darkMode ? 'orange darken-3' : 'orange lighten-5' return this.$vuetify.theme.dark ? 'orange darken-3' : 'orange lighten-5'
default: default:
return this.darkMode ? 'grey darken-3' : 'grey lighten-4' return this.$vuetify.theme.dark ? 'grey darken-3' : 'grey lighten-4'
} }
} }
}, },

@ -1,5 +1,5 @@
<template lang='pug'> <template lang='pug'>
v-app(:dark='darkMode').profile v-app(:dark='$vuetify.theme.dark').profile
nav-header nav-header
v-navigation-drawer.pb-0(v-model='profileDrawerShown', app, fixed, clipped, left, permanent) v-navigation-drawer.pb-0(v-model='profileDrawerShown', app, fixed, clipped, left, permanent)
v-list(dense, nav) v-list(dense, nav)
@ -34,7 +34,7 @@
<script> <script>
import VueRouter from 'vue-router' import VueRouter from 'vue-router'
/* global WIKI, siteConfig */ /* global WIKI */
const router = new VueRouter({ const router = new VueRouter({
mode: 'history', mode: 'history',
@ -63,9 +63,6 @@ export default {
profileDrawerShown: true profileDrawerShown: true
} }
}, },
computed: {
darkMode() { return siteConfig.darkMode }
},
router, router,
created() { created() {
this.$store.commit('page/SET_MODE', 'profile') this.$store.commit('page/SET_MODE', 'profile')

@ -1,5 +1,5 @@
<template lang='pug'> <template lang='pug'>
v-app(:dark='darkMode').source v-app(:dark='$vuetify.theme.dark').source
nav-header nav-header
v-content v-content
v-toolbar(color='primary', dark) v-toolbar(color='primary', dark)
@ -17,7 +17,7 @@
v-btn.ml-4(depressed, color='blue darken-1', @click='goLive') {{$t('common:page.returnNormalView')}} v-btn.ml-4(depressed, color='blue darken-1', @click='goLive') {{$t('common:page.returnNormalView')}}
v-card(tile) v-card(tile)
v-card-text v-card-text
v-card.grey.radius-7(flat, :class='darkMode ? `darken-4` : `lighten-4`') v-card.grey.radius-7(flat, :class='$vuetify.theme.dark ? `darken-4` : `lighten-4`')
v-card-text v-card-text
pre pre
code code
@ -29,8 +29,6 @@
</template> </template>
<script> <script>
import { get } from 'vuex-pathify'
export default { export default {
props: { props: {
pageId: { pageId: {
@ -57,9 +55,6 @@ export default {
data() { data() {
return {} return {}
}, },
computed: {
darkMode: get('site/dark')
},
created () { created () {
this.$store.commit('page/SET_ID', this.id) this.$store.commit('page/SET_ID', this.id)
this.$store.commit('page/SET_LOCALE', this.locale) this.$store.commit('page/SET_LOCALE', this.locale)

@ -1,5 +1,5 @@
<template lang='pug'> <template lang='pug'>
v-app(:dark='darkMode').tags v-app(:dark='$vuetify.theme.dark').tags
nav-header nav-header
v-navigation-drawer.pb-0.elevation-1(app, fixed, clipped, :right='$vuetify.rtl', permanent, width='300') v-navigation-drawer.pb-0.elevation-1(app, fixed, clipped, :right='$vuetify.rtl', permanent, width='300')
vue-scroll(:ops='scrollStyle') vue-scroll(:ops='scrollStyle')
@ -151,7 +151,6 @@
</template> </template>
<script> <script>
import { get } from 'vuex-pathify'
import VueRouter from 'vue-router' import VueRouter from 'vue-router'
import _ from 'lodash' import _ from 'lodash'
@ -209,7 +208,6 @@ export default {
} }
}, },
computed: { computed: {
darkMode: get('site/dark'),
tagsGrouped () { tagsGrouped () {
return _.groupBy(this.tags, t => t.title.charAt(0).toUpperCase()) return _.groupBy(this.tags, t => t.title.charAt(0).toUpperCase())
}, },

@ -14,14 +14,16 @@
v-list.py-2(v-if='currentMode === `custom`', dense, :class='color', :dark='dark') v-list.py-2(v-if='currentMode === `custom`', dense, :class='color', :dark='dark')
template(v-for='item of items') template(v-for='item of items')
v-list-item( v-list-item(
v-if='item.kind === `link`' v-if='item.k === `link`'
:href='item.target' :href='item.t'
:target='item.y === `externalblank` ? `_blank` : `_self`'
:rel='item.y === `externalblank` ? `noopener` : ``'
) )
v-list-item-avatar(size='24', tile) v-list-item-avatar(size='24', tile)
v-icon {{ item.icon }} v-icon {{ item.c }}
v-list-item-title {{ item.label }} v-list-item-title {{ item.l }}
v-divider.my-2(v-else-if='item.kind === `divider`') v-divider.my-2(v-else-if='item.k === `divider`')
v-subheader.pl-4(v-else-if='item.kind === `header`') {{ item.label }} v-subheader.pl-4(v-else-if='item.k === `header`') {{ item.l }}
//-> Browse //-> Browse
v-list.py-2(v-else-if='currentMode === `browse`', dense, :class='color', :dark='dark') v-list.py-2(v-else-if='currentMode === `browse`', dense, :class='color', :dark='dark')
template(v-if='currentParent.id > 0') template(v-if='currentParent.id > 0')

@ -1,9 +1,9 @@
<template lang="pug"> <template lang="pug">
v-app(v-scroll='upBtnScroll', :dark='darkMode', :class='$vuetify.rtl ? `is-rtl` : `is-ltr`') v-app(v-scroll='upBtnScroll', :dark='$vuetify.theme.dark', :class='$vuetify.rtl ? `is-rtl` : `is-ltr`')
nav-header nav-header
v-navigation-drawer( v-navigation-drawer(
v-if='navMode !== `NONE`' v-if='navMode !== `NONE`'
:class='darkMode ? `grey darken-4-d4` : `primary`' :class='$vuetify.theme.dark ? `grey darken-4-d4` : `primary`'
dark dark
app app
clipped clipped
@ -13,7 +13,7 @@
:right='$vuetify.rtl' :right='$vuetify.rtl'
) )
vue-scroll(:ops='scrollStyle') vue-scroll(:ops='scrollStyle')
nav-sidebar(:color='darkMode ? `grey darken-4-d4` : `primary`', :items='sidebar', :nav-mode='navMode') nav-sidebar(:color='$vuetify.theme.dark ? `grey darken-4-d4` : `primary`', :items='sidebarDecoded', :nav-mode='navMode')
v-fab-transition(v-if='navMode !== `NONE`') v-fab-transition(v-if='navMode !== `NONE`')
v-btn( v-btn(
@ -32,7 +32,7 @@
v-content(ref='content') v-content(ref='content')
template(v-if='path !== `home`') template(v-if='path !== `home`')
v-toolbar(:color='darkMode ? `grey darken-4-d3` : `grey lighten-3`', flat, dense, v-if='$vuetify.breakpoint.smAndUp') v-toolbar(:color='$vuetify.theme.dark ? `grey darken-4-d3` : `grey lighten-3`', flat, dense, v-if='$vuetify.breakpoint.smAndUp')
//- v-btn.pl-0(v-if='$vuetify.breakpoint.xsOnly', flat, @click='toggleNavigation') //- v-btn.pl-0(v-if='$vuetify.breakpoint.xsOnly', flat, @click='toggleNavigation')
//- v-icon(color='grey darken-2', left) menu //- v-icon(color='grey darken-2', left) menu
//- span Navigation //- span Navigation
@ -48,19 +48,19 @@
.caption.red--text {{$t('common:page.unpublished')}} .caption.red--text {{$t('common:page.unpublished')}}
status-indicator.ml-3(negative, pulse) status-indicator.ml-3(negative, pulse)
v-divider v-divider
v-container.grey.pa-0(fluid, :class='darkMode ? `darken-4-l3` : `lighten-4`') v-container.grey.pa-0(fluid, :class='$vuetify.theme.dark ? `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.page-col-content.is-page-header(offset-xl='2', offset-lg='3', style='margin-top: auto; margin-bottom: auto;', :class='$vuetify.rtl ? `pr-4` : `pl-4`') v-col.page-col-content.is-page-header(offset-xl='2', offset-lg='3', style='margin-top: auto; margin-bottom: auto;', :class='$vuetify.rtl ? `pr-4` : `pl-4`')
.headline.grey--text(:class='darkMode ? `text--lighten-2` : `text--darken-3`') {{title}} .headline.grey--text(:class='$vuetify.theme.dark ? `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', align-self-start, style='margin-top: -90px; position: sticky; top: 70px;') v-flex.page-col-sd(lg3, xl2, v-if='$vuetify.breakpoint.lgAndUp', align-self-start, style='margin-top: -90px; position: sticky; top: 70px;')
v-card.mb-5(v-if='toc.length') v-card.mb-5(v-if='tocDecoded.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='$vuetify.theme.dark ? `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='$vuetify.theme.dark ? `darken-3-d3` : ``')
template(v-for='(tocItem, tocIdx) in toc') template(v-for='(tocItem, tocIdx) in tocDecoded')
v-list-item(@click='$vuetify.goTo(tocItem.anchor, scrollOpts)') v-list-item(@click='$vuetify.goTo(tocItem.anchor, scrollOpts)')
v-icon(color='grey', small) {{ $vuetify.rtl ? `mdi-chevron-left` : `mdi-chevron-right` }} v-icon(color='grey', small) {{ $vuetify.rtl ? `mdi-chevron-left` : `mdi-chevron-right` }}
v-list-item-title.px-3 {{tocItem.title}} v-list-item-title.px-3 {{tocItem.title}}
@ -68,7 +68,7 @@
template(v-for='tocSubItem in tocItem.children') template(v-for='tocSubItem in tocItem.children')
v-list-item(@click='$vuetify.goTo(tocSubItem.anchor, scrollOpts)') v-list-item(@click='$vuetify.goTo(tocSubItem.anchor, scrollOpts)')
v-icon.px-3(color='grey lighten-1', small) {{ $vuetify.rtl ? `mdi-chevron-left` : `mdi-chevron-right` }} v-icon.px-3(color='grey lighten-1', small) {{ $vuetify.rtl ? `mdi-chevron-left` : `mdi-chevron-right` }}
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='$vuetify.theme.dark ? `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.mb-5(v-if='tags.length > 0') v-card.mb-5(v-if='tags.length > 0')
@ -100,7 +100,7 @@
//- v-btn.btn-animate-edit(icon, :href='"/h/" + locale + "/" + path', v-on='on', x-small) //- v-btn.btn-animate-edit(icon, :href='"/h/" + locale + "/" + path', v-on='on', x-small)
//- v-icon(color='grey', dense) mdi-history //- v-icon(color='grey', dense) mdi-history
//- span History //- span History
.body-2.grey--text(:class='darkMode ? `` : `text--darken-3`') {{ authorName }} .body-2.grey--text(:class='$vuetify.theme.dark ? `` : `text--darken-3`') {{ authorName }}
.caption.grey--text.text--darken-1 {{ updatedAt | moment('calendar') }} .caption.grey--text.text--darken-1 {{ updatedAt | moment('calendar') }}
//- v-card.mb-5 //- v-card.mb-5
@ -117,7 +117,7 @@
//- .caption.grey--text 5 votes //- .caption.grey--text 5 votes
v-card(flat) v-card(flat)
v-toolbar(:color='darkMode ? `grey darken-4-d3` : `grey lighten-3`', flat, dense) v-toolbar(:color='$vuetify.theme.dark ? `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 }')
@ -346,12 +346,12 @@ export default {
default: false default: false
}, },
toc: { toc: {
type: Array, type: String,
default: () => [] default: ''
}, },
sidebar: { sidebar: {
type: Array, type: String,
default: () => [] default: ''
}, },
navMode: { navMode: {
type: String, type: String,
@ -391,7 +391,6 @@ export default {
} }
}, },
computed: { computed: {
darkMode: get('site/dark'),
isAuthenticated: get('user/authenticated'), isAuthenticated: get('user/authenticated'),
rating: { rating: {
get () { get () {
@ -417,6 +416,12 @@ export default {
} else { } else {
return this.$vuetify.rtl ? `right: 65px;` : `left: 65px;` return this.$vuetify.rtl ? `right: 65px;` : `left: 65px;`
} }
},
sidebarDecoded () {
return JSON.parse(atob(this.sidebar))
},
tocDecoded () {
return JSON.parse(atob(this.toc))
} }
}, },
created() { created() {

@ -226,9 +226,26 @@
blockquote { blockquote {
padding: 0 1rem 1rem 1rem; padding: 0 1rem 1rem 1rem;
border-left: 5px solid mc('blue', '500'); background-color: mc('blue-grey', '50');
border-left: 55px solid mc('blue-grey', '500');
border-radius: .5rem; border-radius: .5rem;
margin: 1rem 0; margin: 1rem 0;
position: relative;
@at-root .theme--dark & {
background-color: mc('blue-grey', '900');
}
&::before {
display: inline-block;
font: normal normal normal 24px/1 "Material Design Icons";
position: absolute;
margin-top: -12px;
top: 50%;
left: -38px;
color: rgba(255, 255, 255, .7);
content: "\F02FC";
}
> p:first-child .emoji { > p:first-child .emoji {
margin-right: .5rem; margin-right: .5rem;
@ -244,6 +261,10 @@
border-color: mc('blue', '300'); border-color: mc('blue', '300');
color: mc('blue', '900'); color: mc('blue', '900');
&::before {
content: "\F02FC";
}
code { code {
background-color: mc('blue', '50'); background-color: mc('blue', '50');
color: mc('blue', '800'); color: mc('blue', '800');
@ -260,6 +281,10 @@
border-color: mc('orange', '300'); border-color: mc('orange', '300');
color: darken(mc('orange', '900'), 10%); color: darken(mc('orange', '900'), 10%);
&::before {
content: "\F0026";
}
code { code {
background-color: mc('orange', '50'); background-color: mc('orange', '50');
color: mc('orange', '800'); color: mc('orange', '800');
@ -277,6 +302,10 @@
border-color: mc('red', '300'); border-color: mc('red', '300');
color: mc('red', '900'); color: mc('red', '900');
&::before {
content: "\F0159";
}
code { code {
background-color: mc('red', '50'); background-color: mc('red', '50');
color: mc('red', '800'); color: mc('red', '800');
@ -293,6 +322,10 @@
border-color: mc('green', '300'); border-color: mc('green', '300');
color: mc('green', '900'); color: mc('green', '900');
&::before {
content: "\F0E1E";
}
code { code {
background-color: mc('green', '50'); background-color: mc('green', '50');
color: mc('green', '800'); color: mc('green', '800');

@ -395,17 +395,28 @@ router.get('/*', async (req, res, next) => {
if (page) { if (page) {
_.set(res.locals, 'pageMeta.title', page.title) _.set(res.locals, 'pageMeta.title', page.title)
_.set(res.locals, 'pageMeta.description', page.description) _.set(res.locals, 'pageMeta.description', page.description)
const sidebar = await WIKI.models.navigation.getTree({ cache: true, locale: pageArgs.locale, groups: req.user.groups })
let sdi = 1
const sidebar = (await WIKI.models.navigation.getTree({ cache: true, locale: pageArgs.locale, groups: req.user.groups })).map(n => ({
i: `sdi-${sdi++}`,
k: n.kind,
l: n.label,
c: n.icon,
y: n.targetType,
t: n.target
}))
const injectCode = { const injectCode = {
css: WIKI.config.theming.injectCSS, css: WIKI.config.theming.injectCSS,
head: WIKI.config.theming.injectHead, head: WIKI.config.theming.injectHead,
body: WIKI.config.theming.injectBody body: WIKI.config.theming.injectBody
} }
if (!_.isString(page.toc)) {
page.toc = JSON.stringify(page.toc)
}
if (req.query.legacy || req.get('user-agent').indexOf('Trident') >= 0) { if (req.query.legacy || req.get('user-agent').indexOf('Trident') >= 0) {
if (_.isString(page.toc)) {
page.toc = JSON.parse(page.toc)
}
res.render('legacy/page', { page, sidebar, injectCode, isAuthenticated: req.user && req.user.id !== 2 }) res.render('legacy/page', { page, sidebar, injectCode, isAuthenticated: req.user && req.user.id !== 2 })
} else { } else {
res.render('page', { page, sidebar, injectCode }) res.render('page', { page, sidebar, injectCode })

@ -19,9 +19,9 @@ block body
author-name=page.authorName author-name=page.authorName
:author-id=page.authorId :author-id=page.authorId
:is-published=page.isPublished.toString() :is-published=page.isPublished.toString()
:toc=page.toc toc=Buffer.from(page.toc).toString('base64')
:page-id=page.id :page-id=page.id
:sidebar=sidebar sidebar=Buffer.from(JSON.stringify(sidebar)).toString('base64')
nav-mode=config.nav.mode nav-mode=config.nav.mode
) )
template(slot='contents') template(slot='contents')

Loading…
Cancel
Save