fix

Author: Yokomi422

biome.jsonc

@@ -10,7 +10,8 @@
     "includes": [
       "**/*",
       "!packages/class_data/data/**",
-      "!packages/web/src/app/globals.css"
+      "!packages/web/src/app/globals.css",
+      "!packages/web/src/styles/globals.css"
     ]
   },
   "formatter": {

packages/web/src/App.tsx

@@ -1,19 +1,18 @@
 import { useState } from "react";
-import { BrowserRouter, Routes, Route } from "react-router-dom";
+import { BrowserRouter, Route, Routes } from "react-router-dom";
 
 import { ThemeContext } from "@/app/context";
 import type { RegisterType, ThemeType } from "@/app/type";
 import { UserContext, type UserContextValue } from "@/app/UserContext";
 import { User } from "@/app/utils/user";
 import Footer from "./app/components/Footer";
 import Header from "./app/components/Header";
-
-import Home from "./pages/Home";
 import AboutUs from "./pages/AboutUs";
 import Disclaimer from "./pages/Disclaimer";
+import Home from "./pages/Home";
 import HowToUse from "./pages/HowToUse";
-import Notion from "./pages/Notion";
 import NotFound from "./pages/NotFound";
+import Notion from "./pages/Notion";
 
 /**
  * App コンポーネントは、アプリケーション全体のレイアウトを定義します。
@@ -46,7 +45,9 @@ export default function App() {
   return (
     <ThemeContext.Provider value={{ theme, setTheme }}>
       <UserContext.Provider value={userContextValue}>
-        <div className={`bg-surface-container text-text-default ${theme} min-h-screen`}>
+        <div
+          className={`bg-surface-container text-text-default ${theme} min-h-screen`}
+        >
           <BrowserRouter>
             <div className="overscroll-none min-width-[300px] pt-12 pb-12">
               <Header />
@@ -65,4 +66,4 @@ export default function App() {
       </UserContext.Provider>
     </ThemeContext.Provider>
   );
-}
+}

packages/web/src/main.tsx

@@ -1,10 +1,15 @@
-import React from 'react'
-import ReactDOM from 'react-dom/client'
-import App from './App'
-import './styles/globals.css'
+import React from "react";
+import ReactDOM from "react-dom/client";
+import App from "./App";
+import "./styles/globals.css";
 
-ReactDOM.createRoot(document.getElementById('root')!).render(
+const rootElement = document.getElementById("root");
+if (!rootElement) {
+  throw new Error("Failed to find the root element");
+}
+
+ReactDOM.createRoot(rootElement).render(
   <React.StrictMode>
     <App />
   </React.StrictMode>,
-)
+);

packages/web/src/pages/Home.tsx

@@ -11,7 +11,9 @@ export default function Home(): React.ReactElement {
   return (
     <>
       {/* バックグラウンド画像 */}
-      <div className={`absolute right-0 bottom-0 w-[800px] h-full overflow-hidden`}>
+      <div
+        className={`absolute right-0 bottom-0 w-[800px] h-full overflow-hidden`}
+      >
         <img
           className="opacity-40 object-cover w-full h-full"
           src={"/backgroundImage.png"}
@@ -25,9 +27,7 @@ export default function Home(): React.ReactElement {
           {/* タイトル */}
           <div className="relative flex justify-center items-center rounded-lg">
             {/* ロゴ(解像度に応じてサイズを変える) */}
-            <div
-              className={`w-[100px] h-[100px] md:w-[150px] md:h-[150px]`}
-            >
+            <div className={`w-[100px] h-[100px] md:w-[150px] md:h-[150px]`}>
               <img
                 src={Logo}
                 alt="Logo"

packages/web/src/pages/HowToUseItem.tsx

@@ -143,4 +143,4 @@ export const IndentLi: React.FC<
   } & ComponentProps<"li">
 > = ({ children, ...prop }) => {
   return <li className={`pl-5 -indent-5 ${prop.className}`}>{children}</li>;
-};
+};

packages/web/src/vite-env.d.ts

@@ -1,9 +1,9 @@
 /// <reference types="vite/client" />
 
 interface ImportMetaEnv {
-  readonly VITE_MODE: string
+  readonly VITE_MODE: string;
 }
 
 interface ImportMeta {
-  readonly env: ImportMetaEnv
-}
+  readonly env: ImportMetaEnv;
+}

packages/web/vite.config.ts

@@ -1,15 +1,15 @@
-import { defineConfig } from 'vite'
-import react from '@vitejs/plugin-react'
-import path from 'path'
+import path from "node:path";
+import react from "@vitejs/plugin-react";
+import { defineConfig } from "vite";
 
 export default defineConfig({
   plugins: [react()],
   resolve: {
     alias: {
-      '@': path.resolve(__dirname, './src'),
+      "@": path.resolve(__dirname, "./src"),
     },
   },
   server: {
     port: 3000,
   },
-})
+});