I’ve got a half-baked solution to styling an internal link as inline code. In Settings, go to Appearance > CSS snippets > Open snippets folder and add a file named code-link.css (or whatever you want) then paste the following contents:
.cm-formatting-code.cm-hmd-internal-link:has(
+ .cm-hmd-internal-link + .cm-formatting-code.cm-hmd-internal-link
) {
border-start-start-radius: var(--code-radius);
border-start-end-radius: 0;
border-end-start-radius: var(--code-radius);
border-end-end-radius: 0;
}
.cm-formatting-code.cm-hmd-internal-link
+ .cm-hmd-internal-link:has(+ .cm-formatting-code.cm-hmd-internal-link) {
font-family: var(--font-monospace);
font-size: var(--code-size);
background-color: var(--code-background);
padding: 0.1em 0;
border-radius: 0;
vertical-align: baseline;
-webkit-box-decoration-break: clone;
}
.cm-formatting-code.cm-hmd-internal-link
+ .cm-hmd-internal-link
+ .cm-formatting-code.cm-hmd-internal-link {
border-start-start-radius: 0;
border-start-end-radius: var(--code-radius);
border-end-start-radius: 0;
border-end-end-radius: var(--code-radius);
}
Make sure to hit Reload snippets and toggle it on.
It doesn’t work for certain links, it doesn’t hide the backticks, it doesn’t add spellcheck="false" to disable spellcheck, and it doesn’t work in Reading view. Here’s what it looks like:
Versus before:
(Edit: nesting :has() doesn’t work)