From 76c092dcf20959bc52fcb13b28cee50cd4217e40 Mon Sep 17 00:00:00 2001
From: Jacky Zhao <j.zhao2k19@gmail.com>
Date: Thu, 20 Jul 2023 04:59:48 +0000
Subject: [PATCH] add custom.scss

---
 quartz/components/renderPage.tsx |   38 +++++++++++++++++---------------------
 1 files changed, 17 insertions(+), 21 deletions(-)

diff --git a/quartz/components/renderPage.tsx b/quartz/components/renderPage.tsx
index 4da6370..e5cf5eb 100644
--- a/quartz/components/renderPage.tsx
+++ b/quartz/components/renderPage.tsx
@@ -3,7 +3,7 @@
 import HeaderConstructor from "./Header"
 import BodyConstructor from "./Body"
 import { JSResourceToScriptElement, StaticResources } from "../resources";
-import { resolveToRoot } from "../path";
+import { CanonicalSlug, pathToRoot } from "../path";
 
 interface RenderComponents {
   head: QuartzComponent
@@ -15,8 +15,8 @@
   footer: QuartzComponent,
 }
 
-export function pageResources(slug: string, staticResources: StaticResources): StaticResources {
-  const baseDir = resolveToRoot(slug)
+export function pageResources(slug: CanonicalSlug, staticResources: StaticResources): StaticResources {
+  const baseDir = pathToRoot(slug)
 
   const contentIndexPath = baseDir + "/static/contentIndex.json"
   const contentIndexScript = `const fetchData = fetch(\`${contentIndexPath}\`).then(data => data.json())`
@@ -32,45 +32,41 @@
   }
 }
 
-export function renderPage(slug: string, componentData: QuartzComponentProps, components: RenderComponents, pageResources: StaticResources): string {
+export function renderPage(slug: CanonicalSlug, componentData: QuartzComponentProps, components: RenderComponents, pageResources: StaticResources): string {
   const { head: Head, header, beforeBody, pageBody: Content, left, right, footer: Footer } = components
   const Header = HeaderConstructor()
   const Body = BodyConstructor()
 
   const LeftComponent =
-    <div class="left">
-      <div class="left-inner">
-        {left.map(BodyComponent => <BodyComponent {...componentData} />)}
-      </div>
+    <div class="left sidebar">
+      {left.map(BodyComponent => <BodyComponent {...componentData} />)}
     </div>
 
   const RightComponent =
-    <div class="right">
-      <div class="right-inner">
-        {right.map(BodyComponent => <BodyComponent {...componentData} />)}
-      </div>
+    <div class="right sidebar">
+      {right.map(BodyComponent => <BodyComponent {...componentData} />)}
     </div>
 
   const doc = <html>
     <Head {...componentData} />
     <body data-slug={slug}>
       <div id="quartz-root" class="page">
-        <div class="page-header">
-          <Header {...componentData} >
-            {header.map(HeaderComponent => <HeaderComponent {...componentData} />)}
-          </Header>
-          <div class="popover-hint">
-            {beforeBody.map(BodyComponent => <BodyComponent {...componentData} />)}
-          </div>
-        </div>
         <Body {...componentData}>
           {LeftComponent}
           <div class="center">
+            <div class="page-header">
+              <Header {...componentData} >
+                {header.map(HeaderComponent => <HeaderComponent {...componentData} />)}
+              </Header>
+              <div class="popover-hint">
+                {beforeBody.map(BodyComponent => <BodyComponent {...componentData} />)}
+              </div>
+            </div>
             <Content {...componentData} />
-            <Footer {...componentData} />
           </div>
           {RightComponent}
         </Body>
+        <Footer {...componentData} />
       </div>
     </body>
     {pageResources.js.filter(resource => resource.loadTime === "afterDOMReady").map(res => JSResourceToScriptElement(res))}

--
Gitblit v1.10.0