diff --git a/src/pages/RollingPaper/RollingPaperPage.jsx b/src/pages/RollingPaper/RollingPaperPage.jsx index ff7e6d9..daf85a6 100644 --- a/src/pages/RollingPaper/RollingPaperPage.jsx +++ b/src/pages/RollingPaper/RollingPaperPage.jsx @@ -25,7 +25,7 @@ const DivWrap = styled.div` display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; - + @media (max-width: 1248px) { grid-template-columns: repeat(2, 1fr); } @@ -35,7 +35,7 @@ const DivWrap = styled.div` `; const BackgroundWrap = styled.div` - background-image: ${({ backgroundImageURL }) => + background-image: ${({ backgroundImageURL }) => backgroundImageURL ? `linear-gradient(180deg, rgba(0, 0, 0, 0.54) 0%, rgba(0, 0, 0, 0.54) 100%), url(${backgroundImageURL})` : "ffffff"}; @@ -51,19 +51,6 @@ const BackgroundWrap = styled.div` } `; - -const BackgroundWrap = styled.div.withConfig({ - shouldForwardProp: (prop) => - !["bgColor", "backgroundImageURL"].includes(prop), -})` - background-image: ${({ backgroundImageURL }) => - backgroundImageURL ? `url(${backgroundImageURL})` : "none"}; - background-color: ${({ bgColor }) => bgColor || "#FFE2AD"}; - min-height: calc(100vh - 65px); - background-size: cover; - background-position: center; -`; - const colorMap = { beige: "#FFE2AD", purple: "#ECD9FF", @@ -102,7 +89,7 @@ function RollingPaperDetailPage() { if (id) fetchInitialData(); }, [id]); - + // 메시지 로드 함수 const loadMoreMessages = async () => {