ggumim 인테리어 관련 물품 판매 페이지 구현 과제
https://ggumimhomedeco.netlify.app/
- 가구 위 돋보기 모양을 클릭하면 tooltip이 표시되고 버튼은 닫기버튼으로 변경
- 닫기 버튼을 클릭하면 toolt tip이 없어지고 돋보기 버튼으로 변경
- 상품설명 버튼 클릭시 tool tip 하나만 노출
- 하단 슬라이드에서 가구 선택시 해당 tool tip으로 변경
- 가구 위치에 따라 tooltip박스 위치 변경
- 전체 이미지의 width의 위쪽에 위치한 가구의 경우 tool tip이 상품 설명 버튼 밑 위치
- 전체 이미지의 width의 아래에 위치한 가구의 경우 tool tip이 상품 설명 버튼 위 위치
- 전체 이미지의 height의 왼쪽에 위치한 가구의 경우 tool tip이 상품 설명 버튼부터 시작
- 전체 이미지의 height의 오른쪽에 위치한 가구의 경우 tool tip이 상품 설명 버튼쪽에서 끝남
- 이미지 선택시 뒤에 배경색 변경
- 스와이프 라이브러리를 사용하여 스와이프 구현
- 할인율이 있는경우 이미지 우측상단에 할인율 표시
- 입점시 할인율을 표시, 미입점시 예상가로 표시
$ yarn install
$ yarn start
├── public
│ ├── index.html
├── src
│ ├── Components
│ ├── service
│ ├── styles
│ ├── page
│ └── utils
└── some_more_file.xxx
