ut-code · nakaterm · Apr 11, 2025 · Apr 11, 2025 · Apr 11, 2025 · Apr 11, 2025
diff --git a/common/lib/panic.ts b/common/lib/panic.ts
@@ -1,6 +1,8 @@
 // unexpected error
 export function panic(reason: string): never {
-  throw new Error(reason, {
-    cause: "panic",
-  });
+  throw new Error(reason);
+  // TODO: 型エラーとなるため一時的にコメントアウト
+  // throw new Error(reason, {
+  //   cause: "panic",
+  // });
 }
diff --git a/web/app/chat/layout.tsx b/web/app/chat/layout.tsx
@@ -9,7 +9,9 @@ export default function Layout({ children }: { children: React.ReactNode }) {
       <ModalProvider>
         <Header title="チャット" />
         <NavigateByAuthState type="toLoginForUnauthenticated">
-          <div className="h-full overflow-y-auto pt-12 pb-12">{children}</div>
+          <div className="cm-pb-footer h-full overflow-y-auto pt-12">
+            {children}
+          </div>
         </NavigateByAuthState>
         <BottomBar activeTab="3_chat" />
       </ModalProvider>

diff --git a/web/app/friends/layout.tsx b/web/app/friends/layout.tsx
@@ -9,7 +9,9 @@ export default function Layout({ children }: { children: React.ReactNode }) {
       <ModalProvider>
         <Header title="フレンド" />
         <NavigateByAuthState type="toLoginForUnauthenticated">
-          <div className="h-full overflow-y-auto pt-12 pb-12">{children}</div>
+          <div className="cm-pb-footer h-full overflow-y-auto pt-12">
+            {children}
+          </div>
         </NavigateByAuthState>
         <BottomBar activeTab="1_friends" />
       </ModalProvider>

diff --git a/web/app/globals.css b/web/app/globals.css
@@ -11,3 +11,8 @@
 .cm-li-btn {
   @apply no-animation h-auto w-full justify-start rounded-none border-none bg-white px-6 py-4 text-left font-normal text-base shadow-none hover:bg-zinc-100 focus:bg-zinc-300;
 }
+
+/* Bottom Bar の分の幅 */
+.cm-pb-footer {
+  padding-bottom: calc(3rem + env(safe-area-inset-bottom));
+}
diff --git a/web/app/home/layout.tsx b/web/app/home/layout.tsx
@@ -11,7 +11,7 @@ export default function Layout({
     <>
       <Header />
       <NavigateByAuthState type="toLoginForUnauthenticated">
-        <div className="h-full pt-12 pb-12">{children}</div>
+        <div className="cm-pb-footer h-full pt-12">{children}</div>
       </NavigateByAuthState>
       <BottomBar activeTab="0_home" />
     </>

diff --git a/web/app/layout.tsx b/web/app/layout.tsx
@@ -33,10 +33,11 @@ export default function RootLayout({
       <head>
         <meta charSet="UTF-8" />
         <link rel="icon" type="image/svg+xml" href="/course-mate-icon.svg" />
-        <meta
+        {/* TODO: 上書きされる*/}
+        {/* <meta
           name="viewport"
-          content="width=device-width, initial-scale=1.0, maximum-scale=1.0"
-        />
+          content="width=device-width, initial-scale=1, viewport-fit=cover"
+        /> */}
         <title>CourseMate</title>
       </head>
       <body className="h-full">

diff --git a/web/app/manifest.ts b/web/app/manifest.ts
@@ -0,0 +1,25 @@
+import type { MetadataRoute } from "next";
+
+export default function manifest(): MetadataRoute.Manifest {
+  return {
+    name: "CourseMate",
+    short_name: "CourseMate",
+    description: "同じ授業を履修している友達を見つけられるアプリ",
+    start_url: "/",
+    display: "standalone",
+    background_color: "#ffffff",
+    theme_color: "#ffffff",
+    icons: [
+      {
+        src: "/icon-192x192.png",
+        sizes: "192x192",
+        type: "image/png",
+      },
+      {
+        src: "/icon-512x512.png",
+        sizes: "512x512",
+        type: "image/png",
+      },
+    ],
+  };
+}
diff --git a/web/app/search/layout.tsx b/web/app/search/layout.tsx
@@ -9,7 +9,9 @@ export default function Layout({ children }: { children: React.ReactNode }) {
       <ModalProvider>
         <Header title="検索" />
         <NavigateByAuthState type="toLoginForUnauthenticated">
-          <div className="h-full overflow-y-auto pt-12 pb-12">{children}</div>
+          <div className="cm-pb-footer h-full overflow-y-auto pt-12">
+            {children}
+          </div>
         </NavigateByAuthState>
         <BottomBar activeTab="2_search" />
       </ModalProvider>

diff --git a/web/app/settings/layout.tsx b/web/app/settings/layout.tsx
@@ -11,7 +11,9 @@ export default function Layout({
     <>
       <Header title="設定" />
       <NavigateByAuthState type="toLoginForUnauthenticated">
-        <div className="h-full overflow-y-auto pt-12 pb-12">{children}</div>
+        <div className="cm-pb-footer h-full overflow-y-auto pt-12">
+          {children}
+        </div>
       </NavigateByAuthState>
       <BottomBar activeTab="4_settings" />
     </>

diff --git a/web/components/BottomBar.tsx b/web/components/BottomBar.tsx
@@ -36,7 +36,13 @@ function BottomBarCell({
 export default function BottomBar(props: Props) {
   const { activeTab } = props;
   return (
-    <div className="fixed bottom-0 z-30 flex h-12 w-full flex-row items-center justify-around border-gray-200 border-t bg-white">
+    <div
+      className="fixed bottom-0 z-30 flex w-full flex-row items-center justify-around border-gray-200 border-t bg-white"
+      style={{
+        height: "calc(3rem + env(safe-area-inset-bottom))",
+        paddingBottom: "env(safe-area-inset-bottom)",
+      }}
+    >
       <BottomBarCell
         href="/home"
         iconComponent={

diff --git a/web/package.json b/web/package.json
@@ -6,6 +6,7 @@
   "scripts": {
     "dev": "next dev -p 5173",
     "build": "next build",
+    "postbuild": "find ./out -type f \\( -name \"*.html\" -o -name \"*.txt\" \\) -exec sed -E -i 's/(width=device-width, initial-scale=1)([^,])/\\1, viewport-fit=cover\\2/g' {} +",
     "preview": "next start"
   },
   "dependencies": {

diff --git a/web/public/icon-192x192.png b/web/public/icon-192x192.png
diff --git a/web/public/icon-512x512.png b/web/public/icon-512x512.png