From 14ee9e9081a868878b7ee84b7a4ecdde63f0a8bb Mon Sep 17 00:00:00 2001
From: hookor <gerrard1219@gmail.com>
Date: Fri, 31 May 2024 04:09:33 +0900
Subject: [PATCH] Style: container sizes

---
 src/components/coffee/ScrollInducer.tsx | 6 ++++--
 src/pages/Page-Error.tsx                | 4 +++-
 2 files changed, 7 insertions(+), 3 deletions(-)

diff --git a/src/components/coffee/ScrollInducer.tsx b/src/components/coffee/ScrollInducer.tsx
index 2d24b0b1..e8ce7472 100644
--- a/src/components/coffee/ScrollInducer.tsx
+++ b/src/components/coffee/ScrollInducer.tsx
@@ -40,10 +40,11 @@ const ScrollInducer = ({
 
 const Container = styled.div`
   height: 80px;
-  position: absolute;
+  position: sticky;
+  margin: 0 -20px;
   left: 0;
   right: 0;
-  bottom: 47px;
+  bottom: 0;
   background-image: linear-gradient(#f5f5f530, #e9e9e9df);
   opacity: 100;
   transition: opacity 0.5s ease;
@@ -57,6 +58,7 @@ const Default = css`
 
 const Text = styled.div`
   width: 100%;
+  position: absolute;
   margin-top: 40px;
   font-size: var(--font-sizes-sm);
   color: var(--colors-mid-grey);
diff --git a/src/pages/Page-Error.tsx b/src/pages/Page-Error.tsx
index d8f446e9..87c00ee0 100644
--- a/src/pages/Page-Error.tsx
+++ b/src/pages/Page-Error.tsx
@@ -37,7 +37,9 @@ const Container = styled.div`
   max-width: 500px;
   min-width: 360px;
   width: 100vw;
-  height: 100vh;
+  height: calc(
+    100dvh - 50px - env(safe-area-inset-bottom) - env(safe-area-inset-top)
+  );
   padding: 0 20px 20px;
   margin-bottom: calc(env(safe-area-inset-bottom));
 `;