Merge pull request #243 from BCSDLab/feature/#242-responsive-view

[영양사] 반응형으로 다양한 기기 대응
BCSDLab · Apr 12, 2024 · f716703 · f716703
2 parents dc64235 + f38a7d7
commit f716703
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 2 deletions.
diff --git a/src/page/Coop/Coop.module.scss b/src/page/Coop/Coop.module.scss
@@ -7,7 +7,7 @@
   height: 100%;
   font-family: Pretendard, sans-serif;
 
-  @media screen and (max-width: 375px) {
+  @media screen and (max-width: 400px) {
     width: 100%;
   }
 }

diff --git a/src/page/Coop/components/MenuCard/MenuCard.module.scss b/src/page/Coop/components/MenuCard/MenuCard.module.scss
@@ -32,6 +32,14 @@
     font-weight: 400;
     line-height: 15px;
     width: 150px;
+
+    &--none {
+      font-size: 16px;
+
+      @media screen and (max-width: 350px) {
+        font-size: 14px;
+      }
+    }
   }
 
   &__image {
@@ -95,6 +103,10 @@
     padding: 12px;
     gap: 40px;
     min-height: 120px;
+
+    @media screen and (max-width: 350px) {
+      gap: 10px;
+    }
   }
 
   &__soldout {

diff --git a/src/page/Coop/components/MenuCard/index.tsx b/src/page/Coop/components/MenuCard/index.tsx
@@ -158,7 +158,7 @@ export default function MenuCard({ selectedMenuType }: MenuCardProps) {
                     </div>
                   </>
                 ) : (
-                  <div>
+                  <div className={styles['card__content--none']}>
                     {corner}
                     에서 제공하는 식단 정보가 없습니다.
                   </div>