Merge pull request #17 from Nexters/fix/meet-bg-height

fix: 모임, 만남 초대장 페이지 배경 디테일 수정

Author: sikkzz

apps/tuk-web/src/app/gathering/meet/src/components/GatheringMeet.tsx

@@ -38,10 +38,10 @@ const GatheringMeet = () => {
     return () => clearTimeout(timeout);
   }, []);
   return (
-    <div className="relative h-screen w-full overflow-y-auto overflow-x-hidden bg-[#fafafa] px-5">
+    <div className="relative w-full overflow-y-auto overflow-x-hidden bg-[#fafafa] px-5">
       <div className="pointer-events-none absolute left-1/2 top-1/2 h-[340px] w-[706px] -translate-x-1/2 -translate-y-1/2 rotate-[-21deg] bg-gradient-to-b from-[#FFA098] to-[#FDD27C] opacity-60 blur-[100px]" />
 
-      <AppInstallBanner onClose={handleCloseBanner} />
+      {showBanner && <AppInstallBanner onClose={handleCloseBanner} />}
 
       <h2
         className={cn(
@@ -91,7 +91,7 @@ const GatheringMeet = () => {
         </div>
       </div>
 
-      <div className="mt-[4.125rem] flex justify-center pb-[2.8125rem]">
+      <div className="mt-[4.125rem] flex justify-center pb-[9.0625rem]">
         <TukLogo />
       </div>
 

apps/tuk-web/src/app/invite/meet/src/components/GradientBackground.tsx

@@ -3,9 +3,9 @@ const GradientBackground = () => {
     <>
       <div className="pointer-events-none absolute left-[-340px] top-[44px] h-[422px] w-[1018px] rotate-[-80deg] rounded-full bg-gradient-to-tr from-[#DCC9F7] to-[#94C1D3] opacity-50 blur-[180px]" />
 
-      <div className="pointer-events-none absolute left-[83px] top-[196px] h-[610px] w-[618px] rotate-[82deg] rounded-full bg-gradient-to-br from-[#DCC9F7] to-[#94C1D3] opacity-60 blur-[180px]" />
+      {/* <div className="pointer-events-none absolute left-[83px] top-[196px] h-[610px] w-[618px] rotate-[82deg] rounded-full bg-gradient-to-br from-[#DCC9F7] to-[#94C1D3] opacity-60 blur-[180px]" />
 
-      <div className="pointer-events-none absolute left-[61px] top-[542px] h-[449px] w-[423px] rotate-[82deg] rounded-full bg-gradient-to-br from-[#DCC8F8] to-white-default opacity-50 blur-[120px]" />
+      <div className="pointer-events-none absolute left-[61px] top-[542px] h-[449px] w-[423px] rotate-[82deg] rounded-full bg-gradient-to-br from-[#DCC8F8] to-white-default opacity-50 blur-[120px]" /> */}
     </>
   );
 };

apps/tuk-web/src/app/invite/meet/src/components/InviteMeet.tsx

@@ -42,7 +42,7 @@ const InviteMeet = () => {
     <div className="relative w-full overflow-y-auto overflow-x-hidden bg-gradient-to-b from-white-default to-[#DCC8F8] px-5">
       <GradientBackground />
 
-      <AppInstallBanner onClose={handleCloseBanner} />
+      {showBanner && <AppInstallBanner onClose={handleCloseBanner} />}
 
       <h2
         className={cn(
@@ -92,7 +92,7 @@ const InviteMeet = () => {
         </div>
       </div>
 
-      <div className="mt-[4.125rem] flex justify-center pb-[2.8125rem]">
+      <div className="mt-[4.125rem] flex justify-center pb-[9.0625rem]">
         <TukLogo />
       </div>
 

apps/tuk-web/src/styles/globals.css

@@ -90,3 +90,12 @@
     @apply font-noto text-[24px] font-medium leading-[33px] tracking-[-0.09375rem];
   }
 }
+
+* {
+  -ms-overflow-style: none;
+  scrollbar-width: none;
+}
+
+*::-webkit-scrollbar {
+  display: none;
+}