brc-dd
commented
1 year ago Yeah we have one on the content part (along side .vp-doc), was thinking to move it above to html or body. For now you can extend the default theme: https://vitepress.dev/guide/extending-default-theme to create a layout like this:
<script setup lang="ts">
import DefaultTheme from 'vitepress/theme'
import { useData } from 'vitepress'
const { frontmatter } = useData()
</script>
<template>
<div :class="frontmatter.pageClass">
<DefaultTheme.Layout />
<div>
</template>
Is your feature request related to a problem? Please describe.
The problem I'm having is targeting specific Markdown pages with CSS
Describe the solution you'd like
Like VuePress (v1 and v2), it has
pageClass, enabling very easy page targeting with CSS I couldn't find anything of this sort in VitePresshttps://v2.vuepress.vuejs.org/reference/default-theme/frontmatter.html#pageclass
Describe alternatives you've considered
Not really sure what alternative there is to a simple page class/id at the top (under/next to .dark?)
Additional context
I have a page about forks of the application, and each fork has their own theme color Right now I try to use import css on the markdown page, but that stays on page change, and on build it gets scrambled together
Validations