feat: 모달창 확인버튼 태블릿 이하에서 바닥에 붙게끔 수정

sprint-team3 · Mar 28, 2024 · 6569737 · 6569737
1 parent 87b610f
commit 6569737
Show file tree

Hide file tree

Showing 2 changed files with 23 additions and 8 deletions.
diff --git a/src/components/calendar/ModalContents/ModalContents.module.scss b/src/components/calendar/ModalContents/ModalContents.module.scss
@@ -1,6 +1,11 @@
 .schedule-modal {
   &-container {
     @include column-flexbox(start, stretch, 1.6rem);
+
+    @include responsive(T) {
+      justify-content: space-between;
+      height: 100%;
+    }
   }
 
   &-date {
@@ -18,6 +23,10 @@
   &-reservation {
     @include column-flexbox(start, stretch, 0.8rem);
 
+    @include responsive(T) {
+      flex-grow: 1;
+    }
+
     &-title {
       @include flexbox(start, center, 0.4rem);
       @include text-style(16, $white, bold);

diff --git a/src/components/commons/modals/CommonModal.module.scss b/src/components/commons/modals/CommonModal.module.scss
@@ -81,18 +81,24 @@
       &::after {
         display: none;
       }
-    }
 
-    .modal-mobile-nav {
-      width: 100%;
-      height: 5.6rem;
-      border-bottom: 0.1rem solid $opacity-white-10;
-    }
+      .modal-inner {
+        height: 100%;
+      }
 
-    .modal-header-title {
-      @include responsive(T) {
+      .modal-mobile-nav {
+        width: 100%;
+        height: 5.6rem;
+        border-bottom: 0.1rem solid $opacity-white-10;
+      }
+
+      .modal-header-title {
         padding-top: 2.4rem;
       }
+
+      .modal-content {
+        height: 100%;
+      }
     }
   }