Merge branch 'main' into nextjs

src/components/NeoFetch.tsx

@@ -8,19 +8,19 @@ export default function NeoFetch() {
   const wakaTimeData = useWakaTimeData();
 
   return (
-    <div>
+    <div className="w-full bg-[#191017] text-[#fcf8f9] font-[Google Sans Code] rounded-b-4xl">
       <div className="flex flex-col md:flex-row">
         <iframe
-          src="https://f.imnya.ng/.art.html"
-          className="border-0 w-[430px] h-[430px] scale-75"
+          src="/art.html"
+          className="border-0 min-w-[430px] min-h-[430px] scale-75"
         ></iframe>
-        <div className="px-12 md:py-12 text-lg font-mono">
+        <div className="px-12 md:py-12 text-lg">
           <a href="mailto:contact@imnya.ng" className="text-[#FFD7D7]">
-            imnyang<span className="text-foreground">@</span>adofai.gg
+            imnyang<span className="text-[#fcf8f9]">@</span><a href="https://adofai.gg">adofai.gg</a>
           </a>
           <p>----------</p>
 
-          <p className="text-foreground">
+          <p>
             <span className="text-[#FFD7D7]">Uptime</span>:{" "}
             {(() => {
               const startDate = new Date("2010-11-08T00:00:00+09:00");
@@ -39,12 +39,12 @@ export default function NeoFetch() {
             })()}
           </p>
 
-          <p className="text-foreground">
+          <p>
             <span className="text-[#FFD7D7]">Experience</span>:{" "}
             {Object.values(events).flat().length}
           </p>
 
-          <p className="text-foreground">
+          <p>
             <span className="text-[#FFD7D7]">WakaTime</span>:{" "}
             {wakaTimeData?.data?.total_seconds_including_other_language
               ? (() => {
@@ -59,7 +59,7 @@ export default function NeoFetch() {
               : "N/A"}
           </p>
 
-          <p className="text-foreground">
+          <p>
             <span className="text-[#FFD7D7]">Most used Language</span>:{" "}
             {wakaTimeData?.data?.languages[0]?.name || "N/A"}{" "}
             {wakaTimeData?.data?.languages[0]?.total_seconds
@@ -79,29 +79,29 @@ export default function NeoFetch() {
             <span className="text-[#FFD7D7]">Terminal</span>: {ipData}
           </p>
 
-          <p className="text-foreground">
+          <p>
             <span className="text-[#FFD7D7]">Locale</span>: ko_KR.UTF-8
           </p>
 
           <br />
-          <div id="color" className="grid grid-cols-8 w-fit">
-            <p className="bg-background w-8">⠀⠀</p>
-            <p className="bg-[#f38ba8] w-8">⠀⠀</p>
-            <p className="bg-[#a6e3a1] w-8">⠀⠀</p>
-            <p className="bg-[#f9e2af] w-8">⠀⠀</p>
-            <p className="bg-[#89b4fa] w-8">⠀⠀</p>
-            <p className="bg-[#f5c2e7] w-8">⠀⠀</p>
-            <p className="bg-[#94e2d5] w-8">⠀⠀</p>
-            <p className="bg-muted-foreground w-8">⠀⠀</p>
+          <div id="color" className="grid grid-cols-8 w-fit pb-8">
+            <div className="bg-[#191017] min-w-8">　</div>
+            <div className="bg-[#f38ba8] min-w-8"></div>
+            <div className="bg-[#a6e3a1] min-w-8"></div>
+            <div className="bg-[#f9e2af] min-w-8"></div>
+            <div className="bg-[#89b4fa] min-w-8"></div>
+            <div className="bg-[#f5c2e7] min-w-8"></div>
+            <div className="bg-[#94e2d5] min-w-8"></div>
+            <div className="bg-muted-foreground min-w-8"></div>
 
-            <p className="bg-[#45475a] w-8">⠀⠀</p>
-            <p className="bg-[#f0c0cd] w-8">⠀⠀</p>
-            <p className="bg-[#c3e9bf] w-8">⠀⠀</p>
-            <p className="bg-[#f0e0bf] w-8">⠀⠀</p>
-            <p className="bg-[#c3d9fd] w-8">⠀⠀</p>
-            <p className="bg-[#f8d2ee] w-8">⠀⠀</p>
-            <p className="bg-[#b1faee] w-8">⠀⠀</p>
-            <p className="bg-foreground w-8">⠀⠀</p>
+            <div className="bg-[#45475a] min-w-8">　</div>
+            <div className="bg-[#f0c0cd] min-w-8"></div>
+            <div className="bg-[#c3e9bf] min-w-8"></div>
+            <div className="bg-[#f0e0bf] min-w-8"></div>
+            <div className="bg-[#c3d9fd] min-w-8"></div>
+            <div className="bg-[#f8d2ee] min-w-8"></div>
+            <div className="bg-[#b1faee] min-w-8"></div>
+            <div className="bg-[#fcf8f9] min-w-8"></div>
           </div>
         </div>
       </div>

src/components/Projects.tsx

@@ -0,0 +1,55 @@
+import { SquareArrowOutUpRight } from 'lucide-react';
+
+{/* <a href="https://www.youtube.com/playlist?list=PLZeYZotn5_IOJDek6e35NKzUtJm09yxZD">Effect Playing Contest 2025 Broadcast Develop</a><br />
+<a href="https://github.com/imnyang/today.isangjeong">today.isangjeong</a> */}
+
+const projects = [
+  {
+    name: 'EPC 2025 Broadcast Manager',
+    url: 'https://github.com/NY0510/slunchv2',
+    desc: '얼불춤 끼얏호우',
+    detail: '달성이 주관하고 ADOFAI.gg가 공동 주최하는 Effect Playing Contest 2025 방송 화면의 대부분의 기능을 개발하였습니다.',
+    tags: ['React', 'ElysiaJS'],
+  },
+  {
+    name: '@today.isangjeong',
+    url: 'https://instagram.com/today.isangjeong',
+    desc: '인스타에서 급식 공유를 간편하게',
+    detail: '오늘의 급식을 사진으로 공유하는 인스타그램 계정입니다. 매일 학교 급식을 자동으로 정리하여 제공합니다.',
+    tags: ['TypeScript', '자체 개발 Instagram Library', '@napi-rs/canvas'],
+  },
+];
+
+export default function Projects() {
+  return (
+    <section className="break-keep break-words w-full md:w-1/2">
+      <div className="space-y-8">
+        {projects.map((project, idx) => (
+          <div className="space-y-2" key={idx}>
+            <div className="space-y-1">
+              <div className="flex justify-between items-center gap-y-2 gap-x-4">
+                {project.url ? (
+                  <a href={project.url} target="_blank" rel="noopener noreferrer" className="text-lg text-nowrap items-center gap-x-2 flex flex-row">
+                    {project.name}
+                    <SquareArrowOutUpRight size={16} />
+                  </a>
+                ) : (
+                  <span className="text-lg font-medium">{project.name}</span>
+                )}
+                <span className="text-sm text-muted-foreground text-nowrap">{project.desc}</span>
+              </div>
+              <div>
+                <p className="text-sm text-muted-foreground">{project.detail}</p>
+              </div>
+            </div>
+            <div className="flex gap-2 *:bg-muted *:px-2 *:py-0.5 *:rounded *:text-xs *:font-medium *:text-muted-foreground">
+              {project.tags.map((tag, i) => (
+                <span key={i}>{tag}</span>
+              ))}
+            </div>
+          </div>
+        ))}
+      </div>
+    </section>
+  );
+}

src/components/SUPERCOMMAND.tsx

@@ -0,0 +1,90 @@
+"use client";
+import React from "react";
+import { Button } from "@/components/ui/button"
+import {
+    Dialog,
+    DialogClose,
+    DialogContent,
+    DialogDescription,
+    DialogFooter,
+    DialogHeader,
+    DialogTitle,
+} from "@/components/ui/dialog"
+
+export default function SUPERCOMMAND() {
+    const [keySequence, setKeySequence] = React.useState("");
+    const [showDialog, setShowDialog] = React.useState(false);
+    const targetSequence = "MAGICALWORLD";
+
+    const handleKeyDown = (event: KeyboardEvent) => {
+        // 영문자만 처리
+        if (event.key.length === 1 && /[a-zA-Z]/.test(event.key)) {
+            console.log(keySequence);
+            console.log(targetSequence);
+            console.log("Key pressed:", event.key);
+            setKeySequence(prev => {
+                const newSequence = prev + event.key;
+                console.log("New sequence:", newSequence);
+
+                // 목표 시퀀스와 정확히 일치하는지 확인 (대문자만)
+                if (newSequence === targetSequence) {
+                    console.log("Sequence matched!");
+                    setShowDialog(true);
+                    return "";
+                }
+
+                // 목표 시퀀스의 시작 부분과 일치하는지 확인 (대문자만)
+                if (targetSequence.startsWith(newSequence)) {
+                    return newSequence;
+                }
+
+                // 일치하지 않으면 현재 키부터 다시 시작
+                const restartSequence = event.key;
+                if (targetSequence.startsWith(restartSequence)) {
+                    return restartSequence;
+                }
+
+                // 완전히 초기화
+                return "";
+            });
+        } else {
+            // 특수키나 숫자가 입력되면 시퀀스 초기화
+            setKeySequence("");
+        }
+    };
+
+    React.useEffect(() => {
+        window.addEventListener("keydown", handleKeyDown);
+        return () => {
+            window.removeEventListener("keydown", handleKeyDown);
+        };
+    }, []);
+
+    return (
+        <Dialog open={showDialog} onOpenChange={setShowDialog}>
+            <DialogContent className="flex flex-col gap-0 p-0 sm:max-h-[min(640px,80vh)] sm:max-w-lg [&>button:last-child]:top-3.5">
+                <DialogHeader className="contents space-y-0 text-left">
+                    <DialogTitle className="border-b px-6 py-4 text-base">
+                        ???
+                    </DialogTitle>
+                    <div className="overflow-y-auto">
+                        <DialogDescription asChild>
+                            <div className="px-6 py-4">
+                                <div className="[&_strong]:text-foreground space-y-4 [&_strong]:font-semibold pb-32">
+                                    <p style={{ whiteSpace: 'pre-line' }}>{`지금바로 윤회!`}
+                                    </p>
+                                </div>
+                            </div>
+                        </DialogDescription>
+                        <DialogFooter className="px-6 py-6 sm:justify-start fixed bottom-0 left-0 w-full bg-background/80 backdrop-blur-sm">
+                            <Button type="button" onClick={() => {
+                                document.cookie = "MagicalGirl=true; path=/";
+                                setShowDialog(false);
+                            }}>Okay</Button>
+                        </DialogFooter>
+                    </div>
+                </DialogHeader>
+            </DialogContent>
+        </Dialog>
+    );
+}

src/components/Top.tsx

@@ -62,10 +62,10 @@ export default function Top() {
     <section
       id="top"
       className="snap-start h-screen w-full relative"
-      onWheel={(e) => {
-        e.preventDefault();
-        window.scrollBy(0, window.innerHeight * (e.deltaY > 0 ? 1 : -1));
-      }}
+      // onWheel={(e) => {
+      //   e.preventDefault();
+      //   window.scrollBy(0, window.innerHeight * (e.deltaY > 0 ? 1 : -1));
+      // }}
     >
       <Sidebar />
       <div

src/components/timeline.tsx

@@ -25,7 +25,7 @@ export default function TimelineComponent() {
   return (
     <div
       id="timeline"
-      className="w-full flex flex-col items-center justify-center px-12 mt-8"
+      className="w-full md:w-1/2 flex flex-col items-center justify-center px-12 mt-8"
     >
       <div className="w-full">
         <h1 className="text-2xl font-bold mb-4 w-full">🌠 수상 및 교육</h1>