1
0
Fork 0
mirror of https://github.com/em-squared/5e-drs.git synced 2025-10-29 20:54:19 +00:00
5e-drs/docs/.vuepress/theme/components/Breadcrumb.vue
2021-02-15 12:17:44 +01:00

83 lines
3.2 KiB
Vue

<template>
<div class="d-print-none">
<v-breadcrumbs v-if="$route.path != '/'" :items="bread">
<template v-slot:item="{ item }">
<v-breadcrumbs-item :to="item.to" :exact="true" :disabled="item.disabled">
<template v-if="item.to == '/'">
<span class="icon-bookmark breadcrumb-logo"></span>
</template>
<template v-else>
{{ item.text }}
</template>
</v-breadcrumbs-item>
</template>
</v-breadcrumbs>
<v-row v-else justify="center">
<span class="icon-bookmark home-logo"></span>
</v-row>
</div>
</template>
<script>
export default {
name: "Breadcrumb",
computed: {
bread() {
const parts = this.$page.path.split("/");
if (!parts[parts.length - 1].length) { parts.pop() }
let link = ""
const crumbs = []
for (let i = 0; i < parts.length; i++) {
let disabled = false
if (i == parts.length - 1) {
disabled = true
}
link += parts[i]
const page = this.$site.pages.find((el) => el.path === link || el.path === link + "/")
link += "/"
if (page != null) {
if (page.path == '/grimoire/') {
crumbs.push({to: page.path, disabled: disabled, text: 'Grimoire'})
} else if (page.path == '/classes/') {
crumbs.push({to: page.path, disabled: disabled, text: 'Classes'})
} else if (page.path == '/bestiaire/') {
crumbs.push({to: page.path, disabled: disabled, text: 'Bestiaire'})
} else if (page.path == '/liste-objets-magiques/') {
crumbs.push({to: page.path, disabled: disabled, text: 'Liste des objets magiques'})
} else if (page.path == '/mon-grimoire/') {
crumbs.push({to: page.path, disabled: disabled, text: 'Mon grimoire'})
} else if (page.path == '/mon-bestiaire/') {
crumbs.push({to: page.path, disabled: disabled, text: 'Mon bestiaire'})
} else if (page.path == '/mes-objets-magiques/') {
crumbs.push({to: page.path, disabled: disabled, text: 'Mes objets magiques'})
} else if (page.path == '/creation-de-sort/') {
crumbs.push({to: page.path, disabled: disabled, text: 'Création de sort'})
} else if (page.path == '/creation-de-monstre-pnj/') {
crumbs.push({to: page.path, disabled: disabled, text: 'Création de monstre ou PNJ'})
} else if (page.path == '/calculateur-de-caracteristiques/') {
crumbs.push({to: page.path, disabled: disabled, text: 'Calculateur de caractéristiques'})
} else if (page.path == '/calculateur-de-rencontres/') {
crumbs.push({to: page.path, disabled: disabled, text: 'Calculateur de rencontres'})
} else {
crumbs.push({to: page.path, disabled: disabled, text: page.frontmatter.breadcrumb || page.title})
}
}
}
return crumbs;
},
},
};
</script>
<style lang="scss">
@import '../styles/colors';
.v-breadcrumbs {
// background-color: lighten($color-gray, 50);
}
.theme--light.v-breadcrumbs .v-breadcrumbs__item--disabled {
// color: rgba(0,0,0,.87);
}
</style>