From 8221be38e394838c7476555955be29cab751d699 Mon Sep 17 00:00:00 2001
From: Stephen Tse <Stephen-X@users.noreply.github.com>
Date: Sat, 5 Oct 2024 14:16:52 -0700
Subject: [PATCH] Fixed style issues to resolve build failure

---
 package-lock.json                          |  2 ++
 quartz/plugins/transformers/figcaptions.ts | 18 ++++++------
 quartz/plugins/transformers/index.ts       |  2 +-
 quartz/plugins/transformers/lightbox.ts    | 33 +++++++++++-----------
 quartz/styles/base.scss                    |  8 +++---
 5 files changed, 32 insertions(+), 31 deletions(-)

diff --git a/package-lock.json b/package-lock.json
index fb0dca1ce..eb48826d3 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -209,6 +209,7 @@
     },
     "node_modules/@clack/prompts/node_modules/is-unicode-supported": {
       "version": "1.3.0",
+      "extraneous": true,
       "inBundle": true,
       "license": "MIT",
       "engines": {
@@ -4924,6 +4925,7 @@
       "resolved": "https://registry.npmjs.org/prettier/-/prettier-3.3.3.tgz",
       "integrity": "sha512-i2tDNA0O5IrMO757lfrdQZCc2jPNDVntV0m/+4whiDfWaTKfMNgR7Qz0NAeGz/nRqF4m5/6CLzbP4/liHt12Ew==",
       "dev": true,
+      "license": "MIT",
       "bin": {
         "prettier": "bin/prettier.cjs"
       },
diff --git a/quartz/plugins/transformers/figcaptions.ts b/quartz/plugins/transformers/figcaptions.ts
index 6d10e8e41..9d90f7cfe 100644
--- a/quartz/plugins/transformers/figcaptions.ts
+++ b/quartz/plugins/transformers/figcaptions.ts
@@ -1,11 +1,11 @@
-import rehypeImageCaption from "rehype-image-caption";
-import { QuartzTransformerPlugin } from "../types";
+import rehypeImageCaption from "rehype-image-caption"
+import { QuartzTransformerPlugin } from "../types"
 
 export const FigureCaptions: QuartzTransformerPlugin = () => {
-    return {
-        name: "FigureCaptions",
-        htmlPlugins() {
-            return [[rehypeImageCaption]]
-        },
-    }
-}
\ No newline at end of file
+  return {
+    name: "FigureCaptions",
+    htmlPlugins() {
+      return [[rehypeImageCaption]]
+    },
+  }
+}
diff --git a/quartz/plugins/transformers/index.ts b/quartz/plugins/transformers/index.ts
index e3db3d1f3..c334f9923 100644
--- a/quartz/plugins/transformers/index.ts
+++ b/quartz/plugins/transformers/index.ts
@@ -12,4 +12,4 @@ export { TableOfContents } from "./toc"
 export { HardLineBreaks } from "./linebreaks"
 export { RoamFlavoredMarkdown } from "./roam"
 export { FigureCaptions } from "./figcaptions"
-export { Lightbox } from "./lightbox"
\ No newline at end of file
+export { Lightbox } from "./lightbox"
diff --git a/quartz/plugins/transformers/lightbox.ts b/quartz/plugins/transformers/lightbox.ts
index 0ec1aa6d6..d4550a85b 100644
--- a/quartz/plugins/transformers/lightbox.ts
+++ b/quartz/plugins/transformers/lightbox.ts
@@ -6,11 +6,11 @@ import { Root } from "hast"
 // https://github.com/biati-digital/glightbox
 interface Options {
   /** Name of the effect on lightbox open. */
-  openEffect: "zoom" | "fade" | "none",
+  openEffect: "zoom" | "fade" | "none"
   /** Name of the effect on lightbox close. */
-  closeEffect: "zoom" | "fade" | "none",
+  closeEffect: "zoom" | "fade" | "none"
   /** Name of the effect on slide change. */
-  slideEffect: "slide" | "zoom" | "fade" | "none",
+  slideEffect: "slide" | "zoom" | "fade" | "none"
   /** Show or hide the close button. */
   closeButton: boolean
 }
@@ -19,7 +19,7 @@ const defaultOptions: Options = {
   openEffect: "zoom",
   closeEffect: "zoom",
   slideEffect: "slide",
-  closeButton: false
+  closeButton: false,
 }
 
 export const Lightbox: QuartzTransformerPlugin<Partial<Options>> = (userOpts) => {
@@ -31,26 +31,25 @@ export const Lightbox: QuartzTransformerPlugin<Partial<Options>> = (userOpts) =>
         () => {
           return (tree: Root, file) => {
             visit(tree, "element", (node, _index, _parent) => {
-              if (node.tagName === "img" &&
+              if (
+                node.tagName === "img" &&
                 node.properties &&
                 typeof node.properties.src === "string"
               ) {
                 // Add Image Lightbox support
-                const classes = (node.properties.className ?? []) as string[];
-                classes.push("glightbox");
+                const classes = (node.properties.className ?? []) as string[]
+                classes.push("glightbox")
 
-                node.properties.className = classes;
+                node.properties.className = classes
               }
             })
           }
-        }
+        },
       ]
     },
     externalResources() {
       return {
-        css: [
-          "https://cdnjs.cloudflare.com/ajax/libs/glightbox/3.3.0/css/glightbox.min.css"
-        ],
+        css: ["https://cdnjs.cloudflare.com/ajax/libs/glightbox/3.3.0/css/glightbox.min.css"],
         js: [
           {
             src: "https://cdnjs.cloudflare.com/ajax/libs/glightbox/3.3.0/js/glightbox.min.js",
@@ -60,10 +59,10 @@ export const Lightbox: QuartzTransformerPlugin<Partial<Options>> = (userOpts) =>
           {
             contentType: "inline",
             loadTime: "afterDOMReady",
-            script: `const lightbox = GLightbox(${JSON.stringify(opts)});`
-          }
-        ]
+            script: `const lightbox = GLightbox(${JSON.stringify(opts)});`,
+          },
+        ],
       }
-    }
+    },
   }
-}
\ No newline at end of file
+}
diff --git a/quartz/styles/base.scss b/quartz/styles/base.scss
index 12abf37c4..8a5c2cae9 100644
--- a/quartz/styles/base.scss
+++ b/quartz/styles/base.scss
@@ -600,10 +600,10 @@ figure {
 
 figcaption {
   text-align: center;
-  margin-top: .25rem;
-  font-size: .85rem;
+  margin-top: 0.25rem;
+  font-size: 0.85rem;
   line-height: 1.3rem;
-  opacity: .8;
+  opacity: 0.8;
 }
 
-// ====================================
\ No newline at end of file
+// ====================================