diff --git a/src/components/pages/event/pudgy-asia-tour/Pudgy.tsx b/src/components/pages/event/pudgy-asia-tour/Pudgy.tsx index 6d74fc7..41d9f19 100644 --- a/src/components/pages/event/pudgy-asia-tour/Pudgy.tsx +++ b/src/components/pages/event/pudgy-asia-tour/Pudgy.tsx @@ -9,6 +9,7 @@ import Link from 'next/link' export default function PudgyList() { const [page, setPage] = useState(1) const [selected, setSelected] = useState(pudgyData[0]) + const [selectedPudgy, setSelectedPudgy] = useState(pudgyData[0]) const [scope, animate] = useAnimate() return ( <> @@ -93,12 +94,13 @@ export default function PudgyList() { { transform: ['rotateY(180deg)', 'rotateY(360deg)', 'rotateY(0deg)'] }, { duration: 1, times: [0.5, 1, 1], ease: 'linear' } ) + setSelectedPudgy(data) setTimeout(() => setSelected(data), 500) } }}>
- {selected.name == data.name &&
} + {selectedPudgy.name == data.name &&
}
{data.name}
diff --git a/src/components/pages/event/pudgy-asia-tour/TimeLine.tsx b/src/components/pages/event/pudgy-asia-tour/TimeLine.tsx index d264224..7a9050b 100644 --- a/src/components/pages/event/pudgy-asia-tour/TimeLine.tsx +++ b/src/components/pages/event/pudgy-asia-tour/TimeLine.tsx @@ -2,23 +2,85 @@ import Image from 'next/image' import PudgyWithCup from './assets/pudgy-with-cup.svg' import Bamboo from './assets/bamboo.svg' import Cup from './assets/cuo.svg' -import Image2 from './assets/i2.png' +import Image2 from './assets/i2.svg' +import Image1 from './assets/i1.svg' import R1 from './assets/r1.png' import R2 from './assets/r2.png' import R3 from './assets/r3.png' import Line from './assets/line.svg' import TimeLineImage from './assets/timeline.png' import { useTranslation } from 'react-i18next' +import { useState } from 'react' +import Modal from 'components/Modal' +import { useRouter } from 'next/router' export default function TimeLine() { const { t } = useTranslation() + const { locale } = useRouter() + const [open, setOpen] = useState(false) return ( <> + + + {locale == 'vn' ? ( +
+
GIAI THUONG
+
+ 🏆 Giải thưởng:
+ 🥇1 Giải Nhất: 10.000.000 VNĐ +
+ 🥈1 Giải Nhì: 5.000.000 VNĐ
+ 🥉1 Giải Ba: 2.500.000 VNĐ
+ 🏅7 Giải 4 - 10: 1.250.000 VNĐ
+ 🎖️10 Giải 11 - 20: 500.000 VNĐ
+ 🔥 Đặc biệt, Top 20 họa sĩ xuất sắc nhất sẽ nhận được ấn phẩm truyện độc quyền của cuộc thi. +
+
+ ) : ( +
+
PRIZE
+
+ 🏆 Prizes:
+ 🥇 1 First Prize: $400
+ 🥈 1 Second Prize: $200
+ 🥉 1 Third Prize: $100
+ 🏅 7 Prizes for 4th - 10th place: $50 each
+ 🎖️ 10 Prizes for 11th - 20th place: $20 each
+ 🔥 Special: The Top 20 most outstanding artists will receive an exclusive comic book of the contest! +
+
+ )} +
{t('IT’s Time TO TRAVEL')}
+ + +
01/08/2024
{t(`"Join the Waddle and start flappin'!"`)}
@@ -40,11 +102,11 @@ export default function TimeLine() { /> -
+
setOpen(true)}>
{t('upto 2.000 USD')}
-
+
{t('Click Me')}
@@ -65,11 +127,11 @@ export default function TimeLine() { /> -
+
setOpen(true)}>
{t('upto 2.000 USD')}
-
+
{t('Click Me')}
diff --git a/src/components/pages/event/pudgy-asia-tour/assets/i1.svg b/src/components/pages/event/pudgy-asia-tour/assets/i1.svg new file mode 100644 index 0000000..db6c4ff --- /dev/null +++ b/src/components/pages/event/pudgy-asia-tour/assets/i1.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/src/components/pages/event/pudgy-asia-tour/assets/i2.svg b/src/components/pages/event/pudgy-asia-tour/assets/i2.svg new file mode 100644 index 0000000..7d11c55 --- /dev/null +++ b/src/components/pages/event/pudgy-asia-tour/assets/i2.svg @@ -0,0 +1,9 @@ + + + + + + + + + diff --git a/src/components/pages/event/pudgy-asia-tour/assets/timeline.png b/src/components/pages/event/pudgy-asia-tour/assets/timeline.png index 305c1df..65c0df4 100644 Binary files a/src/components/pages/event/pudgy-asia-tour/assets/timeline.png and b/src/components/pages/event/pudgy-asia-tour/assets/timeline.png differ