diff --git a/public/assets/images/carousel/google-form.png b/public/assets/images/carousel/google-form.png new file mode 100644 index 0000000..786dc3f Binary files /dev/null and b/public/assets/images/carousel/google-form.png differ diff --git a/public/assets/images/carousel/pwa-notion.png b/public/assets/images/carousel/pwa-notion.png new file mode 100644 index 0000000..bcfc7d3 Binary files /dev/null and b/public/assets/images/carousel/pwa-notion.png differ diff --git a/public/assets/images/test.png b/public/assets/images/test.png deleted file mode 100644 index 98903f7..0000000 Binary files a/public/assets/images/test.png and /dev/null differ diff --git a/public/assets/images/test2.png b/public/assets/images/test2.png deleted file mode 100644 index 0029650..0000000 Binary files a/public/assets/images/test2.png and /dev/null differ diff --git a/src/app/mobile/main/_components/Carousel/index.tsx b/src/app/mobile/main/_components/Carousel/index.tsx index dbf12fb..09e0eda 100644 --- a/src/app/mobile/main/_components/Carousel/index.tsx +++ b/src/app/mobile/main/_components/Carousel/index.tsx @@ -7,14 +7,17 @@ import 'swiper/css/navigation'; import 'swiper/css/pagination'; interface CarouselProps { - images: string[]; // 이미지 URL 배열 - onClick?: () => void; + images: Array<{ imgUrl: string; link: string }>; // 이미지 URL, link 배열 } -export default function Carousel({ images, onClick }: CarouselProps) { +export default function Carousel({ images }: CarouselProps) { + const handleClickCarousel = (link: string) => { + window.open(link, '_blank'); + }; + return ( // eslint-disable-next-line jsx-a11y/click-events-have-key-events -
+
- {images.map((src, index) => ( - // eslint-disable-next-line react/no-array-index-key - + {images.map((item, index) => ( + {/* 이미지의 크기가 맞지 않을 때 화면을 꽉채우게 할건지, 비율을 유지할 건지 정하기 */} + {/* eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-noninteractive-element-interactions */} {`Slide handleClickCarousel(item.link)} className="h-[168px] w-full object-cover" /> diff --git a/src/app/mobile/main/page.tsx b/src/app/mobile/main/page.tsx index af3f346..8a4db2f 100644 --- a/src/app/mobile/main/page.tsx +++ b/src/app/mobile/main/page.tsx @@ -53,10 +53,15 @@ export default function MobileMain() { setSearchQuery(e.target.value); }; - const imageUrls = [ - '/assets/images/test.png', - '/assets/images/test.png', - '/assets/images/test.png', + const images = [ + { + imgUrl: '/assets/images/carousel/pwa-notion.png', + link: 'https://humdrum-puppet-86a.notion.site/1ab22817262580d9971cc464dc8e2c57?pvs=4', + }, + { + imgUrl: '/assets/images/carousel/google-form.png', + link: 'https://docs.google.com/forms/d/e/1FAIpQLSeEi5wC3K1e-ekgudEu75OFmQEgXk474WenokYGEbJzyan3IA/viewform?usp=dialog', + }, ]; const handleOpenBottomSheet = (item: Item) => { @@ -68,14 +73,7 @@ export default function MobileMain() {
- - window.open( - 'https://humdrum-puppet-86a.notion.site/1ab22817262580d9971cc464dc8e2c57?pvs=4', - ) - } - /> +