Danktuary / vuepress-theme-yuu

A VuePress 1.x theme that supports a dark theme, multiple color themes, and other useful features.
https://vuepress-theme-yuu.netlify.com/
MIT License
72 stars 7 forks source link

How to make a custom Home.vue #17

Closed Soitora closed 4 years ago

Soitora commented 4 years ago

I was wondering how to make a custom Home.vue since your theme doesn't seem to supply one? I've ended up with having all your theme files locally installed then expanding on the default one, I'd prefer if I could just expand on yours instead and only keep 1 overrided file.

Danktuary commented 4 years ago

Hey! I suppose you're right, there currently is no way to do so. I did a quick test to see if you could just extend Yuu and only overwrite the theme/components/Home.vue file (which is taken from the @vuepress/theme-default theme), but it's not as simple as I hoped. Maybe providing another frontmatter option would suffice? i.e.:

<!-- docs/README.md -->
---
home: true
homeComponent: CustomHome
...
---
<!-- docs/.vuepress/components/CustomHome.vue -->
<template>
    <div class="homepage">
        Custom homepage.
    </div>
</template>

<style lang="stylus">
// These variables are available from the default theme
.homepage
    display: block
    max-width: $homePageWidth
    margin: 0 auto
    padding: $navbarHeight 2rem 0
</style>
Danktuary commented 4 years ago

I added this in v2.3.0 🎉 Thanks for the idea! You can use it as described above.