Merge commit '7fa9253abc1e4056d425847e2eaa5a8e107fc297' into v4

quartz.layout.ts

@@ -8,10 +8,10 @@ export const sharedPageComponents: SharedLayout = {
   afterBody: [],
   footer: Component.Footer({
     links: {
-      "Top": "https://matsuuratomoya.com",
-      "Mastodon": "https://social.matsuuratomoya.com/@tomoya",
-      "Twitter": "https://twitter.com/tomoya_nonymous",
-      "GitHub": "https://github.com/tomoyanonymous",
+      Top: "https://matsuuratomoya.com",
+      Mastodon: "https://social.matsuuratomoya.com/@tomoya",
+      Twitter: "https://twitter.com/tomoya_nonymous",
+      GitHub: "https://github.com/tomoyanonymous",
     },
   }),
 }
@@ -40,18 +40,37 @@ const graph_cfg = {
     fontSize: 0.6,
     opacityScale: 1,
   },
-};
+}
 export const defaultContentPageLayout: PageLayout = {
-  beforeBody: [Component.Breadcrumbs(),
-  Component.ArticleTitle(), Component.ContentMeta(), /*Component.TagList()*/],
+  beforeBody: [
+    Component.ConditionalRender({
+      component: Component.Breadcrumbs(),
+      condition: (page) => page.fileData.slug !== "index",
+    }),
+    Component.ArticleTitle(),
+    Component.ContentMeta() /*Component.TagList()*/,
+  ],
   left: [
     Component.PageTitle(),
     Component.MobileOnly(Component.Spacer()),
-    Component.Search(),
-    Component.Darkmode(),
+    Component.Flex({
+      components: [
+        {
+          Component: Component.Search(),
+          grow: true,
+        },
+        { Component: Component.Darkmode() },
+        { Component: Component.ReaderMode() },
+      ],
+    }),
+    Component.Explorer(),
     Component.DesktopOnly(Component.TableOfContents()),
   ],
-  right: [Component.Graph(graph_cfg), Component.Backlinks(), Component.RecentNotes({ title: "Recent writing" })],
+  right: [
+    Component.Graph(graph_cfg),
+    Component.Backlinks(),
+    Component.RecentNotes({ title: "Recent writing" }),
+  ],
 }
 
 // components for pages that display lists of pages  (e.g. tags or folders)
@@ -60,13 +79,20 @@ export const defaultListPageLayout: PageLayout = {
   left: [
     Component.PageTitle(),
     Component.MobileOnly(Component.Spacer()),
-    Component.Search(),
-    Component.Darkmode(),
-    Component.DesktopOnly(Component.Explorer()),
+    Component.Flex({
+      components: [
+        {
+          Component: Component.Search(),
+          grow: true,
+        },
+        { Component: Component.Darkmode() },
+      ],
+    }),
+    Component.Explorer(),
   ],
   right: [
     Component.Graph(),
     Component.DesktopOnly(Component.TableOfContents()),
     Component.Backlinks(),
   ],
-}
+}