From 771abdefa287f3effe4f24ee4d9d0581c4b46e54 Mon Sep 17 00:00:00 2001 From: lytrankieio123 Date: Wed, 22 Sep 2021 12:12:30 +0700 Subject: [PATCH] :bug: bug: style responsive product info :%s --- .../components/RecipeDetailInfo/RecipeDetailInfo.module.scss | 5 ++++- .../ProductInfoDetail/ProductInfoDetail.module.scss | 2 +- .../components/ProductImgs/ProductImgs.module.scss | 3 +++ 3 files changed, 8 insertions(+), 2 deletions(-) diff --git a/src/components/common/RecipeDetail/components/RecipeDetailInfo/RecipeDetailInfo.module.scss b/src/components/common/RecipeDetail/components/RecipeDetailInfo/RecipeDetailInfo.module.scss index 94647504d..3c1941310 100644 --- a/src/components/common/RecipeDetail/components/RecipeDetailInfo/RecipeDetailInfo.module.scss +++ b/src/components/common/RecipeDetail/components/RecipeDetailInfo/RecipeDetailInfo.module.scss @@ -4,7 +4,7 @@ @apply spacing-horizontal; margin: 0 auto 5.6rem; @screen md { - @apply flex; + @apply flex justify-center; margin: 5.6rem auto; } @@ -16,6 +16,9 @@ @screen sm-only { margin-bottom: 2rem; } + @screen md { + max-width: 50%; + } @screen lg { max-width: 60rem; } diff --git a/src/components/modules/product-detail/ProductInfoDetail/ProductInfoDetail.module.scss b/src/components/modules/product-detail/ProductInfoDetail/ProductInfoDetail.module.scss index 645ff7259..2bb98ee39 100644 --- a/src/components/modules/product-detail/ProductInfoDetail/ProductInfoDetail.module.scss +++ b/src/components/modules/product-detail/ProductInfoDetail/ProductInfoDetail.module.scss @@ -4,7 +4,7 @@ @apply spacing-horizontal; padding-bottom: 4rem; @screen md { - @apply flex; + @apply flex justify-center; padding-bottom: 5.6rem; } } \ No newline at end of file diff --git a/src/components/modules/product-detail/ProductInfoDetail/components/ProductImgs/ProductImgs.module.scss b/src/components/modules/product-detail/ProductInfoDetail/components/ProductImgs/ProductImgs.module.scss index a8b6174cb..fab81eb9b 100644 --- a/src/components/modules/product-detail/ProductInfoDetail/components/ProductImgs/ProductImgs.module.scss +++ b/src/components/modules/product-detail/ProductInfoDetail/components/ProductImgs/ProductImgs.module.scss @@ -3,6 +3,9 @@ @screen sm-only { margin-bottom: 2rem; } +@screen md { + max-width: 50%; +} @screen lg { max-width: 60rem; }