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

Feature request: container option for linkAfterHeader #110

Closed
JanDW opened this issue Mar 24, 2022 · 5 comments · Fixed by #111
Closed

Feature request: container option for linkAfterHeader #110

JanDW opened this issue Mar 24, 2022 · 5 comments · Fixed by #111

Comments

@JanDW
Copy link

JanDW commented Mar 24, 2022

Hi Val,

I noticed that to add a container around the outputted HTML when usinglinkAfterHeader I'd need to implement my own render function. Would it make sense to provide an option for passing in a container?

Best,

Jan

@valeriangalliat
Copy link
Owner

Hey! Seems like a common demand for linkAfterHeader to include a wrapper in the output, @nhoizey also wanted to do this in #100. I came up with a proposal solution in #111, it looks like this:

const anchor = require('markdown-it-anchor')
const md = require('markdown-it')()

md.use(anchor, {
  permalink: anchor.permalink.linkAfterHeader({
    style: 'visually-hidden',
    assistiveText: title => `Permalink to “${title}”`,
    visuallyHiddenClass: 'visually-hidden'
    visuallyHiddenClass: 'visually-hidden',
    wrapper: ['<div class="wrapper">', '</div>']
  })
})
<div class="wrapper">
  <h2 id="title">Title</h2>
  <a class="header-anchor" href="#title">
    <span class="visually-hidden">Permalink to “Title”</span>
    <span aria-hidden="true">#</span>
  </a>
</div>

Does this looks like a reasonable API?

Cheers!

@JanDW
Copy link
Author

JanDW commented Apr 2, 2022

There are more of us. :)

Does this looks like a reasonable API?

Yes, that was exactly what I was hoping for—thanks!

@valeriangalliat
Copy link
Owner

Awesome, published with v8.5.0! Thank you for the Ko-fi ❤️

@JanDW
Copy link
Author

JanDW commented Apr 5, 2022

Thank you! 🏅

@nhoizey
Copy link

nhoizey commented May 20, 2022

I'm late using this, but it rocks! Thanks @valeriangalliat

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

Successfully merging a pull request may close this issue.

3 participants