161sh/jointrashposs
1
0
Fork 0
mirror of https://iceshrimp.dev/Crimekillz/jointrashposs.git synced 2024-11-25 10:19:07 +01:00
Code Issues Projects Releases Packages Wiki Activity

(add) docs: TocLinks for smartphone

Browse source
This commit is contained in:
kakkokari-gtyih 2023-07-15 17:48:12 +09:00
parent 9ed746f7f0
commit 3e5ceacdd7
2 changed files with 12 additions and 3 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

4
components/docs/TocLinks.vue
View file

@ -7,7 +7,7 @@
>
<a
:href="`#${link.id}`"
@click.prevent="scrollToHeading(link.id)"
@click.prevent="emit('child-click'); scrollToHeading(link.id);"
:class="['hover:text-accent-600', activeHeadings.includes(link.id) ? 'font-bold text-accent-600' : '']"
>
{{ link.text }}
@ -33,7 +33,7 @@ const props = defineProps({
}
});
const emit = defineEmits(['move'])
const emit = defineEmits(['move', 'child-click']);
const { activeHeadings, updateHeadings } = useScrollspy();

11
pages/docs/[...slug].vue
View file

@ -1,11 +1,19 @@
<template>
<div class="relative container mx-auto max-w-screen-xl p-6 lg:py-0 grid docs-root pb-12">
<div class="lg:hidden sticky top-16 -mx-6 -mt-6 bg-white px-6 bg-opacity-60 backdrop-blur-lg z-[9890] border-b text-sm">
<details :open="openState">
<summary class="py-4 cursor-pointer">{{ $t('_docs._toc.title') }}</summary>
<div class="pb-4 overflow-y-auto">
<DocsTocLinks :links="data?.body.toc.links" @child-click="openState = false" />
</div>
</details>
</div>
<div class="hidden lg:block">
<div class="sticky top-16 h-[calc(100vh-4rem)] overflow-y-scroll border-r border-slate-200 dark:border-slate-700 py-6 pr-6">
<DocsAsideTree :links="navigation" />
</div>
</div>
<div class="lg:p-6 w-full overflow-x-hidden">
<div class="pt-6 lg:p-6 w-full overflow-x-hidden">
<ContentRenderer :value="data" class="markdown-body w-full mb-6">
</ContentRenderer>
<DocsPrevNext :ignore-dir-based-nav="data?.ignoreDirBasedNav ?? false" />
@ -23,6 +31,7 @@
import { LocaleObject } from '@nuxtjs/i18n/dist/runtime/composables';
const { locale, locales } = useI18n();
const openState = ref<boolean>(false);
definePageMeta({
layout: 'docs',