diff --git a/src/layout/MypageLayout.tsx b/src/layout/MypageLayout.tsx index 7cafe713..8ad50f80 100644 --- a/src/layout/MypageLayout.tsx +++ b/src/layout/MypageLayout.tsx @@ -148,22 +148,36 @@ const Gap = styled.div` flex: 1; `; -MypageLayout.Label = function Label({ children }: { children: React.ReactNode }) { - return {children}; +MypageLayout.Label = function Label({ subText, children }: { subText?: string; children: React.ReactNode }) { + return ( + +

{children}

+ {subText &&

{subText}

} +
+ ); }; -const LabelWrap = styled.h4` - font-size: 1.75rem; - font-style: normal; - font-family: ${({ theme }) => theme.fonts.NOTOSANSKR}; - font-weight: 500; - line-height: 2.25rem; +const LabelWrap = styled.div` margin-bottom: 40px; position: relative; display: flex; + flex-direction: column; + gap: 12px; width: 100%; - align-items: center; - justify-content: space-between; + h4 { + font-size: 1.75rem; + font-style: normal; + font-family: ${({ theme }) => theme.fonts.NOTOSANSKR}; + font-weight: 500; + line-height: 2.25rem; + } + p { + color: #7a7a7a; + font-size: 16px; + font-style: normal; + font-weight: 500; + line-height: 130%; + } `; MypageLayout.Header = styled.div` diff --git a/src/pages/mypage/adopt/index.tsx b/src/pages/mypage/adopt/index.tsx index ef2c91ad..209188b5 100644 --- a/src/pages/mypage/adopt/index.tsx +++ b/src/pages/mypage/adopt/index.tsx @@ -40,7 +40,11 @@ export default function Adopt() { - {role === 'BREEDER' ? '분양신청내역' : '신청내역'} + 상세보기를 클릭하면 브리더정보를 확인하실 수 있습니다.'} + > + {role === 'BREEDER' ? '분양신청내역' : '신청내역'} + { onSearch(value); }}