feat: my custom config

quartz.config.ts

@@ -8,32 +8,34 @@ import * as Plugin from "./quartz/plugins"
  */
 const config: QuartzConfig = {
   configuration: {
-    pageTitle: "🪴 Quartz 4.0",
+    pageTitle: "🌲 rizaldy.club",
     enableSPA: true,
     enablePopovers: true,
     analytics: {
-      provider: "plausible",
+      provider: "umami",
+      host: "https://u.rizaldy.club",
+      websiteId: "638bda2c-2261-4b1f-bb55-c494d87bfb7d"
     },
     locale: "en-US",
-    baseUrl: "quartz.jzhao.xyz",
+    baseUrl: "rizaldy.club",
     ignorePatterns: ["private", "templates", ".obsidian"],
     defaultDateType: "created",
     theme: {
-      cdnCaching: true,
+      cdnCaching: false,
       typography: {
-        header: "Schibsted Grotesk",
-        body: "Source Sans Pro",
-        code: "IBM Plex Mono",
+        header: "Space Grotesk",
+        body: "Atkinson Hyperlegible",
+        code: "JetBrains Mono",
       },
       colors: {
         lightMode: {
-          light: "#faf8f8",
-          lightgray: "#e5e5e5",
-          gray: "#b8b8b8",
-          darkgray: "#4e4e4e",
-          dark: "#2b2b2b",
-          secondary: "#284b63",
-          tertiary: "#84a59d",
+          light: "#000000",
+          lightgray: "#393639",
+          gray: "#646464",
+          darkgray: "#a1a1a6",
+          dark: "#ebebec",
+          secondary:"#f5f5f7",
+          tertiary: "#a1a1a1",
           highlight: "rgba(143, 159, 169, 0.15)",
         },
         darkMode: {
@@ -42,8 +44,8 @@ const config: QuartzConfig = {
           gray: "#646464",
           darkgray: "#d4d4d4",
           dark: "#ebebec",
-          secondary: "#7b97aa",
-          tertiary: "#84a59d",
+          secondary:"#ffffff",
+          tertiary: "#ffffff",
           highlight: "rgba(143, 159, 169, 0.15)",
         },
       },
@@ -55,7 +57,6 @@ const config: QuartzConfig = {
       Plugin.CreatedModifiedDate({
         priority: ["frontmatter", "filesystem"],
       }),
-      Plugin.Latex({ renderEngine: "katex" }),
       Plugin.SyntaxHighlighting({
         theme: {
           light: "github-light",

quartz.layout.ts

@@ -5,13 +5,8 @@ import * as Component from "./quartz/components"
 export const sharedPageComponents: SharedLayout = {
   head: Component.Head(),
   header: [],
-  footer: Component.Footer({
-    links: {
-      GitHub: "https://github.com/jackyzha0/quartz",
-      "Discord Community": "https://discord.gg/cRFFHYye7t",
-    },
-  }),
-}
+  footer: Component.Footer(),
+};
 
 // components for pages that display a single page (e.g. a single note)
 export const defaultContentPageLayout: PageLayout = {
@@ -25,8 +20,22 @@ export const defaultContentPageLayout: PageLayout = {
     Component.PageTitle(),
     Component.MobileOnly(Component.Spacer()),
     Component.Search(),
-    Component.Darkmode(),
-    Component.DesktopOnly(Component.Explorer()),
+    Component.DesktopOnly(
+      Component.RecentNotes({
+        title: "03.03 AM",
+        limit: 3,
+        filter: f => f.frontmatter?.tags?.includes('blog'),
+        linkToMore: "/tags/blog" as SimpleSlug,
+      }),
+    ),
+    Component.DesktopOnly(
+      Component.RecentNotes({
+        title: "ls -al /var/log/public",
+        limit: 3,
+        filter: f => f.slug!.startsWith("log/") && f.slug! !== "log/index" && !f.frontmatter?.noindex,
+        linkToMore: "/tags/log" as SimpleSlug,
+      }),
+    ),
   ],
   right: [
     Component.Graph(),
@@ -42,8 +51,6 @@ export const defaultListPageLayout: PageLayout = {
     Component.PageTitle(),
     Component.MobileOnly(Component.Spacer()),
     Component.Search(),
-    Component.Darkmode(),
-    Component.DesktopOnly(Component.Explorer()),
   ],
   right: [],
 }

quartz/styles/custom.scss

@@ -1,3 +1,65 @@
 @use "./base.scss";
 
-// put your custom CSS here!
+body[data-slug="index"] {
+  .page-header {
+    margin-top: -1.5rem;
+    visibility: hidden;
+  }
+
+  img {
+    filter: grayscale(1);
+    z-index: -1;
+    position: relative;
+  }
+
+  #pixabay-attribute {
+    margin-top: -3rem;
+    font-style: italic;
+  }
+}
+
+article {
+  ol, ul {
+    margin-bottom: 2rem;
+  }
+
+  li:first-child {
+    margin-top: 1rem;
+  }
+
+  iframe,
+  li {
+    margin-bottom: 1rem;
+  }
+
+  > p {
+    margin-bottom: 2rem;
+  }
+
+  hr {
+    width: 10%;
+    margin: 3rem auto;
+  }
+}
+
+.section-ul .section-li .section .desc {
+  padding-left: .8rem;
+}
+
+.recent-ul .recent-li ul.tags {
+  display: none;
+}
+
+p,
+ul,
+text,
+a,
+tr,
+td,
+li,
+ol,
+ul,
+.katex,
+.math {
+  hyphens: none;
+}