From fc211654a6698e1036b5ca1a75506a3970604122 Mon Sep 17 00:00:00 2001
From: Brendan Allan <brendonovich@outlook.com>
Date: Sat, 7 Jun 2025 16:27:41 +0800
Subject: [PATCH 1/3] layout improvements

---
 docs/app.config.ts                            | 80 +++++++++++++++++++
 .../reference/default-theme/landing.mdx       |  2 +-
 src/default-theme/Layout.module.css           |  3 +-
 .../components/Article.module.css             |  8 +-
 src/default-theme/components/Article.tsx      | 29 ++++++-
 .../components/Footer.module.css              |  2 +-
 6 files changed, 116 insertions(+), 8 deletions(-)

diff --git a/docs/app.config.ts b/docs/app.config.ts
index d82daed..306d37f 100644
--- a/docs/app.config.ts
+++ b/docs/app.config.ts
@@ -204,6 +204,86 @@ export default defineConfig(
 									},
 								],
 							},
+							{
+								title: "Reference",
+								collapsed: false,
+								items: [
+									{
+										title: "Frontmatter Config",
+										link: "/frontmatter",
+									},
+									{
+										title: "Runtime API",
+										link: "/runtime-api",
+									},
+								],
+							},
+							{
+								title: "Default Theme",
+								collapsed: false,
+								items: [
+									{
+										title: "Overview",
+										link: "/default-theme",
+									},
+									{
+										title: "Sidebar",
+										link: "/default-theme/sidebar",
+									},
+									{
+										title: "Article",
+										link: "/default-theme/article",
+									},
+									{
+										title: "Footer",
+										link: "/default-theme/footer",
+									},
+									{
+										title: "Landing",
+										link: "/default-theme/landing",
+									},
+								],
+							},
+							{
+								title: "Reference",
+								collapsed: false,
+								items: [
+									{
+										title: "Frontmatter Config",
+										link: "/frontmatter",
+									},
+									{
+										title: "Runtime API",
+										link: "/runtime-api",
+									},
+								],
+							},
+							{
+								title: "Default Theme",
+								collapsed: false,
+								items: [
+									{
+										title: "Overview",
+										link: "/default-theme",
+									},
+									{
+										title: "Sidebar",
+										link: "/default-theme/sidebar",
+									},
+									{
+										title: "Article",
+										link: "/default-theme/article",
+									},
+									{
+										title: "Footer",
+										link: "/default-theme/footer",
+									},
+									{
+										title: "Landing",
+										link: "/default-theme/landing",
+									},
+								],
+							},
 						],
 					},
 				},
diff --git a/docs/src/routes/reference/default-theme/landing.mdx b/docs/src/routes/reference/default-theme/landing.mdx
index 8dff1b4..4998e94 100644
--- a/docs/src/routes/reference/default-theme/landing.mdx
+++ b/docs/src/routes/reference/default-theme/landing.mdx
@@ -4,7 +4,7 @@ title: Landing
 
 # Landing
 
-The landing page is configured using [Rrontmatter](../frontmatter):
+The landing page is configured using [Frontmatter](../frontmatter):
 
 ```md
 ---
diff --git a/src/default-theme/Layout.module.css b/src/default-theme/Layout.module.css
index b3c4046..0ca8432 100644
--- a/src/default-theme/Layout.module.css
+++ b/src/default-theme/Layout.module.css
@@ -24,7 +24,7 @@
 }
 
 .sidenav {
-	min-width: 14rem;
+	min-width: 14.5rem;
 	height: calc(100dvh - var(--sb-header-height));
 	position: sticky;
 	top: var(--sb-header-height);
@@ -33,6 +33,7 @@
 	flex-direction: row;
 	padding: 1rem;
 	transition: transform 0.3s ease-in-out;
+	overflow-y:auto
 }
 
 :global(div._e + main) {
diff --git a/src/default-theme/components/Article.module.css b/src/default-theme/components/Article.module.css
index 6002a44..3ef6828 100644
--- a/src/default-theme/components/Article.module.css
+++ b/src/default-theme/components/Article.module.css
@@ -1,12 +1,15 @@
 .article {
-	margin: 2rem;
+	padding: 2rem;
 	display: flex;
+	height: 100%;
 }
 
 .content {
 	max-width: min(calc(100dvw - 2.5rem), 52rem);
 	flex: 1;
 	margin: 0 auto;
+	display: flex;
+	flex-direction: column;
 }
 
 .aside {
@@ -54,9 +57,8 @@
 	display: grid;
 	grid-template-columns: repeat(2, 1fr);
 	grid-column-gap: 1rem;
-	margin: 2rem 0;
 	font-size: 0.9em;
-	padding: 2rem 0 0;
+	padding: 1.5rem 0;
 	border-top: 1px solid
 		color-mix(in hsl, var(--sb-decoration-color) 15%, transparent);
 }
diff --git a/src/default-theme/components/Article.tsx b/src/default-theme/components/Article.tsx
index 7db493c..f78e366 100644
--- a/src/default-theme/components/Article.tsx
+++ b/src/default-theme/components/Article.tsx
@@ -84,6 +84,14 @@ export default function Article(props: ParentProps) {
 	const customLink = (r?: RelativePageConfig) =>
 		typeof r === "object" ? r.link : undefined;
 
+	const info = () => {
+		const editLink = pageData()?.editLink;
+		const lastUpdated = frontmatter()?.lastUpdated;
+
+		if (editLink === undefined && lastUpdated === undefined) return;
+		return { editLink, lastUpdated };
+	};
+
 	return (
 		<>
 			<WindowEventListener onClick={onClick} />
@@ -99,7 +107,7 @@ export default function Article(props: ParentProps) {
 
 					{props.children}
 
-					<div class={styles.info}>
+					{/* <div class={styles.info}>
 						<Show when={frontmatter()?.lastUpdated} fallback={<div />}>
 							<LastUpdated />
 						</Show>
@@ -107,7 +115,24 @@ export default function Article(props: ParentProps) {
 						<Show when={pageData()?.editLink && frontmatter()?.editLink}>
 							<Link href={pageData()?.editLink}>Edit this page on GitHub</Link>
 						</Show>
-					</div>
+					</div> */}
+					<div style={{ flex: 1 }} />
+
+					<Show when={info()}>
+						{(info) => (
+							<div class={styles.info}>
+								<Show when={info().editLink} fallback={<div />}>
+									{(link) => (
+										<Link href={link()}>Edit this page on GitHub</Link>
+									)}
+								</Show>
+
+								<Show when={info()?.lastUpdated}>
+									<LastUpdated />
+								</Show>
+							</div>
+						)}
+					</Show>
 
 					<Show when={hasPrev() || hasNext()}>
 						<nav class={styles.related}>
diff --git a/src/default-theme/components/Footer.module.css b/src/default-theme/components/Footer.module.css
index 03dcebd..1d9e735 100644
--- a/src/default-theme/components/Footer.module.css
+++ b/src/default-theme/components/Footer.module.css
@@ -1,5 +1,5 @@
 .footer {
-	margin: 2rem 0;
+	/* margin: 2rem 0; */
 	padding: 2rem 0;
 	border-top: 1px solid
 		color-mix(in hsl, var(--sb-decoration-color) 15%, transparent);

From 3aa67fa2dfb0077d782535fd4b850c4ee888d186 Mon Sep 17 00:00:00 2001
From: Brendan Allan <brendonovich@outlook.com>
Date: Sat, 7 Jun 2025 16:50:12 +0800
Subject: [PATCH 2/3] cleanup

---
 docs/app.config.ts                            | 80 -------------------
 .../components/Footer.module.css              |  1 -
 2 files changed, 81 deletions(-)

diff --git a/docs/app.config.ts b/docs/app.config.ts
index 306d37f..d82daed 100644
--- a/docs/app.config.ts
+++ b/docs/app.config.ts
@@ -204,86 +204,6 @@ export default defineConfig(
 									},
 								],
 							},
-							{
-								title: "Reference",
-								collapsed: false,
-								items: [
-									{
-										title: "Frontmatter Config",
-										link: "/frontmatter",
-									},
-									{
-										title: "Runtime API",
-										link: "/runtime-api",
-									},
-								],
-							},
-							{
-								title: "Default Theme",
-								collapsed: false,
-								items: [
-									{
-										title: "Overview",
-										link: "/default-theme",
-									},
-									{
-										title: "Sidebar",
-										link: "/default-theme/sidebar",
-									},
-									{
-										title: "Article",
-										link: "/default-theme/article",
-									},
-									{
-										title: "Footer",
-										link: "/default-theme/footer",
-									},
-									{
-										title: "Landing",
-										link: "/default-theme/landing",
-									},
-								],
-							},
-							{
-								title: "Reference",
-								collapsed: false,
-								items: [
-									{
-										title: "Frontmatter Config",
-										link: "/frontmatter",
-									},
-									{
-										title: "Runtime API",
-										link: "/runtime-api",
-									},
-								],
-							},
-							{
-								title: "Default Theme",
-								collapsed: false,
-								items: [
-									{
-										title: "Overview",
-										link: "/default-theme",
-									},
-									{
-										title: "Sidebar",
-										link: "/default-theme/sidebar",
-									},
-									{
-										title: "Article",
-										link: "/default-theme/article",
-									},
-									{
-										title: "Footer",
-										link: "/default-theme/footer",
-									},
-									{
-										title: "Landing",
-										link: "/default-theme/landing",
-									},
-								],
-							},
 						],
 					},
 				},
diff --git a/src/default-theme/components/Footer.module.css b/src/default-theme/components/Footer.module.css
index 1d9e735..6ea6b53 100644
--- a/src/default-theme/components/Footer.module.css
+++ b/src/default-theme/components/Footer.module.css
@@ -1,5 +1,4 @@
 .footer {
-	/* margin: 2rem 0; */
 	padding: 2rem 0;
 	border-top: 1px solid
 		color-mix(in hsl, var(--sb-decoration-color) 15%, transparent);

From 77f6ceebf6ff35b7955f3bd3c4ff6d57de824abe Mon Sep 17 00:00:00 2001
From: Brendan Allan <brendonovich@outlook.com>
Date: Mon, 9 Jun 2025 17:29:24 +0800
Subject: [PATCH 3/3] put article info in the right place

---
 .../components/Article.module.css             |  2 +-
 src/default-theme/components/Article.tsx      | 21 +++++++------------
 .../components/LastUpdated.module.css         |  1 +
 3 files changed, 9 insertions(+), 15 deletions(-)

diff --git a/src/default-theme/components/Article.module.css b/src/default-theme/components/Article.module.css
index 3ef6828..8c3443a 100644
--- a/src/default-theme/components/Article.module.css
+++ b/src/default-theme/components/Article.module.css
@@ -47,7 +47,7 @@
 	font-size: 0.9em;
 	margin: 4rem 0 1rem;
 	display: flex;
-	justify-content: space-between;
+	flex-direction: row;
 	white-space: nowrap;
 	flex-wrap: wrap;
 	gap: 0.5rem;
diff --git a/src/default-theme/components/Article.tsx b/src/default-theme/components/Article.tsx
index f78e366..65d0f64 100644
--- a/src/default-theme/components/Article.tsx
+++ b/src/default-theme/components/Article.tsx
@@ -107,29 +107,22 @@ export default function Article(props: ParentProps) {
 
 					{props.children}
 
-					{/* <div class={styles.info}>
-						<Show when={frontmatter()?.lastUpdated} fallback={<div />}>
-							<LastUpdated />
-						</Show>
-
-						<Show when={pageData()?.editLink && frontmatter()?.editLink}>
-							<Link href={pageData()?.editLink}>Edit this page on GitHub</Link>
-						</Show>
-					</div> */}
 					<div style={{ flex: 1 }} />
 
 					<Show when={info()}>
 						{(info) => (
 							<div class={styles.info}>
-								<Show when={info().editLink} fallback={<div />}>
+								<Show when={info()?.lastUpdated}>
+									<LastUpdated />
+								</Show>
+
+								<div style={{ flex: 1 }} />
+
+								<Show when={info().editLink}>
 									{(link) => (
 										<Link href={link()}>Edit this page on GitHub</Link>
 									)}
 								</Show>
-
-								<Show when={info()?.lastUpdated}>
-									<LastUpdated />
-								</Show>
 							</div>
 						)}
 					</Show>
diff --git a/src/default-theme/components/LastUpdated.module.css b/src/default-theme/components/LastUpdated.module.css
index e13e895..d6c97fa 100644
--- a/src/default-theme/components/LastUpdated.module.css
+++ b/src/default-theme/components/LastUpdated.module.css
@@ -1,3 +1,4 @@
 .last-updated {
+	margin-right: auto;
 	color: color-mix(in hsl, var(--sb-text-color) 72.5%, transparent);
 }