imnyang/imnya.ng
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

FullPage Scroll은 나쁩니다. && 이거 솔직히 추가해줘야한다고 봄

Browse source
This commit is contained in:
imnyang 2025-05-02 22:55:46 +09:00
commit 296439b044
13 changed files with 69 additions and 72 deletions
Download patch file Download diff file Expand all files Collapse all files

30
src/components/Home/About.tsx
View file

@ -63,15 +63,29 @@ export default function About() {
}, []);
useEffect(() => {
// isVisible이 true일 때 time 증가
if (isVisible && time < totalSeconds) {
const timer = setTimeout(() => setTime(prevTime => prevTime + 1), time === 0 ? 300 : 0);
return () => clearTimeout(timer);
}
}, [isVisible, time, totalSeconds]);
if (!isVisible) return;
const start = Date.now() - time;
let animationFrameId: number;
const tick = () => {
const elapsed = Date.now() - start;
if (elapsed >= totalSeconds) {
setTime(totalSeconds);
return;
}
setTime(elapsed);
animationFrameId = requestAnimationFrame(tick);
};
animationFrameId = requestAnimationFrame(tick);
return () => cancelAnimationFrame(animationFrameId);
}, [isVisible, totalSeconds]);
return (
<div className="w-full h-screen flex flex-col items-center justify-center" ref={AboutRef}>
<div className="w-full flex flex-col items-center justify-center" ref={AboutRef}>
<div className="w-full md:w-[50%] p-4">
<h1 className="text-2xl font-bold">🤔 About</h1>
<div className="flex items-start justify-center flex-col p-2 mt-2 w-full">

2
src/components/Home/Contact.tsx
View file

@ -9,7 +9,7 @@ import { Button } from "../ui/button";
export default function Contact() {
return (
<div className="w-full h-screen flex items-center justify-center">
<div className="w-full h-64 flex items-center justify-center">
<div className="w-full md:w-[50%] p-4 flex items-center justify-center flex-col gap-4">
<div className="flex items-center justify-center gap-4 flex-row">
<TooltipProvider delayDuration={0}>

2
src/components/Home/Project.tsx
View file

@ -25,7 +25,7 @@ const projects = [
export default function Project() {
return (
<div className="w-full h-screen flex flex-col items-center justify-center select-none">
<div className="w-full flex flex-col items-center justify-center select-none">
<div className="w-full md:w-[50%] p-4">
<h1 className="text-2xl font-bold">📖 Project</h1>
<div className="mt-4 gap-4 grid grid-cols-1 md:grid-cols-2">

4
src/components/Home/Timeline.tsx
View file

@ -181,7 +181,7 @@ export default function Timeline() {
<h1 className="text-2xl font-bold mb-4 w-full">🌠 Timeline</h1>
<p>현재까지 {count}개의 개성있는 조각들이 모였어요!</p>
<br/>
<Accordion type="single" collapsible className="w-full space-y-2">
<Accordion type="multiple" className="w-full space-y-2">
{Array.from(new Set(events.map(event => new Date(event.date).getFullYear()))).sort((a, b) => b - a).map(year => (
<AccordionItem
value={year.toString()}
@ -199,7 +199,7 @@ export default function Timeline() {
/>
</AccordionPrimitive.Trigger>
</AccordionPrimitive.Header>
<AccordionContent className="pb-2 ps-7 text-foreground max-h-60 overflow-y-auto">
<AccordionContent className="pb-2 ps-7 text-foreground overflow-y-auto">
{events.filter(event => new Date(event.date).getFullYear() === year).map((event, index) => (
<div key={index} className="my-2">
<p className="flex flex-row"><p className="text-md font-semibold fixed-width-number">{new Date(event.date).toLocaleDateString('en-US', { month: 'short', day: '2-digit' })}</p><p className="text-md font-semibold fixed-width-number text-muted-foreground">ㆍ{event.category}</p></p>

2
src/components/Home/Wakatime.tsx
View file

@ -15,7 +15,7 @@ export default function Wakatime() {
}, []);
return (
<div className="w-full h-screen flex flex-col items-center justify-center">
<div className="w-full flex flex-col items-center justify-center">
<div className="w-full md:w-[50%] p-4">
<a className="text-2xl font-bold" href="https://wakatime.com/@imnyang" target="_blank" rel="noopener noreferrer">🍝 Wakatime</a>
<p>Dashboards for developers</p>