mirror of
https://iceshrimp.dev/Crimekillz/jointrashposs.git
synced 2024-11-24 17:59:07 +01:00
48 lines
1.9 KiB
Vue
48 lines
1.9 KiB
Vue
<template>
|
|
<div class="flex flex-col lg:flex-row justify-between items-center">
|
|
<div class="order-2 mt-4 lg:mt-0 lg:order-1 w-full lg:w-2/5">
|
|
<GNuxtLink v-if="prev && (ignoreDirBasedNav || prev._path.includes(currentDirectory))" :to="prev._path" class="rounded-lg transition-colors p-4 border dark:border-slate-800 hover:bg-slate-200 dark:hover:bg-slate-800 text-start flex justify-start items-center">
|
|
<div class="mr-3"><LeftIco /></div>
|
|
<div>
|
|
<div class="mb-1 text-sm">{{ $t('_docs._prevNext.prev') }}</div>
|
|
<div class="font-bold text-lg">{{ prev.title }}</div>
|
|
</div>
|
|
</GNuxtLink>
|
|
</div>
|
|
<div class="order-1 lg:order-2 w-full lg:w-2/5">
|
|
<GNuxtLink v-if="next && (ignoreDirBasedNav || next._path.includes(currentDirectory))" :to="next._path" class="rounded-lg transition-colors p-4 border dark:border-slate-800 hover:bg-slate-200 dark:hover:bg-slate-800 text-end flex justify-end items-center">
|
|
<div>
|
|
<div class="mb-1 text-sm">{{ $t('_docs._prevNext.next') }}</div>
|
|
<div class="font-bold text-lg">{{ next.title }}</div>
|
|
</div>
|
|
<div class="ml-3"><RightIco /></div>
|
|
</GNuxtLink>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import LeftIco from 'bi/arrow-left.svg';
|
|
import RightIco from 'bi/arrow-right.svg';
|
|
|
|
const { locale } = useI18n();
|
|
const route = useRoute();
|
|
const slugs = (route.params.slug as string[]).filter((v) => v !== '');
|
|
|
|
const props = withDefaults(defineProps<{
|
|
ignoreDirBasedNav?: boolean;
|
|
isDir?: boolean;
|
|
}>(), {
|
|
ignoreDirBasedNav: false,
|
|
isDir: false
|
|
});
|
|
|
|
const currentPath = `/${locale.value}/docs/${slugs.join('/')}`;
|
|
const currentDirectory = props.isDir ? `/${locale.value}/docs/${slugs.join('/')}` : `/${locale.value}/docs/${slugs.slice(0, -1).join('/')}`;
|
|
|
|
const [prev, next] = await queryContent().only(['_path', 'title']).where({ _path: { $contains: 'docs' }, _partial: false }).findSurround(currentPath);
|
|
</script>
|
|
|
|
<style scoped>
|
|
|
|
</style> |