content icon indicating copy to clipboard operation
content copied to clipboard

Default Prose Headings components should not render as links (bad HTML and too opinionated)

Open ManasMadrecha opened this issue 3 years ago • 2 comments

Is your feature request related to a problem? Please describe

As you can see here main/src/runtime/components/Prose/ProseH3.vue, H2 to H6 headings become links.

  • It's not good to have such opiniated structure for something so basic like Heading HTML elements.

  • The V1 option was better, i.e., having hidden # on left side of heading which shows on hover, instead of converting entire heading text into a.

  • Also, it's not good HTML too, because such a link is inline. And a link cannot have certain descendants. But currently, the component accepts any slot, so any random HTML element will be descendant of a.

  • Also, it makes it harder to select the Text of the Heading.

Describe the solution you'd like

Just add simple slot like https://github.com/nuxt/content/blob/main/src/runtime/components/Prose/ProseH1.vue.
Nothing fancy.

For those who want links in their headings, they can add it using respective remark plugin (e.g., autolink-headings). That plugin gives way more options any way.

Describe alternatives you've considered

Create own Prose components for H2 to H6 headings. 👎🏻 Because it's like resetting something, whereas styling and how template should be --- such things any way should be left to the user, and not Module.

Additional context

Tailwind's Preflight philosophy. As a Module, have sensible defaults. Don't have such opiniated rigidity that user have to spend time resetting things anyway.

Simply make things behave more like you’d expect them to.

ManasMadrecha avatar Aug 12 '22 23:08 ManasMadrecha

  1. It's only h2 to h4
  2. You can just override the prose components' behavior as you like: #1248

I like that links are generated by default, but I also agree with your point, that it's overriding standard behavior and kind of restrictive sometimes, even though it's just a heading (that is not supposed to contain that much other elements).

Being able to define in the config if the heading-links are generated would be a great option.

nobkd avatar Aug 13 '22 01:08 nobkd

@nobkd

  • Yes, we can override it, but will have to do in every project. 😕
  • Also, need to create H2, H3, H4 such three separate .vue files every time.
  • And, most importantly, some words of Headings can at times be links. So, how will that work? Because currently, entire headings themselves are getting converted into links.

So, better to have such template of heading-links inside some theme of Content Module (e.g., Content-wind) and not inside the core Module itself.

ManasMadrecha avatar Aug 13 '22 01:08 ManasMadrecha