From 251b71787b838d31703175e7d4d7c6b8043ab9c2 Mon Sep 17 00:00:00 2001 From: imnyang Date: Thu, 15 Aug 2024 09:18:17 +0900 Subject: [PATCH] Development Commit --- bun.lockb | Bin 343836 -> 343836 bytes src/App.tsx | 63 ++++++++++++------------------------- src/component/Help.css | 33 -------------------- src/component/help.tsx | 65 -------------------------------------- src/index.css | 11 ++++--- src/pages/Root.css | 41 +++++++++++++++++------- src/pages/Root.tsx | 69 ++++++++++++++++++----------------------- src/pages/Timeline.tsx | 1 - 8 files changed, 88 insertions(+), 195 deletions(-) mode change 100644 => 100755 bun.lockb delete mode 100644 src/component/Help.css delete mode 100644 src/component/help.tsx diff --git a/bun.lockb b/bun.lockb old mode 100644 new mode 100755 index b901f1543ba2083d7e2d349bd81cf8d4bccbab54..f8617239a84d4f5ab160db686e4864271b1d212e GIT binary patch delta 53 zcmbR9Ph`$Nk%kt=7N#xCqJEr=afXI^h6Z{D(+m8W#iyJ4F;8P>j5F6W&@*Vi { + const keySequence: string[] = []; + const targetSequence = 'furry'; + const handleKeyDown = (event: KeyboardEvent) => { - // 단일 키 입력 감지 - console.log(`Key: ${event.key} with keycode ${event.keyCode} has been pressed`); - console.log(`KeySquare: ${keySequence.join('')}`); - // 특정 문자열 시퀀스 감지 - keySequence.push(event.key); - if (keySequence.length > targetSequence.length) { - keySequence.shift(); - } - - - if (event.key === 'm') { - console.log('Get mail'); - document.location.href = 'mailto:me@imnyang.xyz'; - } - if (event.key === 'g') { - console.log('Get Github'); - document.location.href = 'https://github.com/imnyang'; - } - if (event.key === 'b') { - console.log('Get Github'); - document.location.href = 'https://blog.imnyang.xyz'; - } - if (event.key === 't') { - console.log('Get Timeline'); - document.location.href = 'https://imnyang.xyz/timeline'; - } - if (event.key === 'i') { - console.log('Get isangjeong.today'); - document.location.href = 'https://instagram.com/isangjeong.today'; - } - - if (keySequence.join('') === targetSequence) { - console.log('Furry sequence detected!'); - document.location.href = 'https://ny64.kr?from=imnyang_root_page'; - } + // 단일 키 입력 감지 + console.log(`Key: ${event.key} with keycode ${event.keyCode} has been pressed`); + console.log(`KeySquare: ${keySequence.join('')}`); + // 특정 문자열 시퀀스 감지 + keySequence.push(event.key); + if (keySequence.length > targetSequence.length) { + keySequence.shift(); + } + if (keySequence.join('') === targetSequence) { + console.log('Furry sequence detected!'); + document.location.href = 'https://ny64.kr?from=imnyang_root_page'; + } }; - + document.addEventListener('keydown', handleKeyDown); - + return () => { - document.removeEventListener('keydown', handleKeyDown); + document.removeEventListener('keydown', handleKeyDown); }; - }, [keySequence]); - + }, []); + return ( <> diff --git a/src/component/Help.css b/src/component/Help.css deleted file mode 100644 index 91f4731..0000000 --- a/src/component/Help.css +++ /dev/null @@ -1,33 +0,0 @@ -.Help { - display: none; - flex-direction: column; - align-items: flex-start; - justify-content: flex-start; - width: 50vw; - height: 50vh; - background-color: #141414; - border: 1px solid #fff; - border-radius: 10px; - z-index: 10; - position: fixed; - padding: 50px; -} - -.Help.visible { - display: flex; -} - -.key_container { - display: flex; - flex-direction: row; - align-items: center; - justify-content: space-between; - gap: 20px; - margin-bottom: 20px; -} - -.key { - background-color: #000000; - border-radius: 5px; - padding: 10px; -} \ No newline at end of file diff --git a/src/component/help.tsx b/src/component/help.tsx deleted file mode 100644 index 407e3b8..0000000 --- a/src/component/help.tsx +++ /dev/null @@ -1,65 +0,0 @@ -import { useEffect, useState } from 'react'; -import './Help.css'; -import Draggable from 'react-draggable'; - -export default function Help() { - const [isVisible, setIsVisible] = useState(false); - - useEffect(() => { - const handleKeyDown = (event: KeyboardEvent) => { - if (event.key === 'F1') { - event.preventDefault(); - setIsVisible(!isVisible); - console.log('Help!'); - } - if (event.key === 'Escape') { - setIsVisible(false); - console.log('Help!'); - } - }; - document.addEventListener('keydown', handleKeyDown); - - return () => { - document.removeEventListener('keydown', handleKeyDown); - }; - }, [isVisible]); - - return ( - -
-

Help

-
-

-

-

F1

-

Help

-
-
-

l

-

Change nameIndex

-
- -
-

furry

-

Show Furry

-
-

-

-

-

m

-

Mailto

-
-
-

g

-

Github

-
-
-

b

-

Blog

-
-

-
-
- - ); -} \ No newline at end of file diff --git a/src/index.css b/src/index.css index 8310fc1..90119a7 100644 --- a/src/index.css +++ b/src/index.css @@ -11,7 +11,7 @@ color-scheme: light dark; color: rgba(255, 255, 255, 0.87); - background-color: #101010; + background-color: #41444B; font-synthesis: none; text-rendering: optimizeLegibility; @@ -30,10 +30,13 @@ a:hover { body { margin: 0; - display: flex; - place-items: center; - min-width: 320px; + padding: 0; min-height: 100vh; + display: flex; + flex-direction: row; + + color: white; + background-color: #101010; } h1 { diff --git a/src/pages/Root.css b/src/pages/Root.css index aef94f1..9c44c30 100644 --- a/src/pages/Root.css +++ b/src/pages/Root.css @@ -1,20 +1,39 @@ - - .App { - width: 100vw; - height: 100vh; + width: 100%; + height: 100%; + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; + background-color: #41444B; + color: black; +} - text-align: center; +.container { + width: 100%; + height: 100%; + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; +} + +.left { + width: 45%; + height: 100%; + background-color: #DFC7D4; display: flex; flex-direction: column; align-items: center; justify-content: center; - - background-color: #101010; - z-index: 9; } -.profile { - width: 256px; - background-color: transparent; +.right { + width: 55%; + height: 100%; + display: flex; + flex-direction: column; + align-items: center; + justify-content: center; + background-color: #41444B; } \ No newline at end of file diff --git a/src/pages/Root.tsx b/src/pages/Root.tsx index 1a5b503..450cdbb 100644 --- a/src/pages/Root.tsx +++ b/src/pages/Root.tsx @@ -1,12 +1,9 @@ -import { useEffect, useState, useMemo } from 'react'; +import { useEffect, useState } from 'react'; import { useLocation } from 'react-router-dom'; import './Root.css'; -import Help from '../component/help'; function Root() { const location = useLocation(); - const name: string[] = useMemo(() => ['imnyang', '아임냥', '암냥', '임냥', '@not.furry_', '@imnyang', '@mahiro_me'], []); - const [nameIndex, setNameIndex] = useState(0); const [imageSrc, setImageSrc] = useState('https://f.imnyang.xyz/profile/imnyang.webp'); useEffect(() => { @@ -18,43 +15,39 @@ function Root() { } }, [location.search]); - useEffect(() => { - const handleKeyDown = (event: KeyboardEvent) => { - console.log(`Key: ${event.key} with keycode ${event.keyCode} has been pressed`); - if (event.key === 'l') { - console.log('Change My Name'); - setNameIndex((prevIndex) => (prevIndex + 1) % name.length); - } - }; - - document.addEventListener('keydown', handleKeyDown); - - return () => { - document.removeEventListener('keydown', handleKeyDown); - }; - }, [name.length, name]); - return (
- -

- {name[nameIndex]} -

-
-

Press

-

F1

-

and Check Help

+
+
+ +

+ imnyang +

+ +
+

+ 🖥️ Software Engineer +
+ 🎨 UI / UX Designer in Sqlare +

+ 📚 Middle School Student in South Korea +

+
+
+ + +
- - -
); } diff --git a/src/pages/Timeline.tsx b/src/pages/Timeline.tsx index df08065..73d6c07 100644 --- a/src/pages/Timeline.tsx +++ b/src/pages/Timeline.tsx @@ -1,5 +1,4 @@ import Markdown from "react-markdown"; -import Help from '../component/help'; import './Timeline.css'; import markdown from './Timeline.md';