Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

the H5 and H6 in toc don't have the depth information #1292

Closed
Benbinbin opened this issue Jun 27, 2022 · 1 comment · Fixed by #1296
Closed

the H5 and H6 in toc don't have the depth information #1292

Benbinbin opened this issue Jun 27, 2022 · 1 comment · Fixed by #1296
Labels
enhancement New feature or request

Comments

@Benbinbin
Copy link
Contributor

Benbinbin commented Jun 27, 2022

Is your feature request related to a problem? Please describe

I can get the more depth heading by setting the nuxt.config.ts

export default defineNuxtConfig({
  content: {
    markdown: {
      toc: {
        depth: 5,
        searchDepth: 5
      }
    }
  }
})

but the toc for h5 and h6 not the same as h1~h4, they don't has the depth information

Snipaste_2022-06-27_19-52-12

Describe the solution you'd like

maybe I can tell the level of the H5 or H6 depend on their parent level,

Describe alternatives you've considered

but I think also add the depth field for H5 and H6 can be more convenience for developers.

Additional context

the ProseH1, ProseH5 and ProseH6 also different, they don't wrap the <NuxtLink> component, for example the ProseH5.vue is

<template>
  <h5><slot /></h5>
</template>

but the ProseH2 ~ ProseH4 components can provide an anchor link, for example the ProseH2.vue is

<template>
  <h2 :id="id">
    <NuxtLink :href="`#${id}`">
      <slot />
    </NuxtLink>
  </h2>
</template>

<script setup lang="ts">
defineProps<{ id: string }>()
</script>

Sometimes a long blog post has the H5 or H6 level heading, but it can't provide the anchor link like other headings to click and navigate, it maybe confuse readers.

Although I can custom the Prose components for H5 and H6, but I think wrapping the <NuxtLink> component inside all the Heading Prose components maybe better.

@Benbinbin Benbinbin added the enhancement New feature or request label Jun 27, 2022
@farnabaz
Copy link
Member

Hey @Benbinbin,
I agree that h5 and h6 should have depth fields in their nodes. But note that the depth field does not depend on the position of the header in the document. Depth of and h5 will be 5 no matter where it is placed.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
enhancement New feature or request
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants