style: make internal link have less visual padding (closes #706)

Jacky Zhao

2024-01-18 af811d824fa526f5a8d48b7f4cfd718ade91385e

 quartz/plugins/transformers/ofm.ts

@@ -1,10 +1,10 @@
import { QuartzTransformerPlugin } from "../types"
import { Root, Html, BlockContent, DefinitionContent, Paragraph, Code } from "mdast"
import { Root, Html, Image, BlockContent, DefinitionContent, Paragraph, Code } from "mdast"
import { Element, Literal, Root as HtmlRoot } from "hast"
import { ReplaceFunction, findAndReplace as mdastFindReplace } from "mdast-util-find-and-replace"
import { slug as slugAnchor } from "github-slugger"
import rehypeRaw from "rehype-raw"
import { visit } from "unist-util-visit"
import { SKIP, visit } from "unist-util-visit"
import path from "path"
import { JSResource } from "../../util/resources"
// @ts-ignore
@@ -26,6 +26,7 @@
  parseBlockReferences: boolean
  enableInHtmlEmbed: boolean
  enableYouTubeEmbed: boolean
  enableVideoEmbed: boolean
}

const defaultOptions: Options = {
@@ -37,7 +38,8 @@
  parseTags: true,
  parseBlockReferences: true,
  enableInHtmlEmbed: false,
  enableYouTubeEmbed: false,
  enableYouTubeEmbed: true,
  enableVideoEmbed: true,
}

const icons = {
@@ -130,6 +132,7 @@
const tagRegex = new RegExp(/(?:^| )#((?:[-_\p{L}\p{Emoji}\d])+(?:\/[-_\p{L}\p{Emoji}\d]+)*)/, "gu")
const blockReferenceRegex = new RegExp(/\^([A-Za-z0-9]+)$/, "g")
const ytLinkRegex = /^.*(youtu.be\/|v\/|u\/\w\/|embed\/|watch\?v=|\&v=)([^#\&\?]*).*/
const videoExtensionRegex = new RegExp(/\.(mp4|webm|ogg|avi|mov|flv|wmv|mkv|mpg|mpeg|3gp|m4v)$/)

export const ObsidianFlavoredMarkdown: QuartzTransformerPlugin<Partial<Options> | undefined> = (
  userOpts,
@@ -346,11 +349,28 @@
              }
            })
          }

          mdastFindReplace(tree, replacements)
        }
      })

      if (opts.enableVideoEmbed) {
        plugins.push(() => {
          return (tree: Root, _file) => {
            visit(tree, "image", (node, index, parent) => {
              if (parent && index != undefined && videoExtensionRegex.test(node.url)) {
                const newNode: Html = {
                  type: "html",
                  value: `<video controls src="${node.url}"></video>`,
                }

                parent.children.splice(index, 1, newNode)
                return SKIP
              }
            })
          }
        })
      }

      if (opts.callouts) {
        plugins.push(() => {
          return (tree: Root, _file) => {
@@ -366,7 +386,7 @@
              }

              const text = firstChild.children[0].value
              const restChildren = firstChild.children.slice(1)
              const restOfTitle = firstChild.children.slice(1)
              const [firstLine, ...remainingLines] = text.split("\n")
              const remainingText = remainingLines.join("\n")

@@ -382,7 +402,10 @@
                  match.input.slice(calloutDirective.length).trim() || capitalize(calloutType)
                const titleNode: Paragraph = {
                  type: "paragraph",
                  children: [{ type: "text", value: titleContent + " " }, ...restChildren],
                  children:
                    restOfTitle.length === 0
                      ? [{ type: "text", value: titleContent + " " }]
                      : restOfTitle,
                }
                const title = mdastToHtml(titleNode)