Merge pull request #3 from nkc-ug/develop

09/28 Developからmainへマージ
nkc-ug · Sep 28, 2024 · d46a5df · d46a5df
2 parents f5d39c0 + a60c359
commit d46a5df
Show file tree

Hide file tree

Showing 20 changed files with 444 additions and 89 deletions.
diff --git a/README.md b/README.md
@@ -1,50 +1 @@
-# React + TypeScript + Vite
-
-This template provides a minimal setup to get React working in Vite with HMR and some ESLint rules.
-
-Currently, two official plugins are available:
-
-- [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh
-- [@vitejs/plugin-react-swc](https://github.com/vitejs/vite-plugin-react-swc) uses [SWC](https://swc.rs/) for Fast Refresh
-
-## Expanding the ESLint configuration
-
-If you are developing a production application, we recommend updating the configuration to enable type aware lint rules:
-
-- Configure the top-level `parserOptions` property like this:
-
-```js
-export default tseslint.config({
-  languageOptions: {
-    // other options...
-    parserOptions: {
-      project: ['./tsconfig.node.json', './tsconfig.app.json'],
-      tsconfigRootDir: import.meta.dirname,
-    },
-  },
-})
-```
-
-- Replace `tseslint.configs.recommended` to `tseslint.configs.recommendedTypeChecked` or `tseslint.configs.strictTypeChecked`
-- Optionally add `...tseslint.configs.stylisticTypeChecked`
-- Install [eslint-plugin-react](https://github.com/jsx-eslint/eslint-plugin-react) and update the config:
-
-```js
-// eslint.config.js
-import react from 'eslint-plugin-react'
-
-export default tseslint.config({
-  // Set the react version
-  settings: { react: { version: '18.3' } },
-  plugins: {
-    // Add the react plugin
-    react,
-  },
-  rules: {
-    // other rules...
-    // Enable its recommended rules
-    ...react.configs.recommended.rules,
-    ...react.configs['jsx-runtime'].rules,
-  },
-})
-```
+# NKC-UG 公式サイト用リポジトリ
diff --git a/index.html b/index.html
@@ -2,8 +2,25 @@
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
-    <link rel="icon" type="image/svg+xml" href="/vite.svg" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta
+      content="名古屋工学院専門学校公認プログラミングサークル「NKC-UG」の公式サイトです。"
+      name="description"
+    />
+    <meta property="og:title" content="NKC-UG公式サイト" />
+    <meta property="og:url" content="website" />
+    <meta property="og:description" content="https://nkc-ug.github.io/" />
+    <meta
+      property="og:site_name"
+      content="名古屋工学院専門学校公認プログラミングサークル「NKC-UG」の公式サイトです。"
+    />
+    <meta property="og:image" content="NKC-UG公式サイト" />
+    <link rel="icon" href="/favicon.ico" id="favicon" />
+    <link
+      rel="apple-touch-icon"
+      sizes="180x180"
+      href="/apple-touch-icon-180x180.png"
+    />
     <title>NKC-UG公式サイト</title>
   </head>
   <body>

diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -14,9 +14,11 @@
     "@emotion/styled": "^11.13.0",
     "@mui/icons-material": "^6.1.1",
     "@mui/material": "^6.1.1",
+    "hamburger-react": "^2.5.1",
     "normalize.css": "^8.0.1",
     "react": "^18.3.1",
-    "react-dom": "^18.3.1"
+    "react-dom": "^18.3.1",
+    "react-router-dom": "^6.26.2"
   },
   "devDependencies": {
     "@eslint/js": "^9.9.0",

diff --git a/public/Thumbnail.jpg b/public/Thumbnail.jpg
diff --git a/public/apple-touch-icon-180x180.png b/public/apple-touch-icon-180x180.png
diff --git a/public/favicon.ico b/public/favicon.ico
diff --git a/public/vite.svg b/public/vite.svg
diff --git a/src/App.tsx b/src/App.tsx
@@ -1,7 +1,7 @@
-import { Toppage } from "./pages/Toppage";
+import { Routers } from "./routes/Routers";
 
 function App() {
-  return <Toppage />;
+  return <Routers />;
 }
 
 export default App;
diff --git a/src/assets/react.svg b/src/assets/react.svg
diff --git a/src/components/AccountList.tsx b/src/components/AccountList.tsx
diff --git a/src/components/CodeOfConduct.tsx b/src/components/CodeOfConduct.tsx
@@ -1,4 +1,4 @@
-import { Box, List, ListItem, Typography } from "@mui/material";
+import { Box, Link, List, ListItem, Typography } from "@mui/material";
 
 //行動規範
 export const CodeOfConduct = () => {
@@ -43,6 +43,51 @@ export const CodeOfConduct = () => {
           </ListItem>
         </List>
       </Box>
+      <Box sx={{ padding: 2 }}>
+        <Typography variant="h5">アンチハラスメントポリシー</Typography>
+        <Typography>
+          イベントに参加するみなさんは以下のポリシーを遵守するように心がけて
+          ください。
+          <br />
+          ハラスメント行為には下記のことが含まれますが、これらに限定はされません。
+        </Typography>
+        <List sx={{ width: "fit-content", margin: "auto" }}>
+          <ListItem>
+            社会的構造などの不適切なコメント（性別、性同一性と表現、性的指向、障がい、身体的
+            外観、体格、人種、年齢、宗教）
+          </ListItem>
+          <ListItem>脅迫、つきまとい、ストーカー行為</ListItem>
+          <ListItem>不適切な画像、動画、録音。またはその再生</ListItem>
+          <ListItem>
+            発表やその他のイベントに対する妨害行為 不適切な身体的接触
+          </ListItem>
+          <ListItem>
+            特定の技術・サービス・企業・個人に対する否定や誹謗中傷など攻撃的な発言や行為
+          </ListItem>
+          <ListItem>上記の行動のいずれかを支持または奨励する行為</ListItem>
+        </List>
+        <Typography>
+          スポンサーや登壇者、主催スタッフもこのポリシーの対象となります。
+          <br />
+          ポリシーに違反する言葉や
+          画像などのメディアはいかなる発表やワークショップ、Twitterのようなオンラインメディアにおいて
+          も不適切です。
+          <br />
+          ※もしハラスメントを受けていると感じたり、他の誰かがハラスメントされていることに気がついた
+          場合、または他に何かお困りのことがあれば、すぐに運営までご連絡ください。
+          <br />
+          運営で迅速に適切
+          な対応をとり、みなさんが安心してコミュニティイベントに参加できるよう最善を尽くします。
+          <br />
+          連絡先：
+          <Link href="mailto:[email protected]">[email protected] </Link>
+          (NKC-UG運営)
+        </Typography>
+        <Typography>
+          このアンチハラスメントポリシーは「Geek Feminism
+          Wiki」を元に作成しています
+        </Typography>
+      </Box>
     </Box>
   );
 };
diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx
@@ -5,9 +5,13 @@ export const Footer = () => {
     <AppBar
       component="footer"
       position="static"
-      sx={{ backgroundColor: "rgb(192,192,192)" }}
+      sx={{
+        padding: 2,
+        backgroundColor: "rgb(192,192,192)",
+        marginTop: "auto",
+      }}
     >
-      <Container maxWidth="md">
+      <Container>
         <Box sx={{ textAlign: "center" }}>
           <Typography variant="caption">©2024 NKC-UG</Typography>
         </Box>

diff --git a/src/components/Header.tsx b/src/components/Header.tsx
@@ -1,32 +1,107 @@
 // src/components/Header.jsx
 import AppBar from "@mui/material/AppBar";
 import Toolbar from "@mui/material/Toolbar";
-import { Box, Link } from "@mui/material";
+import { Box, Button, Drawer, Link } from "@mui/material";
 import nkcugLogo from "../assets/NKCUG_DP.svg";
+import { Divide as Hamburger } from "hamburger-react";
+import { useState } from "react";
+import { useNavigate } from "react-router-dom";
 
 export const Header = () => {
+  const [isOpen, setOpen] = useState(false);
+  const nav = useNavigate();
+  const PAGE_LINK = [
+    { name: "トップへ", link: "/" },
+    { name: "本サイトについて", link: "/SiteAbout" },
+    { name: "アカウント一覧", link: "/Account" },
+    { name: "イベント一覧", link: "/Event" },
+    { name: "入部希望者向け", link: "/Welcome" },
+  ];
   return (
     <AppBar
       position="static"
-      sx={{ padding: 0, backgroundColor: "rgb(192,192,192)" }}
+      sx={{
+        padding: 0,
+        backgroundColor: "rgb(192,192,192)",
+        textAlign: "left",
+      }}
     >
       <Toolbar>
-        <Link href="/" color="inherit" underline="none" sx={{ flexGrow: 1 }}>
+        <Link
+          href="/"
+          color="inherit"
+          underline="none"
+          sx={{
+            flexGrow: 1,
+          }}
+        >
           <Box
             component="img"
             src={nkcugLogo}
             alt="NKC-UG Logo"
             style={{ height: "40px" }}
           />
         </Link>
-        <Link
-          href="https://linktr.ee/nkc_ug"
-          color="inherit"
-          underline="none"
-          target="_blank"
+        <Box
+          sx={{
+            "@media screen and (max-width:930px)": {
+              display: "none",
+            },
+          }}
         >
-          Account
-        </Link>
+          {PAGE_LINK.map((value, key) => {
+            return (
+              <Button
+                onClick={() => {
+                  nav(value.link);
+                }}
+                sx={{
+                  padding: 2,
+                  color: "rgb(255,255,255)",
+                }}
+                key={key}
+              >
+                {value.name}
+              </Button>
+            );
+          })}
+        </Box>
+        <Box
+          sx={{
+            "@media screen and (min-width:931px)": {
+              display: "none",
+            },
+          }}
+        >
+          <Hamburger toggled={isOpen} toggle={setOpen} />
+          <Drawer
+            open={isOpen}
+            anchor="right"
+            sx={{
+              "@media screen and (min-width:931px)": {
+                display: "none",
+              },
+            }}
+          >
+            <Hamburger toggled={isOpen} toggle={setOpen} />
+            {PAGE_LINK.map((value, key) => {
+              return (
+                <Button
+                  onClick={() => {
+                    nav(value.link);
+                  }}
+                  sx={{
+                    margin: 3,
+                    color: "rgb(0,0,0)",
+                  }}
+                  key={key}
+                >
+                  {value.name}
+                </Button>
+              );
+            })}
+          </Drawer>
+        </Box>
       </Toolbar>
     </AppBar>
   );