mirror of https://github.com/Requarks/wiki.git
Browse Source
feat: Configurable ToC Heading Levels (#5101)
feat: Configurable ToC Heading Levels (#5101)
Co-authored-by: Regev Brody <regevbr@gmail.com>feat-toc
Timo Kruth
2 years ago
committed by
NGPixel
NGPixel
No known key found for this signature in database
GPG Key ID: 8FDA2F1757F60D63
22 changed files with 355 additions and 29 deletions
Split View
Diff Options
-
30client/components/admin/admin-theme.vue
-
56client/components/editor.vue
-
41client/components/editor/editor-modal-properties.vue
-
4client/graph/admin/theme/theme-mutation-save.gql
-
3client/graph/admin/theme/theme-query-config.gql
-
4client/store/page.js
-
81client/themes/default/components/page-toc-item.vue
-
34client/themes/default/components/page.vue
-
2dev/containers/Dockerfile
-
4server/app/data.yml
-
21server/controllers/common.js
-
11server/db/migrations-sqlite/2.5.13.js
-
11server/db/migrations/2.5.13.js
-
6server/graph/resolvers/theming.js
-
12server/graph/schemas/page.graphql
-
6server/graph/schemas/theming.graphql
-
12server/helpers/page.js
-
25server/models/pages.js
-
9server/modules/storage/disk/common.js
-
4server/setup.js
-
4server/views/editor.pug
-
4server/views/page.pug
@ -0,0 +1,81 @@ |
|||
<template lang="pug"> |
|||
div |
|||
template(v-if='level >= minTocLevel') |
|||
v-list-item(@click='click(item.anchor)', v-if='(item.children.length === 0 && tocCollapseLevel > level) || tocCollapseLevel > level', |
|||
:key='item.anchor', :class='isNestedLevel ? `pl-9` : `pl-6`') |
|||
v-icon.pl-0(small, color='grey lighten-1') {{ $vuetify.rtl ? `mdi-chevron-left` : `mdi-chevron-right` }} |
|||
v-list-item-title.pl-4(v-bind:class='titleClasses') {{item.title}} |
|||
v-list-group(sub-group, v-else, v-bind:class='{"pl-3": isNestedLevel}') |
|||
template(v-slot:activator) |
|||
v-list-item.pl-0(@click='click(item.anchor)', :key='item.anchor') |
|||
v-list-item-title(v-bind:class='titleClasses') {{item.title}} |
|||
template(v-if='item.children.length !== 0', v-for='subItem in item.children') |
|||
page-toc-item(:item='subItem', :level='level + 1', :tocLevel='tocLevel', :minTocLevel='minTocLevel', :tocCollapseLevel='tocCollapseLevel') |
|||
template(v-if='tocCollapseLevel > level', v-for='subItem in item.children') |
|||
page-toc-item(:item='subItem', :level='level + 1', :tocLevel='tocLevel', :minTocLevel='minTocLevel', :tocCollapseLevel='tocCollapseLevel') |
|||
template(v-else, v-for='subItem in item.children') |
|||
page-toc-item(:item='subItem', :level='level + 1', :tocLevel='tocLevel', :minTocLevel='minTocLevel', :tocCollapseLevel='tocCollapseLevel') |
|||
</template> |
|||
|
|||
<script> |
|||
|
|||
export default { |
|||
name: 'PageTocItem', |
|||
props: { |
|||
item: { |
|||
type: Object, |
|||
default: () => {} |
|||
}, |
|||
minTocLevel: { |
|||
type: Number, |
|||
default: 0 |
|||
}, |
|||
tocLevel: { |
|||
type: Number, |
|||
default: 2 |
|||
}, |
|||
tocCollapseLevel: { |
|||
type: Number, |
|||
default: 2 |
|||
}, |
|||
level: { |
|||
type: Number, |
|||
default: 1 |
|||
} |
|||
}, |
|||
data() { |
|||
return { |
|||
scrollOpts: { |
|||
duration: 1500, |
|||
offset: 0, |
|||
easing: 'easeInOutCubic' |
|||
} |
|||
} |
|||
}, |
|||
computed: { |
|||
isNestedLevel() { |
|||
return this.level > this.minTocLevel |
|||
}, |
|||
titleClasses() { |
|||
return { |
|||
'caption': this.isNestedLevel, |
|||
'grey--text': this.isNestedLevel, |
|||
'text--lighten-1': this.$vuetify.theme.dark && this.isNestedLevel, |
|||
'text--darken-1': !this.$vuetify.theme.dark && this.isNestedLevel |
|||
} |
|||
} |
|||
}, |
|||
methods: { |
|||
click (anchor) { |
|||
this.$vuetify.goTo(anchor, this.scrollOpts) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang='scss'> |
|||
// Hack to fix animations of multi level nesting v-list-group |
|||
.v-list-group--sub-group.v-list-group--active .v-list-item:not(.v-list-item--active) .v-list-item__icon.v-list-group__header__prepend-icon .v-icon { |
|||
transform: rotate(0deg)!important; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,11 @@ |
|||
exports.up = async knex => { |
|||
await knex.schema |
|||
.alterTable('pages', table => { |
|||
table.integer('minTocLevel').notNullable().defaultTo(0) |
|||
table.integer('tocLevel').notNullable().defaultTo(0) |
|||
table.integer('tocCollapseLevel').notNullable().defaultTo(0) |
|||
table.boolean('doUseTocDefault').notNullable().defaultTo(true) |
|||
}) |
|||
} |
|||
|
|||
exports.down = knex => { } |
|||
@ -0,0 +1,11 @@ |
|||
exports.up = async knex => { |
|||
await knex.schema |
|||
.alterTable('pages', table => { |
|||
table.integer('minTocLevel').notNullable().defaultTo(0) |
|||
table.integer('tocLevel').notNullable().defaultTo(0) |
|||
table.integer('tocCollapseLevel').notNullable().defaultTo(0) |
|||
table.boolean('doUseTocDefault').notNullable().defaultTo(true) |
|||
}) |
|||
} |
|||
|
|||
exports.down = knex => { } |
|||
Write
Preview
Loading…
Cancel
Save