Merge pull request #3 from ItsukiKigoshi/add-curation

Add curation

package.json

@@ -9,21 +9,23 @@
     "lint": "next lint"
   },
   "dependencies": {
-    "@emotion/react": "^11.11.1",
-    "@emotion/styled": "^11.11.0",
-    "@fontsource/roboto": "^5.0.8",
-    "@mui/icons-material": "^5.14.18",
-    "@mui/material": "^5.14.18",
-    "next": "14.0.3",
-    "react": "^18",
-    "react-dom": "^18"
+    "@emotion/cache": "^11.13.1",
+    "@emotion/react": "^11.13.0",
+    "@emotion/styled": "^11.13.0",
+    "@fontsource/roboto": "^5.0.13",
+    "@mui/icons-material": "^5.16.6",
+    "@mui/material": "^5.16.6",
+    "@mui/material-nextjs": "^5.16.6",
+    "next": "14.2.5",
+    "react": "^18.3.1",
+    "react-dom": "^18.3.1"
   },
   "devDependencies": {
-    "@types/node": "^20",
-    "@types/react": "^18",
-    "@types/react-dom": "^18",
-    "eslint": "^8",
-    "eslint-config-next": "14.0.3",
-    "typescript": "^5"
+    "@types/node": "^22.0.2",
+    "@types/react": "^18.3.3",
+    "@types/react-dom": "^18.3.0",
+    "eslint": "^9.8.0",
+    "eslint-config-next": "14.2.5",
+    "typescript": "^5.5.4"
   }
 }

src/app/curation/page.tsx

@@ -0,0 +1,5 @@
+import React from "react";
+
+export default function App() {
+  return <div>page</div>;
+}

src/app/template.tsx

@@ -0,0 +1,23 @@
+"use client";
+import { createTheme, ThemeProvider, useMediaQuery } from "@mui/material";
+import { AppRouterCacheProvider } from "@mui/material-nextjs/v13-appRouter";
+import React from "react";
+
+export default function Template({ children }: { children: React.ReactNode }) {
+  const prefersDarkMode = useMediaQuery("(prefers-color-scheme: dark)");
+
+  const theme = React.useMemo(
+    () =>
+      createTheme({
+        palette: {
+          mode: prefersDarkMode ? "dark" : "light",
+        },
+      }),
+    [prefersDarkMode]
+  );
+  return (
+    <AppRouterCacheProvider>
+      <ThemeProvider theme={theme}>{children}</ThemeProvider>
+    </AppRouterCacheProvider>
+  );
+}

src/components/Main.tsx

@@ -1,12 +1,12 @@
 import GitHubIcon from "@mui/icons-material/GitHub";
 import InstagramIcon from "@mui/icons-material/Instagram";
 import LinkedInIcon from "@mui/icons-material/LinkedIn";
-import PodcastsIcon from "@mui/icons-material/Podcasts";
-import XIcon from "@mui/icons-material/X";
 import {
   Avatar,
   Box,
   Button,
+  Card,
+  CardContent,
   IconButton,
   Stack,
   Typography,
@@ -24,16 +24,6 @@ export default function Main() {
       Icon: InstagramIcon,
       href: "https://www.instagram.com/itsukikigoshi",
     },
-    {
-      name: "X",
-      Icon: XIcon,
-      href: "https://www.x.com/itsukikigoshi",
-    },
-    {
-      name: "Podcast",
-      Icon: PodcastsIcon,
-      href: "https://podcasters.spotify.com/pod/show/n-dimensions",
-    },
   ];
 
   const linkButtons = links.map((link) => (
@@ -52,7 +42,8 @@ export default function Main() {
     <Box
       sx={{
         display: "grid",
-        placeItems: "center", // Center the content horizontally and vertically
+        placeItems: "center",
+        py: "2px",
       }}
     >
       <Stack
@@ -71,7 +62,7 @@ export default function Main() {
         <Typography sx={{ fontSize: 28 }}>Itsuki KIGOSHI</Typography>
         <Typography>{`ICU '27 (2004)`}</Typography>
       </Stack>
-      <Stack useFlexGap spacing={1}>
+      <Stack spacing={1}>
         <Button
           startIcon={<LinkedInIcon />}
           variant="contained"
@@ -80,10 +71,66 @@ export default function Main() {
         >
           Open to Work!
         </Button>
-        <Stack direction="row" spacing={2} alignItems="flex-end">
+        <Stack sx={{ justifyContent: "center" }} direction="row" spacing={2}>
           {linkButtons}
         </Stack>
       </Stack>
+      {/* <Stack>
+        <Card>
+          <CardContent>
+            <h2>
+              Hi there 👋 I'm NOT an engineer but wanna be a creator/artist.
+            </h2>
+            <h3>🔭I’m currently thinking of creating...</h3>
+            <ul>
+              <li>
+                <a href="https://github.com/ItsukiKigoshi/open-desk-view">
+                  open-desk-view
+                </a>
+                : Open-sourced webcam tool for easily showing docs on ur table
+                in online meetings like{" "}
+                <a href="https://support.apple.com/en-gb/guide/mac-help/mchl06927be8/mac">
+                  Apple's 'Desk View'
+                </a>
+                .
+              </li>
+              <li>
+                <a href="https://github.com/ItsukiKigoshi/icu-catalogue">
+                  ICU Catalogue
+                </a>
+                : Powerful syllabi search engine and academic planning tool for
+                ICU students.
+              </li>
+              <li>
+                <a href="https://github.com/ItsukiKigoshi/shinonome-bunko">
+                  Shinonome Bunko
+                </a>
+                : Automated git-based OCR&peer-review platform for publishing
+                public domain Japanese literature as e-books.
+              </li>
+              <li>
+                <a href="https://github.com/ItsukiKigoshi/curhythm">Curhythm</a>
+                : Rubik's Cube-alike musical instrument to generate beat,
+                melody, harmony & video.
+              </li>
+              <li>
+                OpenPoliCash: Git-based open-source 政治資金収支報告書 database
+                with an Open Data
+              </li>
+            </ul>
+            <h3>🎈My dream is...</h3>
+            <ul>
+              <li>
+                Collaborating with <a href="https://zutomayo.net">Zutomayo</a>{" "}
+                as an artist🦔.
+              </li>
+              <li>Holding a museum exhibition as a contemporary artist🎨.</li>
+            </ul>
+            <h3>📫 How to reach me:</h3>
+            <p>itsukikigoshi+github[at]gmail.com</p>
+          </CardContent>
+        </Card>
+      </Stack> */}
     </Box>
   );
 }