diff --git a/src/apis/dog/useDogProfile.tsx b/src/apis/dog/useDogProfile.tsx
index 53c0acf..72d8805 100644
--- a/src/apis/dog/useDogProfile.tsx
+++ b/src/apis/dog/useDogProfile.tsx
@@ -53,7 +53,7 @@ export function usePatchDogProfile(id: number) {
return useMutation({
mutationFn: (data: PatchDogProfileRequest) => patchDogProfile(id, data),
onSuccess: () => {
- pushModal()
+ pushModal(, 'none')
},
onError: (error: Error) => {
showToast(error.message)
diff --git a/src/components/DogProfile/index.tsx b/src/components/DogProfile/index.tsx
index 309cc7c..cf4aaa9 100644
--- a/src/components/DogProfile/index.tsx
+++ b/src/components/DogProfile/index.tsx
@@ -30,7 +30,7 @@ export default function DogProfile({ dogProfile, isEditBtnVisible = false }: Dog
{dogProfile.name}
- {dogProfile.breed}
+ {dogProfile.breed}
{age}살
diff --git a/src/components/DogProfile/styles.ts b/src/components/DogProfile/styles.ts
index 6a545b7..61ee670 100644
--- a/src/components/DogProfile/styles.ts
+++ b/src/components/DogProfile/styles.ts
@@ -13,9 +13,16 @@ export const TyopNameWrapper = styled.div`
margin-bottom: 0.4rem;
`
+export const Breed = styled.div`
+ font-size: 15px;
+ max-width: 83px;
+ overflow: hidden;
+ text-overflow: ellipsis;
+`
+
export const EditIconWrapper = styled.div`
position: absolute;
- right: 48px;
+ right: 29px;
width: 2rem;
height: 2rem;
background-color: ${({ theme }) => theme.colors.brand.lighten_2};
@@ -29,6 +36,7 @@ export const EditIconWrapper = styled.div`
export const DogInfoArea = styled(Box)`
padding: 16px 20px;
+ position: relative;
`
export const DogInfoWrapper = styled.div`
display: flex;
@@ -60,17 +68,6 @@ export const OneLineIntro = styled(Box)`
}
`
-// export const EditIconWrapper = styled.div`
-// width: 2rem;
-// height: 2rem;
-// background-color: ${({ theme }) => theme.colors.brand.lighten_2};
-// border-radius: 50%;
-// display: flex;
-// justify-content: center;
-// align-items: center;
-// margin-left: auto;
-// `
-
export const InviteBtn = styled.button`
width: 57px;
height: 36px;
diff --git a/src/constants/layout.ts b/src/constants/layout.ts
index b11049f..ba2df54 100644
--- a/src/constants/layout.ts
+++ b/src/constants/layout.ts
@@ -1,5 +1,5 @@
export const HEADER_HEIGHT = 56
export const HEADER_HEIGHT_LG = 80
-export const HEADER_Z_INDEX = 80
+export const HEADER_Z_INDEX = 200
export const FOOTER_HEIGHT = 56
diff --git a/src/pages/FamilyDDangPage/index.tsx b/src/pages/FamilyDDangPage/index.tsx
index bb1188d..9850a96 100644
--- a/src/pages/FamilyDDangPage/index.tsx
+++ b/src/pages/FamilyDDangPage/index.tsx
@@ -11,14 +11,12 @@ import OwnerUpdateModal from '~modals/OwnerUpdateModal'
import { fetchFamilyDDang } from '~apis/family/fetchFamilyDDang'
import { FAMILY_ROLE } from '~constants/familyRole'
import DogProfile from '~components/DogProfile'
-import { useMyPage } from '~apis/myPage/useMyPage'
import { useEffect } from 'react'
export default function FamilyDDang() {
const { pushModal, modalList } = useModalStore()
- const { refetch } = useMyPage()
- const { data, isLoading, isError } = useQuery({
+ const { data, isLoading, isError, refetch } = useQuery({
queryKey: ['familyList'],
queryFn: fetchFamilyDDang,
})
@@ -56,23 +54,10 @@ export default function FamilyDDang() {
- {/* {firstDog && (
-
- )} */}
-
{familyInfo?.dogs[0] && }
- {members?.map(member => (
+ {members?.map((member, index) => (
@@ -85,10 +70,9 @@ export default function FamilyDDang() {
산책 시간
- {/* {member.walkScheduleInfoList.map(schedule => schedule.dayOfWeek).join(', ') || '없음'} */}
-
-
- {member.walkScheduleInfoList.map(schedule => schedule.walkTime).join(', ') || ''}
+ {member.walkScheduleInfoList
+ .map(schedule => schedule.walkTime.split(':').slice(0, 2)?.join(':'))
+ .join(', ') || ''}
@@ -98,9 +82,11 @@ export default function FamilyDDang() {
-
-
-
+ {index === 0 && (
+
+
+
+ )}
))}
diff --git a/src/pages/FamilyDDangPage/styles.ts b/src/pages/FamilyDDangPage/styles.ts
index 34f641a..0a91da9 100644
--- a/src/pages/FamilyDDangPage/styles.ts
+++ b/src/pages/FamilyDDangPage/styles.ts
@@ -8,6 +8,10 @@ export const FamilyDDang = styled.div`
height: 100%;
display: flex;
flex-direction: column;
+ overflow-y: auto;
+ &::-webkit-scrollbar {
+ display: none;
+ }
`
export const Header = styled(BasicHeader)`
@@ -26,6 +30,7 @@ export const IconWrapper = styled.div`
cursor: pointer;
`
export const ProfileOneArea = styled.div`
+ position: relative;
display: flex;
gap: 1rem;
padding: 1.25rem 0;
@@ -36,13 +41,19 @@ export const ProfileOneArea = styled.div`
`
export const FamilyInfoArea = styled.div`
- gap: 1rem;
+ gap: 2px;
+ display: flex;
+ flex-direction: column;
`
export const LineWrapper = styled.div`
display: flex;
gap: 0.5rem;
+ /* border: solid 1px red; */
+ align-items: flex-end;
`
export const EditIconWrapper = styled.div`
+ position: absolute;
+ right: 0px;
width: 2rem;
height: 2rem;
background-color: ${({ theme }) => theme.colors.brand.lighten_2};