fix: `cssclasses` was not applied on folder note (index) (#749)

Mara-Li

2024-01-29 16adbd30114bfcc1aaefa851a5a1786787f97a10

fix: `cssclasses` was not applied on folder note (index) (#749)

* docs: improve first-time git setup

* fix: cssClasses was not applied on index page

* refactor: remove vscode files

* fix: format

* fix: cssClasses should be applied on the entire div, not only the article

* feat: support cssClasses for tag-listing

---------

Co-authored-by: Jacky Zhao <j.zhao2k19@gmail.com>

 quartz/components/pages/FolderContent.tsx

@@ -33,7 +33,8 @@
      const isDirectChild = fileParts.length === folderParts.length + 1
      return prefixed && isDirectChild
    })

    const cssClasses: string[] = fileData.frontmatter?.cssclasses ?? []
    const classes = ["popover-hint", ...cssClasses].join(" ")
    const listProps = {
      ...props,
      allFiles: allPagesInFolder,
@@ -45,7 +46,7 @@
        : htmlToJsx(fileData.filePath!, tree)

    return (
      <div class="popover-hint">
      <div class={classes}>
        <article>
          <p>{content}</p>
        </article>

 quartz/components/pages/TagContent.tsx

@@ -26,7 +26,8 @@
    (tree as Root).children.length === 0
      ? fileData.description
      : htmlToJsx(fileData.filePath!, tree)

  const cssClasses: string[] = fileData.frontmatter?.cssclasses ?? []
  const classes = ["popover-hint", ...cssClasses].join(" ")
  if (tag === "/") {
    const tags = [
      ...new Set(
@@ -37,9 +38,8 @@
    for (const tag of tags) {
      tagItemMap.set(tag, allPagesWithTag(tag))
    }

    return (
      <div class="popover-hint">
      <div class={classes}>
        <article>
          <p>{content}</p>
        </article>
@@ -81,7 +81,7 @@
    }

    return (
      <div class="popover-hint">
      <div class={classes}>
        <article>{content}</article>
        <p>{pluralize(pages.length, "item")} with this tag.</p>
        <div>