Skip to content

v4.0.0

Compare
Choose a tag to compare
@naiyerasif naiyerasif released this 16 Feb 19:43
· 10 commits to main since this release
  • Sheds some DOM elements The hint icons are no longer wrapped inside a div. Also, if there's only one paragraph in the callout body, the content of paragraph are unwrapped instead of being wrapped inside a redundant paragraph element (reverted in v4.1.0). This is where things might break for you; you might have to tweak your styles to fix them.

  • New themes and ready to use aliases for GitHub and VitePress lookalike callouts. Remix your own if things don't look fancy enough for your taste. Themes and configurations are now properly exposed through package.json so you can directly import them.

    For example, you can import GitHub configuration as follows.

    import githubCalloutOptions from "@microflash/remark-callout-directives/config/github";
    
    unified().use(remarkParse).use(remarkDirective)
      .use(remarkCalloutDirectives, githubCalloutOptions)
      .use(remarkRehype, { allowDangerousHtml: true })
      .use(rehypeStringify, { allowDangerousHtml: true })
      .process(await read("example.md"));

    All themes now support light and dark color schemes (through prefers-color-scheme).

    Also, this version gets rid of Infima theme; the plugin gives you enough flexibility to recreate it (check out the GitHub theme as the starting point).

  • Accessibility improvements The hint icons are now marked as decorative through aria-hidden=true. I'm not a screen reader user, so please do let me know if you feel papercuts because of this plugin. I'd be exceedingly happy to improve things.