From 8f02a537a6e0b139fae3219f148e5ea1458ab3c8 Mon Sep 17 00:00:00 2001
From: juprodh <juprodh@proton.me>
Date: Fri, 17 Jul 2026 21:06:11 +0800
Subject: [PATCH] Polish aria-current on active note, danger-foreground token,
 non-sticky mobile footer, balanced titles

---
 src/views/home.ts         |  2 +-
 src/views/layout.ts       | 10 +++++-----
 src/views/theme/themes.ts |  3 +++
 src/views/theme/tokens.ts |  4 ++--
 4 files changed, 11 insertions(+), 8 deletions(-)

diff --git a/src/views/home.ts b/src/views/home.ts
index 17b363b..7291c18 100644
--- a/src/views/home.ts
+++ b/src/views/home.ts
@@ -44,7 +44,7 @@ export function homePage(
       <div class="flex justify-center mb-5 text-[var(--accent)]">
         <svg width="56" height="56" viewBox="0 0 134.92644 128.42101" xmlns="http://www.w3.org/2000/svg" aria-hidden="true"><g transform="matrix(1.1,0,0,1.1,301.47096,350.25297)"><path fill="currentColor" d="m -228.35257,-262.99296 c -19.02978,5.17331 5.71835,53.17295 -8.81529,55.61911 -13.95583,2.34891 0.99206,-24.53241 -15.5475,-43.46739 -15.47347,-6.08381 -20.6167,-0.72715 -21.15703,-6.95845 -1.3108,-15.1168 3.95665,-3.71429 19.79401,-8.66631 10.82433,-3.38455 8.09155,-17.08945 3.51308,-19.68708 -14.62332,-8.29661 -0.4486,-21.17177 10.05655,-4.9252 4.71302,9.40824 16.36423,20.32455 18.35849,1.52382 1.60655,-15.14555 2.81668,-16.44355 8.53544,-24.19918 5.90154,-8.00349 25.08044,-4.44133 20.58215,1.31991 -5.02364,6.43406 -7.98538,3.21247 -14.05766,18.33414 -12.75512,31.76381 6.97901,29.69424 13.71761,37.34873 4.34654,4.93731 7.24489,-0.30345 10.876,-6.12677 8,-12 7.33137,-12.59361 13.33137,-20.59361 6,-6 3.48697,-14.27094 11.48697,-8.27094 2.14738,1.61054 8.33559,11.3398 5.57936,13.31991 -7.65995,1.7579 -6.25355,1.42931 -12.25355,11.42931 -6,10 -12,22 -16,30 4,6 3.7579,16.36888 5.7579,28.36888 -6.36045,10.47209 -14.25746,-0.3673 -24.05766,6.32268 -6.32302,4.31633 -20.20337,-14.76624 -11.82391,-14.37787 28.84239,1.33675 17.02084,-2.92172 15.35708,-20.34251 -10.88292,-10.19367 -16.95709,-23.80355 -33.23341,-25.97118 z"/></g></svg>
       </div>
-      <h1 class="text-4xl sm:text-5xl font-bold tracking-tight ${THEME.text} mb-3">${msg.home.tagline}</h1>
+      <h1 class="text-4xl sm:text-5xl font-bold tracking-tight text-balance ${THEME.text} mb-3">${msg.home.tagline}</h1>
       <p class="text-lg ${THEME.textSecondary} max-w-2xl mx-auto mb-6 leading-relaxed">${msg.home.heroDescription}</p>
       <div class="flex flex-wrap items-center justify-center gap-3 mb-5">
         <a href="/wiki/new" class="${primaryButtonClass}">${msg.home.createAWiki}</a>
diff --git a/src/views/layout.ts b/src/views/layout.ts
index 78862c5..f4e170a 100644
--- a/src/views/layout.ts
+++ b/src/views/layout.ts
@@ -133,7 +133,7 @@ function renderWithSidebar(body: string, options: LayoutOptions): string {
 					const href = handle
 						? noteUrl(handle, slug, n.slug)
 						: `/${slug}/${n.slug}`;
-					return `<li><a href="${href}" class="${isCurrent ? `font-bold text-[var(--accent-hover)]` : `${THEME.textSecondary} hover:text-[var(--accent)]`} block truncate text-sm py-1.5 md:py-0">${escapeHtml(n.title)}</a></li>`;
+					return `<li><a href="${href}"${isCurrent ? ` aria-current="page"` : ""} class="${isCurrent ? `font-bold text-[var(--accent-hover)]` : `${THEME.textSecondary} hover:text-[var(--accent)]`} block truncate text-sm py-1.5 md:py-0">${escapeHtml(n.title)}</a></li>`;
 				})
 				.join("\n")}</ul>`;
 
@@ -224,7 +224,7 @@ function renderWithSidebar(body: string, options: LayoutOptions): string {
         ${noteActionsBlock}
       </div>
       <nav class="flex-1 min-h-0 overflow-y-auto py-2">
-        ${customSidebar ? "" : `<h3 class="text-xs font-semibold ${THEME.textMuted} uppercase tracking-wide mb-2">${msg.wiki.pages}</h3>`}
+        ${customSidebar ? "" : `<p class="text-xs font-semibold ${THEME.textMuted} uppercase tracking-wide mb-2">${msg.wiki.pages}</p>`}
         ${noteLinks}
       </nav>
       ${adminLinks}
@@ -397,13 +397,13 @@ ${extraScripts}
   ${
 		options?.sidebarNotes
 			? renderWithSidebar(
-					`${options?.pageTitle ? `<div class="text-center pb-6 mb-6 border-b ${THEME.borderSubtle}"><h1 class="text-3xl font-bold ${THEME.text}">${escapeHtml(options.pageTitle)}</h1></div>` : ""}${body}`,
+					`${options?.pageTitle ? `<div class="text-center pb-6 mb-6 border-b ${THEME.borderSubtle}"><h1 class="text-3xl font-bold text-balance ${THEME.text}">${escapeHtml(options.pageTitle)}</h1></div>` : ""}${body}`,
 					options,
 				)
-			: `<main id="main" class="w-full max-w-6xl mx-auto px-6 py-8">${options?.pageTitle ? `<div class="text-center pb-6 mb-6 border-b ${THEME.borderSubtle}"><h1 class="text-3xl font-bold ${THEME.text}">${escapeHtml(options.pageTitle)}</h1></div>` : ""}${body}</main>`
+			: `<main id="main" class="w-full max-w-6xl mx-auto px-6 py-8">${options?.pageTitle ? `<div class="text-center pb-6 mb-6 border-b ${THEME.borderSubtle}"><h1 class="text-3xl font-bold text-balance ${THEME.text}">${escapeHtml(options.pageTitle)}</h1></div>` : ""}${body}</main>`
 	}
   </div>
-  <footer class="shrink-0 sticky bottom-0 z-10 ${THEME.bg} border-t ${THEME.borderSubtle} py-4 text-center text-xs ${THEME.textMuted}">
+  <footer class="shrink-0 md:sticky md:bottom-0 z-10 ${THEME.bg} border-t ${THEME.borderSubtle} py-4 text-center text-xs ${THEME.textMuted}">
     <a href="https://atproto.com" target="_blank" rel="noopener noreferrer" class="hover:underline">${msg.home.builtOnAtproto}</a>
     <span class="mx-2">&middot;</span>
     <a href="https://tangled.sh/juprodh.me/lichen.wiki" target="_blank" rel="noopener noreferrer" class="hover:underline">${msg.home.sourceCode}</a>
diff --git a/src/views/theme/themes.ts b/src/views/theme/themes.ts
index cdf17ef..ad7daa8 100644
--- a/src/views/theme/themes.ts
+++ b/src/views/theme/themes.ts
@@ -19,6 +19,7 @@ export type Theme = {
 	dangerText: string;
 	dangerAction: string;
 	dangerActionHover: string;
+	dangerForeground: string;
 	warningBg: string;
 	warningBorder: string;
 	warningText: string;
@@ -49,6 +50,7 @@ export const themes = {
 		dangerText: "#b91c1c",
 		dangerAction: "#b91c1c",
 		dangerActionHover: "#991b1b",
+		dangerForeground: "#ffffff",
 		warningBg: "#fffbeb",
 		warningBorder: "#fcd34d",
 		warningText: "#92400e",
@@ -86,6 +88,7 @@ export const themes = {
 		dangerText: "#fca5a5",
 		dangerAction: "#b91c1c",
 		dangerActionHover: "#dc2626",
+		dangerForeground: "#ffffff",
 		warningBg: "#451a03",
 		warningBorder: "#78350f",
 		warningText: "#fcd34d",
diff --git a/src/views/theme/tokens.ts b/src/views/theme/tokens.ts
index 70628f7..39d527d 100644
--- a/src/views/theme/tokens.ts
+++ b/src/views/theme/tokens.ts
@@ -65,9 +65,9 @@ export const primarySmallButtonClass = `inline-flex items-center justify-center
 
 export const outlineSmallButtonClass = `inline-flex items-center justify-center ${touchTargetClass} px-3 py-1.5 border border-[var(--accent)] ${THEME.accentText} text-sm font-medium rounded ${THEME.accentSoft}`;
 
-export const dangerButtonClass = `inline-flex items-center justify-center ${touchTargetClass} px-4 py-2 bg-[var(--danger-action)] text-white text-sm font-medium rounded hover:bg-[var(--danger-action-hover)]`;
+export const dangerButtonClass = `inline-flex items-center justify-center ${touchTargetClass} px-4 py-2 bg-[var(--danger-action)] text-[var(--danger-foreground)] text-sm font-medium rounded hover:bg-[var(--danger-action-hover)]`;
 
-export const dangerSmallButtonClass = `inline-flex items-center justify-center ${touchTargetClass} px-2.5 py-1 bg-[var(--danger-action)] text-white text-xs font-medium rounded hover:bg-[var(--danger-action-hover)]`;
+export const dangerSmallButtonClass = `inline-flex items-center justify-center ${touchTargetClass} px-2.5 py-1 bg-[var(--danger-action)] text-[var(--danger-foreground)] text-xs font-medium rounded hover:bg-[var(--danger-action-hover)]`;
 
 export const sidebarButtonClass = `w-full flex items-center gap-2 px-3 py-2.5 md:py-1.5 text-sm border ${THEME.border} rounded-lg ${THEME.bgSurface} ${THEME.textMuted} ${THEME.accentSoft} cursor-pointer`;
 
-- 
2.51.2