diff --git a/src/components/ui/my-page/scrap-sheet.tsx b/src/components/ui/my-page/scrap-sheet.tsx index 1ac21d9..ee09235 100644 --- a/src/components/ui/my-page/scrap-sheet.tsx +++ b/src/components/ui/my-page/scrap-sheet.tsx @@ -3,7 +3,6 @@ import React, { useEffect } from 'react'; import Sheet from 'react-modal-sheet'; import styled from '@emotion/styled'; import Paper from '@mui/material/Paper'; -import Masonry from '@mui/lab/Masonry'; import { useAtom } from 'jotai'; import { Box } from '@mui/material'; import { styled as muiStyled } from '@mui/material/styles'; @@ -43,10 +42,16 @@ const ImageWarp = styled.div` } `; +const Masonry = styled.div` + display: grid; + grid-template-columns: repeat(3, 1fr); + gap: 4px; +`; + const MasonrySection: React.FC = ({ title, data }) => ( 나의 스크랩 - + {data.map((x: { photoUrls: string }, index: number) => ( diff --git a/src/pages/magazine/detail.tsx b/src/pages/magazine/detail.tsx index a71a732..8795e86 100644 --- a/src/pages/magazine/detail.tsx +++ b/src/pages/magazine/detail.tsx @@ -265,12 +265,6 @@ const MagazineDetail = () => { 좋아요 {likedCnt}

{magazineContent}

-
-
- 지후니 - 귀여워요 ^^ -
-

댓글 13개 모두 보기

diff --git a/src/pages/rank.tsx b/src/pages/rank.tsx index 19d8bbf..a696f6f 100644 --- a/src/pages/rank.tsx +++ b/src/pages/rank.tsx @@ -218,7 +218,8 @@ const FilterUI = () => { top: '50%', left: '50%', transform: 'translate(-50%, -50%)', - width: 400, + maxWidth: 400, + width: '100%', bgcolor: 'background.paper', boxShadow: 24, p: 4, diff --git a/src/pages/your-page.tsx b/src/pages/your-page.tsx index 2dbffc8..3218aa6 100644 --- a/src/pages/your-page.tsx +++ b/src/pages/your-page.tsx @@ -54,12 +54,9 @@ const GridContainer = styled.div` const GridItem = styled.div` width: 100%; - height: 132px; - display: flex; - justify-content: center; - align-items: center; + height: 100%; - > .image { + .image { height: 100%; width: 100%; }