How to hide the chain icon on heading?

ooker777 commented 6 months ago

It's my surprise that I'm unable to google out the upstream gfm repo, so I don't know where to ask elsewhere. I don't want to have the chain icon on the anchor: If it's only show up when hovering it will be great. I can do css stuff but it's better to have it by default.

import { render } from "gfm";

export default function App() {
  const gfm = render("# hello");
  return (
    <div>
      <h1>Not gfm</h1>
      <div dangerouslySetInnerHTML={{ __html: gfm }} />
    </div>
  );
}

Mrashes commented 5 months ago

This can be accomplished by including the CSS. It adds the links on hover and makes it not static. Here is your example (in fresh) where we leverage a component and have it generate on hover:

import { Head } from "$fresh/runtime.ts";
import { CSS, render } from "jsr:@deno/gfm";

export function QuickTest() {
  const gfm = render("# hello");
  return (
    <>
        <Head>
            <style dangerouslySetInnerHTML={{ __html: CSS }} />
        </Head>
        <div>
            <h1>Not gfm</h1>
            <div class="markdown-body" dangerouslySetInnerHTML={{ __html: gfm }} />
        </div>
    </>
  );

Unsure who has the power to close issues but as this is resolved by the packages css, think this issue is closed

florianfmmartin commented 2 months ago

Please remove the icon, this lib is a translator from MD to HTML, it should not add any unnecessary classes and svgs.

denoland / deno-gfm

How to hide the chain icon on heading? #120