From e021423904fd8def84e9d8bb880142c5eed01c5d Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E3=81=BF=E3=81=A6=E3=82=8B=E3=81=9E?= <miteruzo@naver.com>
Date: Sat, 11 Apr 2026 16:58:41 +0900
Subject: [PATCH] =?UTF-8?q?=E3=82=B9=E3=83=9E=E3=83=9B=E3=83=BB=E3=83=AC?=
 =?UTF-8?q?=E3=83=BC=E3=82=A2=E3=82=A6=E3=83=88=E3=83=BB=E3=83=90=E3=82=B0?=
 =?UTF-8?q?=EF=BC=88#304=EF=BC=89=20(#305)?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

#304

#304

#304

Co-authored-by: miteruzo <miteruzo@naver.com>
Reviewed-on: https://git.miteruzo.com/miteruzo/btrc-hub/pulls/305
---
 frontend/src/App.tsx                          |  2 +-
 frontend/src/components/TopNav.tsx            | 22 +++++++++----------
 frontend/src/components/layout/MainArea.tsx   |  3 +--
 frontend/src/index.css                        |  8 ++++---
 .../src/pages/materials/MaterialBasePage.tsx  |  3 ++-
 frontend/src/pages/posts/PostDetailPage.tsx   |  3 ++-
 frontend/src/pages/posts/PostListPage.tsx     |  5 ++++-
 7 files changed, 26 insertions(+), 20 deletions(-)

diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx
index 770f46c..b49aa26 100644
--- a/frontend/src/App.tsx
+++ b/frontend/src/App.tsx
@@ -131,7 +131,7 @@ export default (() => {
       <>
 	<RouteBlockerOverlay/>
 	<BrowserRouter>
-	  <div className="flex flex-col h-dvh w-screen">
+	  <div className="flex flex-col h-dvh w-full">
 	    <TopNav user={user}/>
 	    <RouteTransitionWrapper user={user} setUser={setUser}/>
 	  </div>
diff --git a/frontend/src/components/TopNav.tsx b/frontend/src/components/TopNav.tsx
index b173dac..27d40b1 100644
--- a/frontend/src/components/TopNav.tsx
+++ b/frontend/src/components/TopNav.tsx
@@ -79,12 +79,12 @@ export default (({ user }: Props) => {
 	  { name: '上位タグ', to: '/tags/implications', visible: false },
 	  { name: 'ニコニコ連携', to: '/tags/nico' },
 	  { name: 'ヘルプ', to: '/wiki/ヘルプ:タグ' }] },
-      { name: '素材', to: '/materials', subMenu: [
-	  { name: '一覧', to: '/materials' },
-	  // { name: '検索', to: '/materials/search' }, 
-	  { name: '追加', to: '/materials/new' },
-	  // { name: '履歴', to: '/materials/changes' },
-	  { name: 'ヘルプ', to: 'wiki/ヘルプ:素材集' }] },
+      // { name: '素材', to: '/materials', subMenu: [
+      //     { name: '一覧', to: '/materials' },
+      //     { name: '検索', to: '/materials/search', visible: false }, 
+      //     { name: '追加', to: '/materials/new' },
+      //     { name: '履歴', to: '/materials/changes', visible: false },
+      //     { name: 'ヘルプ', to: '/wiki/ヘルプ:素材集' }] },
       { name: '上映会', to: '/theatres/1', base: '/theatres', subMenu: [
           { name: <>第&thinsp;1&thinsp;会場</>, to: '/theatres/1' },
           { name: 'CyTube', to: '//cytube.mm428.net/r/deernijika' },
@@ -145,9 +145,9 @@ export default (({ user }: Props) => {
 
   return (
       <>
-	<nav className="px-3 flex justify-between items-center w-full min-h-[48px]
+	<nav className="px-3 flex justify-between items-center w-full
 			bg-yellow-200 dark:bg-red-975 md:bg-yellow-50">
-	  <div className="flex items-center gap-2 h-full">
+	  <div className="flex items-center gap-2 h-12">
 	    <PrefetchLink
 		to="/posts"
 		className="mx-4 text-xl font-bold text-pink-600 hover:text-pink-400
@@ -158,13 +158,13 @@ export default (({ user }: Props) => {
 	      ぼざクリ タグ広場
 	    </PrefetchLink>
 
-	    <div ref={navRef} className="relative hidden md:flex h-full items-center">
+	    <div ref={navRef} className="relative hidden md:flex h-12 items-center">
 	      <div aria-hidden
-		   className={cn ('absolute top-1/2 -translate-y-1/2 h-full',
+		   className={cn ('absolute inset-y-0 h-12',
 				  'bg-yellow-200 dark:bg-red-950',
 				  'transition-[transform,width] duration-200 ease-out')}
 		   style={{ width:      hl.width,
-			    transform:  `translate(${ hl.left }px, -50%)`,
+			    transform:  `translateX(${ hl.left }px)`,
 			    opacity:    hl.visible ? 1 : 0 }}/>
 
 	      {menu.map ((item, i) => (
diff --git a/frontend/src/components/layout/MainArea.tsx b/frontend/src/components/layout/MainArea.tsx
index 8839ebc..273793d 100644
--- a/frontend/src/components/layout/MainArea.tsx
+++ b/frontend/src/components/layout/MainArea.tsx
@@ -8,8 +8,7 @@ type Props = {
 
 
 export default (({ children, className }: Props) => (
-    <main className={cn ('flex-1 overflow-y-auto p-4',
-			 'md:h-[calc(100dvh-88px)] md:overflow-y-auto',
+    <main className={cn ('flex-1 overflow-y-auto p-4 md:h-[calc(100dvh-88px)]',
 			 className)}>
       {children}
     </main>)) satisfies FC<Props>
diff --git a/frontend/src/index.css b/frontend/src/index.css
index 263b75d..440f499 100644
--- a/frontend/src/index.css
+++ b/frontend/src/index.css
@@ -46,10 +46,12 @@ a
 body
 {
   margin: 0;
-  display: flex;
-  place-items: center;
   min-width: 320px;
-  min-height: 100vh;
+}
+
+#root
+{
+  min-height: 100dvh;
 }
 
 h1
diff --git a/frontend/src/pages/materials/MaterialBasePage.tsx b/frontend/src/pages/materials/MaterialBasePage.tsx
index 69d6a33..467ef58 100644
--- a/frontend/src/pages/materials/MaterialBasePage.tsx
+++ b/frontend/src/pages/materials/MaterialBasePage.tsx
@@ -6,7 +6,8 @@ import type { FC } from 'react'
 
 
 export default (() => (
-    <div className="md:flex md:flex-1 md:h-[calc(100dvh-88px)]">
+    <div className="md:flex md:flex-1 overflow-y-auto md:overflow-y-hidden
+		    md:h-[calc(100dvh-88px)]">
       <MaterialSidebar/>
       <Outlet/>
     </div>)) satisfies FC
diff --git a/frontend/src/pages/posts/PostDetailPage.tsx b/frontend/src/pages/posts/PostDetailPage.tsx
index a15f035..518b914 100644
--- a/frontend/src/pages/posts/PostDetailPage.tsx
+++ b/frontend/src/pages/posts/PostDetailPage.tsx
@@ -93,7 +93,8 @@ export default (({ user }: Props) => {
 		       : 'bg-gray-500 hover:bg-gray-600')
 
   return (
-      <div className="md:flex md:flex-1 md:h-[calc(100dvh-88px)]">
+      <div className="md:flex md:flex-1 overflow-y-auto md:overflow-y-hidden
+		      md:h-[calc(100dvh-88px)]">
 	<Helmet>
 	  {(post?.thumbnail || post?.thumbnailBase) && (
 	      <meta name="thumbnail" content={post.thumbnail || post.thumbnailBase}/>)}
diff --git a/frontend/src/pages/posts/PostListPage.tsx b/frontend/src/pages/posts/PostListPage.tsx
index 8fc4ba8..979c75e 100644
--- a/frontend/src/pages/posts/PostListPage.tsx
+++ b/frontend/src/pages/posts/PostListPage.tsx
@@ -69,7 +69,10 @@ export default (() => {
   }, [location.search])
 
   return (
-      <div className="md:flex md:flex-1 md:h-[calc(100dvh-88px)]" ref={containerRef}>
+      <div
+	  className="md:flex md:flex-1 overflow-y-auto md:overflow-y-hidden
+		     md:h-[calc(100dvh-88px)]"
+	  ref={containerRef}>
 	<Helmet>
 	  <title>
 	    {tags.length