From 4baa8452a72d88111869236f1df0a754e878ee3a Mon Sep 17 00:00:00 2001 From: riceset Date: Wed, 18 Mar 2026 18:52:14 +0900 Subject: [PATCH] Refine homepage and article layout --- quartz.config.ts | 2 +- quartz.layout.ts | 63 ++++--------- quartz/components/Footer.tsx | 11 ++- quartz/components/HomeProfile.tsx | 8 +- quartz/components/LinksList.tsx | 108 +++++++++++++++++----- quartz/components/styles/footer.scss | 5 + quartz/components/styles/homeProfile.scss | 22 ++++- quartz/components/styles/linksList.scss | 56 +++++++++++ quartz/static/logos/42.svg | 12 +++ quartz/static/logos/google.svg | 104 +++++++++++++++++++++ quartz/static/logos/mixi.svg | 1 + quartz/static/logos/tufs.svg | 10 ++ 12 files changed, 326 insertions(+), 76 deletions(-) create mode 100644 quartz/components/styles/linksList.scss create mode 100644 quartz/static/logos/42.svg create mode 100644 quartz/static/logos/google.svg create mode 100644 quartz/static/logos/mixi.svg create mode 100644 quartz/static/logos/tufs.svg diff --git a/quartz.config.ts b/quartz.config.ts index 88bdc2b79..d01301577 100644 --- a/quartz.config.ts +++ b/quartz.config.ts @@ -68,7 +68,7 @@ const config: QuartzConfig = { keepBackground: false, }), Plugin.ObsidianFlavoredMarkdown({ enableInHtmlEmbed: false }), - Plugin.GitHubFlavoredMarkdown({ linkHeadings: false }), + Plugin.GitHubFlavoredMarkdown({ linkHeadings: true }), Plugin.TableOfContents(), Plugin.CrawlLinks({ markdownLinkResolution: "shortest" }), Plugin.Description(), diff --git a/quartz.layout.ts b/quartz.layout.ts index 073290417..0d8ede11d 100644 --- a/quartz.layout.ts +++ b/quartz.layout.ts @@ -7,8 +7,7 @@ export const sharedPageComponents: SharedLayout = { header: [], afterBody: [], footer: Component.Footer({ - links: { - }, + links: {}, }), } @@ -39,36 +38,23 @@ export const defaultContentPageLayout: PageLayout = { }), Component.Darkmode(), Component.ConditionalRender({ - component: Component.DesktopOnly(Component.LinksList({ - links: { - "E-Mail": "mailto:riceset@icloud.com", - GitHub: "https://github.com/riceset", - LinkedIn: "https://www.linkedin.com/in/riceset/", - }, - })), - condition: (props) => props.fileData.slug !== "index", - }), - Component.ConditionalRender({ - component: Component.Explorer(), + component: Component.DesktopOnly( + Component.RecentNotes({ + title: "Latest Articles", + limit: 8, + showTags: false, + }), + ), condition: (props) => props.fileData.slug !== "index", }), ], right: [ Component.ConditionalRender({ - component: Component.DesktopOnly(Component.RecentNotes({ title: "Latest", limit: 8 })), + component: Component.DesktopOnly(Component.TableOfContents()), condition: (props) => props.fileData.slug !== "index", }), Component.ConditionalRender({ - component: Component.MobileOnly(Component.RecentNotes({ title: "Latest", limit: 1 })), - condition: (props) => props.fileData.slug !== "index", - }), - Component.ConditionalRender({ - component: Component.MobileOnly(Component.LinksList({ - links: { - GitHub: "https://github.com/riceset", - LinkedIn: "https://www.linkedin.com/in/riceset/", - }, - })), + component: Component.MobileOnly(Component.TableOfContents()), condition: (props) => props.fileData.slug !== "index", }), ], @@ -82,29 +68,20 @@ export const defaultListPageLayout: PageLayout = { Component.MobileOnly(Component.Spacer()), //Component.Search(), Component.Darkmode(), - Component.DesktopOnly(Component.LinksList({ - links: { - "E-Mail": "mailto:riceset@icloud.com", - GitHub: "https://github.com/riceset", - LinkedIn: "https://www.linkedin.com/in/riceset/", - } - })), Component.Explorer(), ], right: [ - Component.DesktopOnly(Component.RecentNotes({ + Component.DesktopOnly( + Component.RecentNotes({ title: "Latest", - limit: 8 - })), - Component.MobileOnly(Component.RecentNotes({ + limit: 8, + }), + ), + Component.MobileOnly( + Component.RecentNotes({ title: "Latest", - limit: 1 - })), - Component.MobileOnly(Component.LinksList({ - links: { - GitHub: "https://github.com/riceset", - LinkedIn: "https://www.linkedin.com/in/riceset/", - } - })) + limit: 1, + }), + ), ], } diff --git a/quartz/components/Footer.tsx b/quartz/components/Footer.tsx index 395be4559..2fdd0d7a1 100644 --- a/quartz/components/Footer.tsx +++ b/quartz/components/Footer.tsx @@ -1,18 +1,21 @@ import { QuartzComponent, QuartzComponentConstructor, QuartzComponentProps } from "./types" import style from "./styles/footer.scss" -import { version } from "../../package.json" -import { i18n } from "../i18n" interface Options { links: Record } export default ((opts?: Options) => { - const Footer: QuartzComponent = ({ displayClass, cfg }: QuartzComponentProps) => { + const Footer: QuartzComponent = ({ displayClass, fileData }: QuartzComponentProps) => { const year = new Date().getFullYear() const links = opts?.links ?? [] + const isHomePage = fileData.slug === "index" + const footerClass = [displayClass, isHomePage ? "home-footer" : undefined] + .filter(Boolean) + .join(" ") + return ( -