Skip to content

Commit

Permalink
Merge pull request #42 from JangAyeon/qa
Browse files Browse the repository at this point in the history 
QA: 아이템 추가 시 기존 아이템 밀림 현상 및 클릭 아이템에 제일 앞으로 보이기 기능
  • Loading branch information
@JangAyeon
JangAyeon authored Feb 27, 2024
2 parents 91c4b8d + 2ec783d commit d863b01
Show file tree
Hide file tree
Showing 10 changed files with 117 additions and 69 deletions.
4 changes: 2 additions & 2 deletions components/atoms/logo/Logo.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,8 +10,8 @@ interface ILogo {
}

const LogoSrc = {
main: "/assets/logo/vertical.png",
header: "/assets/logo/horizontal.png",
main: "/assets/logo/vertical.svg",
header: "/assets/logo/horizontal.svg",
}
const Logo = ({ width, height, alt, type, padding }: ILogo) => {
return (
Expand Down
4 changes: 2 additions & 2 deletions components/atoms/slide/index.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -25,8 +25,8 @@ const Slide = ({ id }: { id: ItemIdProps }) => {
<Image
src={ITEM_CHOICE[id].thumbImgSrc}
alt={ITEM_CHOICE[id].id.toString()}
width={ITEM_CHOICE[id].width}
height={ITEM_CHOICE[id].height}
width={112}
height={112}
/>
</SlideContainer>
)
Expand Down
1 change: 1 addition & 0 deletions components/drag/draggable.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -36,6 +36,7 @@ const DragItem = ({
y,
z,
title,

width,
height,
}: DraggableItem) => {
Expand Down
39 changes: 21 additions & 18 deletions components/molecules/LandDrag.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -54,19 +54,21 @@ const LandContent = ({ isOwner }: { isOwner: boolean }) => {
/>
<ItemsContainer>
{items.length > 0 &&
items.map((item: LocationProps) => (
<DragItem
isOwner={isOwner}
key={item.id}
id={item.id}
title={ITEM_CHOICE[`${item.id}`].title}
x={item.x}
y={item.y}
z={item.z}
width={ITEM_CHOICE[`${item.id}`].width}
height={ITEM_CHOICE[`${item.id}`].height}
active={false}
/>
items.map((item: LocationProps, index: number) => (
<DragWrapper isFirst={index === 0 ? true : false}>
<DragItem
isOwner={isOwner}
key={item.id}
id={item.id}
title={ITEM_CHOICE[`${item.id}`].title}
x={item.x}
y={item.y}
z={item.z}
width={ITEM_CHOICE[`${item.id}`].width}
height={ITEM_CHOICE[`${item.id}`].height}
active={false}
/>
</DragWrapper>
))}
</ItemsContainer>
</IslandContainer>
Expand All @@ -77,11 +79,6 @@ const LandContent = ({ isOwner }: { isOwner: boolean }) => {

export default LandContent

const DragField = styled.div`
width: 100%;
height: 100%;
`

const IslandContainer = styled.div`
width: 43rem;
height: 78rem;
Expand All @@ -94,3 +91,9 @@ const ItemsContainer = styled.div`
left: 0;
height: inherit;
`

const DragWrapper = styled.div<{ isFirst: boolean }>`
position: ${({ isFirst }) => (isFirst ? `static` : "absolute")};
top: 0;
left: 0;
`
1 change: 1 addition & 0 deletions components/molecules/LandLoading.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,7 @@ const LandLoading = () => {
width="240"
height="320"
alt="loading"
priority
/>
</IconWrapper>
</BackgroundLayout>
Expand Down
94 changes: 47 additions & 47 deletions constants/island.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -70,48 +70,48 @@ const ITEM_CHOICE: ILandItemChoice = {
0: {
id: 0,
title: "Item_0",
thumbImgSrc: "@/public/assets/item/original/item_0.svg",
mainImgSrc: "@/public/assets/item/original/item_0.svg",
thumbImgSrc: "/assets/item/original/item_0.svg",
mainImgSrc: "/assets/item/original/item_0.svg",

...ITEM_SIZE,
},
1: {
id: 1,
title: "Item_1",
thumbImgSrc: "@/public/assets/item/original/item_1.svg",
mainImgSrc: "@/public/assets/item/original/item_1.svg",
thumbImgSrc: "/assets/item/original/item_1.svg",
mainImgSrc: "/assets/item/original/item_1.svg",

...ITEM_SIZE,
},
2: {
id: 2,
title: "Item_2",
thumbImgSrc: "@/public/assets/item/original/item_2.svg",
mainImgSrc: "@/public/assets/item/original/item_2.svg",
thumbImgSrc: "/assets/item/original/item_2.svg",
mainImgSrc: "/assets/item/original/item_2.svg",

...ITEM_SIZE,
},
3: {
id: 3,
title: "Item_3",
thumbImgSrc: "@/public/assets/item/original/item_3.svg",
thumbImgSrc: "/assets/item/original/item_3.svg",
mainImgSrc: "@/public/assets/item/original/item_3.svg",

...ITEM_SIZE,
},
4: {
id: 4,
title: "Item_4",
thumbImgSrc: "@/public/assets/item/original/item_4.svg",
mainImgSrc: "@/public/assets/item/original/item_4.svg",
thumbImgSrc: "/assets/item/original/item_4.svg",
mainImgSrc: "/assets/item/original/item_4.svg",

...ITEM_SIZE,
},
5: {
id: 5,
title: "Item_5",
thumbImgSrc: "@/publicassets/item/original/item_5.svg",
mainImgSrc: "@/public/assets/item/original/item_5.svg",
thumbImgSrc: "/assets/item/original/item_5.svg",
mainImgSrc: "/assets/item/original/item_5.svg",

...ITEM_SIZE,
},
Expand All @@ -126,144 +126,144 @@ const ITEM_CHOICE: ILandItemChoice = {
7: {
id: 7,
title: "Item_7",
thumbImgSrc: "@/public/assets/item/original/item_7.svg",
mainImgSrc: "@/public/assets/item/original/item_7.svg",
thumbImgSrc: "/assets/item/original/item_7.svg",
mainImgSrc: "/assets/item/original/item_7.svg",

...ITEM_SIZE,
},
8: {
id: 8,
title: "Item_8",
thumbImgSrc: "@/public/assets/item/original/item_8.svg",
mainImgSrc: "@/public/assets/item/original/item_8.svg",
thumbImgSrc: "/assets/item/original/item_8.svg",
mainImgSrc: "/assets/item/original/item_8.svg",

...ITEM_SIZE,
},
9: {
id: 9,
title: "Item_9",
thumbImgSrc: "@/public/assets/item/original/item_9.svg",
mainImgSrc: "@/public/assets/item/original/item_9.svg",
thumbImgSrc: "/assets/item/original/item_9.svg",
mainImgSrc: "/assets/item/original/item_9.svg",

...ITEM_SIZE,
},
10: {
id: 10,
title: "Item_10",
thumbImgSrc: "@/public/assets/item/original/item_10.svg",
mainImgSrc: "@/public/assets/item/original/item_10.svg",
thumbImgSrc: "/assets/item/original/item_10.svg",
mainImgSrc: "/assets/item/original/item_10.svg",

...ITEM_SIZE,
},
11: {
id: 11,
title: "Item_11",
thumbImgSrc: "@/public/assets/item/original/item_11.svg",
mainImgSrc: "@/public/assets/item/original/item_11.svg",
thumbImgSrc: "/assets/item/original/item_11.svg",
mainImgSrc: "/assets/item/original/item_11.svg",

...ITEM_SIZE,
},
12: {
id: 12,
title: "Item_12",
thumbImgSrc: "@/public/assets/item/original/item_12.svg",
mainImgSrc: "@/public/assets/item/original/item_12.svg",
thumbImgSrc: "/assets/item/original/item_12.svg",
mainImgSrc: "/assets/item/original/item_12.svg",

...ITEM_SIZE,
},
13: {
id: 13,
title: "Item_13",
thumbImgSrc: "@/public/assets/item/original/item_13.svg",
mainImgSrc: "@/public/assets/item/original/item_13.svg",
thumbImgSrc: "/assets/item/original/item_13.svg",
mainImgSrc: "/assets/item/original/item_13.svg",

...ITEM_SIZE,
},
14: {
id: 14,
title: "Item_14",
thumbImgSrc: "@/public/assets/item/original/item_14.svg",
mainImgSrc: "@/public/assets/item/original/item_14.svg",
thumbImgSrc: "/assets/item/original/item_14.svg",
mainImgSrc: "/assets/item/original/item_14.svg",

...ITEM_SIZE,
},
15: {
id: 15,
title: "Item_15",
thumbImgSrc: "@/public/assets/item/original/item_15.svg",
mainImgSrc: "@/public/assets/item/original/item_15.svg",
thumbImgSrc: "/assets/item/original/item_14.svg",
mainImgSrc: "/assets/item/original/item_14.svg",

...ITEM_SIZE,
},
16: {
id: 16,
title: "Item_16",
thumbImgSrc: "@/public/assets/item/original/item_16.svg",
mainImgSrc: "@/public/assets/item/original/item_16.svg",
thumbImgSrc: "/assets/item/original/item_16.svg",
mainImgSrc: "/assets/item/original/item_16.svg",

...ITEM_SIZE,
},
17: {
id: 17,
title: "Item_17",
thumbImgSrc: "@/public/assets/item/original/item_17.svg",
mainImgSrc: "@/public/assets/item/original/item_17.svg",
thumbImgSrc: "/assets/item/original/item_17.svg",
mainImgSrc: "/assets/item/original/item_17.svg",

...ITEM_SIZE,
},
18: {
id: 18,
title: "Item_18",
thumbImgSrc: "@/public/assets/item/original/item_18.svg",
mainImgSrc: "@/public/assets/item/original/item_18.svg",
thumbImgSrc: "/assets/item/original/item_18.svg",
mainImgSrc: "/assets/item/original/item_18.svg",

...ITEM_SIZE,
},
19: {
id: 19,
title: "Item_19",
thumbImgSrc: "@/public/assets/item/original/item_19.svg",
mainImgSrc: "@/public/assets/item/original/item_19.svg",
thumbImgSrc: "/assets/item/original/item_19.svg",
mainImgSrc: "/assets/item/original/item_19.svg",

...ITEM_SIZE,
},
20: {
id: 20,
title: "Item_20",
thumbImgSrc: "@/public/assets/item/original/item_20.svg",
mainImgSrc: "@/public/assets/item/original/item_20.svg",
thumbImgSrc: "/assets/item/original/item_20.svg",
mainImgSrc: "/assets/item/original/item_20.svg",

...ITEM_SIZE,
},
21: {
id: 21,
title: "Item_21",
thumbImgSrc: "@/public/assets/item/original/item_21.svg",
mainImgSrc: "@/public/assets/item/original/item_21.svg",
thumbImgSrc: "/assets/item/original/item_21.svg",
mainImgSrc: "/assets/item/original/item_21.svg",

...ITEM_SIZE,
},
22: {
id: 22,
title: "Item_22",
thumbImgSrc: "@/public/assets/item/original/item_22.svg",
mainImgSrc: "@/public/assets/item/original/item_22.svg",
thumbImgSrc: "/assets/item/original/item_22.svg",
mainImgSrc: "/assets/item/original/item_22.svg",

...ITEM_SIZE,
},
23: {
id: 21,
title: "Item_23",
thumbImgSrc: "@/public/assets/item/original/item_23.svg",
mainImgSrc: "@/public/assets/item/original/item_23.svg",
thumbImgSrc: "/assets/item/original/item_23.svg",
mainImgSrc: "/assets/item/original/item_23.svg",

...ITEM_SIZE,
},
24: {
id: 22,
title: "Item_24",
thumbImgSrc: "@/public/assets/item/original/item_24.svg",
mainImgSrc: "@/public/assets/item/original/item_24.svg",
thumbImgSrc: "/assets/item/original/item_24.svg",
mainImgSrc: "/assets/item/original/item_24.svg",

...ITEM_SIZE,
},
Expand Down
Binary file removed public/assets/logo/horizontal.png
View file
Binary file not shown.
21 changes: 21 additions & 0 deletions public/assets/logo/horizontal.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file removed public/assets/logo/vertical.png
View file
Binary file not shown.
22 changes: 22 additions & 0 deletions public/assets/logo/vertical.svg
View file
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.

0 comments on commit d863b01

Please sign in to comment.