From 1cc64555a8ca5ec888079ce515f58afe0486fac5 Mon Sep 17 00:00:00 2001
From: Grayash <k_2684@naver.com>
Date: Wed, 18 Sep 2024 14:26:29 +0900
Subject: [PATCH] Add NetworkButton component

---
 src/app/components/HeroSection.tsx   |  4 +++-
 src/app/components/NetworkButton.tsx | 15 +++++++++++++++
 src/app/constants/link.ts            |  1 +
 3 files changed, 19 insertions(+), 1 deletion(-)
 create mode 100644 src/app/components/NetworkButton.tsx

diff --git a/src/app/components/HeroSection.tsx b/src/app/components/HeroSection.tsx
index be027d6..8f2462b 100644
--- a/src/app/components/HeroSection.tsx
+++ b/src/app/components/HeroSection.tsx
@@ -7,6 +7,7 @@ import { motion } from "framer-motion";
 import { useInView } from "react-intersection-observer";
 import CTAButton from "./CTAButton";
 import FadeIn from "./FadeIn";
+import NetworkButton from "./NetworkButton";
 
 export default function HeroSection() {
   const { ref: heroRef, inView: heroInView } = useInView({
@@ -56,11 +57,12 @@ export default function HeroSection() {
           </div>
         </FadeIn>
         <FadeIn
-          className="w-full text-center"
+          className="flex w-full items-center justify-center gap-2 text-center"
           distance={80}
           duration={{ in: 0.8 }}
         >
           <CTAButton />
+          <NetworkButton />
         </FadeIn>
       </div>
     </motion.section>
diff --git a/src/app/components/NetworkButton.tsx b/src/app/components/NetworkButton.tsx
new file mode 100644
index 0000000..8f6f00b
--- /dev/null
+++ b/src/app/components/NetworkButton.tsx
@@ -0,0 +1,15 @@
+import { Button } from "@headlessui/react";
+import { UMOH_LINK } from "../constants/link";
+
+export default function NetworkButton() {
+  return (
+    <Button
+      onClick={() => {
+        window.open(UMOH_LINK, "_blank");
+      }}
+      className="inline-flex items-center gap-2 rounded-md bg-purple-500 px-6 py-3 text-xl/6 font-semibold text-white shadow-inner shadow-white/10 data-[hover]:bg-purple-600 tablet:px-9 tablet:py-6 tablet:text-4xl/6"
+    >
+      참가자 네트워킹
+    </Button>
+  );
+}
diff --git a/src/app/constants/link.ts b/src/app/constants/link.ts
index 6ea5fa7..d7cde59 100644
--- a/src/app/constants/link.ts
+++ b/src/app/constants/link.ts
@@ -5,3 +5,4 @@ export const INSTAGRAM_LINK = "https://www.instagram.com/ausg.awskrug";
 export const FACEBOOK_LINK = "https://www.facebook.com/ausgkr";
 export const GITHUB_LINK = "https://github.com/ausg";
 export const EMAIL = "ausg.awskrug@gmail.com";
+export const UMOH_LINK = "https://umoh.io/ausgcon2024";