サブヘッダーのスタイルを改善し、TOCのカスタムスタイルを削除しました。また、ページビュー取得機能を削除し、グローバルCSSにTOCリンク…

…のスタイルを追加しました。 (#647)
ttizze · Feb 28, 2025 · 23aae68 · 23aae68
2 parents 009a066 + 39613b9
commit 23aae68
Show file tree

Hide file tree

Showing 4 changed files with 12 additions and 76 deletions.
diff --git a/next/src/app/[locale]/(common-layout)/user/[handle]/page/[slug]/components/sub-header.tsx b/next/src/app/[locale]/(common-layout)/user/[handle]/page/[slug]/components/sub-header.tsx
@@ -57,9 +57,9 @@ export function SubHeader({
 	return (
 		<div ref={headerRef}>
 			<div
-				className={`transition-all duration-300 ${
-					!isVisible ? "-translate-y-full" : "translate-y-0"
-				} ${isPinned ? "fixed top-0 left-0 right-0 z-50 shadow-md" : ""} bg-background py-4`}
+				className={`transition-all duration-300 z-[999] ${
+					!isVisible ? "-translate-y-full" : ""
+				}	${isPinned ? "fixed top-0 left-0 right-0  shadow-md" : ""} bg-background py-4`}
 			>
 				<div
 					className={`prose dark:prose-invert sm:prose lg:prose-lg mx-auto 

diff --git a/next/src/app/[locale]/(common-layout)/user/[handle]/page/[slug]/components/toc.tsx b/next/src/app/[locale]/(common-layout)/user/[handle]/page/[slug]/components/toc.tsx
@@ -29,16 +29,6 @@ export default function TableOfContents({
 			scrollSmoothOffset: -70,
 		});
 
-		// Add custom styling for the TOC with a unique ID
-		const style = document.createElement("style");
-		style.id = "toc-custom-style";
-		style.innerHTML = `
-			.toc-link {
-				white-space: pre-wrap;
-			}
-		`;
-		document.head.appendChild(style);
-
 		// Clean up on unmount
 		return () => {
 			tocbot.destroy();

diff --git a/next/src/app/[locale]/lib/get-page-views.ts b/next/src/app/[locale]/lib/get-page-views.ts
diff --git a/next/src/app/globals.css b/next/src/app/globals.css
@@ -101,19 +101,22 @@ body.virtual-keyboard-shown {
 	margin-top: var(--visual-viewport-offset-top, 0px);
 }
 
+.toc-link {
+	@apply !no-underline;
+	@apply whitespace-pre-wrap;
+}
 .toc-link:before {
 	@apply !hidden;
 }
 
-.toc-list {
-	@apply text-slate-400 !list-none;
-}
-.toc-link {
-	@apply !no-underline;
-}
 .toc-link:hover {
 	@apply !underline;
 }
+
+.toc-list {
+	@apply text-slate-400;
+}
+
 .is-active-link {
 	@apply !text-primary;
 }