diff --git a/src/CreateBook/components/CompleteButton/index.tsx b/src/CreateBook/components/CompleteButton/index.tsx index 7250bf09..4fa0cb95 100644 --- a/src/CreateBook/components/CompleteButton/index.tsx +++ b/src/CreateBook/components/CompleteButton/index.tsx @@ -15,7 +15,7 @@ function CompleteButton({ return ( ); diff --git a/src/CreateBook/page/CreateBook.style.ts b/src/CreateBook/page/CreateBook.style.ts index 9ab6ca19..41e2ac71 100644 --- a/src/CreateBook/page/CreateBook.style.ts +++ b/src/CreateBook/page/CreateBook.style.ts @@ -16,7 +16,7 @@ export const CreateBookBodyWrapper = styled.div` flex-direction: column; width: 100%; - height: calc(100vh - 5.4rem); + height: calc(100dvh - 5.4rem); padding: 0 1.6rem; margin-top: 5.4rem; `; diff --git a/src/Detail/components/SmallLecueNote/SmallLecueNote.style.ts b/src/Detail/components/SmallLecueNote/SmallLecueNote.style.ts index cf67e523..e49c8685 100644 --- a/src/Detail/components/SmallLecueNote/SmallLecueNote.style.ts +++ b/src/Detail/components/SmallLecueNote/SmallLecueNote.style.ts @@ -33,7 +33,7 @@ export const SmallLecueNoteWrapper = styled.div<{ return `background: url(${noteBackground})`; } }}; - background-size: cover; + background-size: 15.2rem 16.6rem; color: ${({ noteTextColor }) => { return noteTextColor; }}; diff --git a/src/Home/components/LecueBookList/LecueBookList.style.ts b/src/Home/components/LecueBookList/LecueBookList.style.ts index 64f6bdcd..411e6889 100644 --- a/src/Home/components/LecueBookList/LecueBookList.style.ts +++ b/src/Home/components/LecueBookList/LecueBookList.style.ts @@ -5,7 +5,7 @@ export const LecueBookListWrapper = styled.div` flex-direction: column; width: 100%; - height: 100dvh; + background-color: ${({ theme }) => theme.colors.key}; `; @@ -16,10 +16,10 @@ export const Title = styled.header` border-color: ${({ theme }) => theme.colors.BG}; border-width: 0.1rem 0; border-style: solid; + background-color: ${({ theme }) => theme.colors.white}; color: ${({ theme }) => theme.colors.BG}; ${({ theme }) => theme.fonts.Title1_SB_16}; - background-color: ${({ theme }) => theme.colors.white}; text-align: center; `; @@ -29,15 +29,14 @@ export const LecueBookList = styled.section` grid-template-columns: repeat(3, 1fr); width: 100%; - padding: 3rem 1.6rem 2.2rem; `; export const LecueBook = styled.li` display: flex; gap: 1rem; - align-items: center; justify-content: center; + align-items: center; flex-direction: column; width: 100%; @@ -51,6 +50,8 @@ export const BookImage = styled.img` height: 9.8rem; border-radius: 50%; + + object-fit: cover; `; export const BookTitle = styled.p` diff --git a/src/Splash/component/Body/index.tsx b/src/Splash/component/Body/index.tsx index f050eea6..41a183e1 100644 --- a/src/Splash/component/Body/index.tsx +++ b/src/Splash/component/Body/index.tsx @@ -6,7 +6,7 @@ import * as S from './Body.style'; function Body() { const { data } = useGetNoteNum(); - + return ( @@ -15,7 +15,7 @@ function Body() { 지금까지 {data && data.data.noteNum}개의 - 포스트잇이 붙여졌어요! + 레큐노트가 남겨졌어요! );