diff --git a/src/components/common/RecipeDetail/components/RecipeDetailInfo/RecipeDetailInfo.module.scss b/src/components/common/RecipeDetail/components/RecipeDetailInfo/RecipeDetailInfo.module.scss index 86b525083..fe2c7224b 100644 --- a/src/components/common/RecipeDetail/components/RecipeDetailInfo/RecipeDetailInfo.module.scss +++ b/src/components/common/RecipeDetail/components/RecipeDetailInfo/RecipeDetailInfo.module.scss @@ -2,13 +2,16 @@ .recipeDetailInfo { @apply spacing-horizontal; - margin: 5.6rem auto; + margin: 0 auto 5.6rem; @screen md { @apply flex; + margin: 5.6rem auto; } + .img { - width: fit-content; + width: 100%; margin-top: 0; + min-height: 50rem; @screen sm-only { margin-bottom: 2rem; @@ -16,13 +19,16 @@ @screen lg { max-width: 60rem; } - img { - @apply w-full; - object-fit: contain; - max-height: 64rem; - border-radius: 2.4rem; - @screen md { - max-height: 90rem; + > div { + min-height: 64rem; + img { + // object-fit: contain; + // @apply w-full; + min-height: 64rem; + border-radius: 2.4rem; + // @screen md { + // max-height: 90rem; + // } } } } diff --git a/src/components/common/RecipeDetail/components/RecipeDetailInfo/RecipeDetailInfo.tsx b/src/components/common/RecipeDetail/components/RecipeDetailInfo/RecipeDetailInfo.tsx index 4d212e10a..a853ad869 100644 --- a/src/components/common/RecipeDetail/components/RecipeDetailInfo/RecipeDetailInfo.tsx +++ b/src/components/common/RecipeDetail/components/RecipeDetailInfo/RecipeDetailInfo.tsx @@ -1,4 +1,5 @@ import React from 'react' +import { ImgWithLink } from 'src/components/common' import RecipeBriefInfo from '../RecipeBriefInfo/RecipeBriefInfo' import s from './RecipeDetailInfo.module.scss' @@ -12,7 +13,7 @@ const RecipeDetailInfo = ({ }: Props) => { return (
- Recipe +