Merge pull request #201 from isd-sgcu/sun/fix-freshy-night

Sun/fix freshy night
isd-sgcu · Jul 31, 2024 · 4753aa9 · 4753aa9
2 parents 1e32947 + be6ef16
commit 4753aa9
Show file tree

Hide file tree

Showing 4 changed files with 36 additions and 15 deletions.
diff --git a/public/rpkm/freshy-night/poster.jpg b/public/rpkm/freshy-night/poster.jpg
diff --git a/src/app/rpkm/freshy-night/register-done/page.tsx b/src/app/rpkm/freshy-night/register-done/page.tsx
@@ -2,10 +2,15 @@
 
 import { useState } from 'react';
 import { useAuth } from '@/context/AuthContext';
+import Image from 'next/image';
+import Link from 'next/link';
 
 import BottomButton from '@/components/(main)/home/BottomButton';
 import QrCodeModal from '@/components/rpkm/freshy-night/QrCodeModal';
 import qrcodeIcon from '@public/home/icon/qrcode.svg';
+import poster from '@public/rpkm/freshy-night/poster.jpg';
+import modalStyles from '@/components/rpkm/Modal/ModalStyle';
+import ModalButton from '@/components/rpkm/freshy-night/ModalButton';
 
 export default function RegisterDone() {
   const [qrModal, setQrModal] = useState<boolean>(false);
@@ -14,20 +19,42 @@ export default function RegisterDone() {
 
   return (
     <div className="py-[8%]">
-      <div className="bg-[#FFFEF7E5] w-11/12 justify-between mx-auto py-[5%] flex flex-col items-center gap-y-5 min-h-screen [box-shadow:_0px_0px_15px_0px_rgba(0_0_0_0.50)] [clip-path:polygon(1rem_0,calc(100%-1rem)_0,100%_1rem,100%_calc(100%-1rem),calc(100%-1rem)_100%,1rem_100%,0_calc(100%-1rem),0_1rem)]">
+      <div className="bg-[#FFFEF7E5] w-11/12 mx-auto py-[7%] flex flex-col items-center gap-y-[2em]  [box-shadow:_0px_0px_15px_0px_rgba(0_0_0_0.50)] [clip-path:polygon(1rem_0,calc(100%-1rem)_0,100%_1rem,100%_calc(100%-1rem),calc(100%-1rem)_100%,1rem_100%,0_calc(100%-1rem),0_1rem)]">
         <div className="text-center font-sopha font-outline">
-          <p className="text-project-pastel-pink text-8xl/[5rem] [text-shadow:_2px_2px_2px_rgb(0_0_0_/_30%)]">
+          <p className="text-project-pastel-pink text-7xl/[3rem] [text-shadow:_2px_2px_2px_rgb(0_0_0_/_30%)]">
             ลงทะเบียน
           </p>
-          <p className="text-project-yellow text-9xl/[2.5rem] tracking-wide [text-shadow:_2px_2px_2px_rgb(0_0_0_/_30%)]">
-            <span className="-mr-5">ส</span> ำเร็จ
+          <p className="text-project-yellow text-8xl/[3.5rem] tracking-wide -mt-2 [text-shadow:_2px_2px_2px_rgb(0_0_0_/_30%)]">
+            <span className="-mr-4">ส</span> ำเร็จ!
           </p>
         </div>
+        <Image
+          src={poster}
+          alt="Freshy night poster"
+          className="w-[85%]"
+        />
         <BottomButton
           onClick={() => setQrModal(true)}
           src={qrcodeIcon}
           text="My Qr"
         />
+        <Link
+          href="/home"
+          className="w-full flex justify-center"
+        >
+          <ModalButton
+            callBackFunction={() => {}}
+            borderClassName={modalStyles['dark-blue'].button['accept-border']}
+            backgroundClassName={
+              modalStyles['dark-blue'].button['accept-background']
+            }
+            buttonWidth={modalStyles['dark-blue'].button.width}
+          >
+            <h1 className="font-athiti text-2xl font-medium">
+              กลับสู่หน้าหลัก
+            </h1>
+          </ModalButton>
+        </Link>
       </div>
       <QrCodeModal
         setOpen={setQrModal}

diff --git a/src/components/rpkm/Navbar.tsx b/src/components/rpkm/Navbar.tsx
@@ -21,9 +21,12 @@ function Navbar() {
     </div>
   );
   useEffect(() => {
-    if (currentPath.startsWith('/rpkm/activities'))
+    if (
+      currentPath.startsWith('/rpkm/activities') ||
+      currentPath.startsWith('/rpkm/freshy-night')
+    )
       setContent(
-        <div className="font-sopha absolute text-project-cream text-3xl text-center left-1/2 -translate-x-1/2">
+        <div className="font-sopha absolute text-project-cream text-3xl text-center tracking-wider left-1/2 -translate-x-1/2">
           รับเพื่อนก้าวใหม่ 67
         </div>
       );

diff --git a/src/components/rpkm/freshy-night/QrCodeModal.tsx b/src/components/rpkm/freshy-night/QrCodeModal.tsx
@@ -79,14 +79,5 @@ export default function QrCodeModal({
         </div>
       </div>
     </div>
-    // <div className="z-10 inset-0 fixed flex justify-center bg-black bg-opacity-50 self-center">
-    //   <div className="w-[calc(100vh*(72/156)*(9/10))] h-[64vh] relative self-center flex flex-col justify-center">
-    //     <div
-    //       className="w-4/5 h-full bg-contain bg-no-repeat bg-center flex flex-col items-center"
-    //       style={{ backgroundImage: `url(${qrInnerBackground.src})` }}
-    //     >
-    //     </div>
-    //   </div>
-    // </div>
   );
 }