[GGFE-141] coin animation css #914
Conversation
| transform: translateY(-100%); | ||
| } | ||
|
|
||
| @for $i from 1 through 15 { |
| @@ -87,6 +105,28 @@ const useSubmitModal = (currentGame: AfterGame) => { | |||
| }); | |||
| }; | |||
|
|
|||
| const openNormalCoin = () => { | |||
There was a problem hiding this comment.
아래 openRankCoin하고 똑같이 작동하는거 같은데 테스트용으로 만들어두신걸까요??
There was a problem hiding this comment.
openNormalCoin은 normalcoin state의 값으로 모달을 열어야 하고 openRankCoin은 rankcoin의 값으로 모달을 열어야 하기 때문에 따로 두신 것 같아요. 근데 openCoin 같은 이름으로 함수를 합치고 상황에 맞게 적절한 state를 파라미터로 넘길 수도 있을 것 같네요...
components/Layout/Layout.tsx
Outdated
|
|
||
| useAxiosResponse(); | ||
| useGetUserSeason(); | ||
| useSetAfterGameModal(); | ||
| useLiveCheck(presentPath); | ||
| useAnnouncementCheck(presentPath); | ||
|
|
||
| useEffect(() => { | ||
| /* if (user.isAttended) |
There was a problem hiding this comment.
나중에 api 연결되면 isAttended 값이 false일 때만 모달 띄우는 방식으로 가는 걸까요?
There was a problem hiding this comment.
이 파일 왜인지 prettier가 동작하지 않은 것 같네요...?? Prettier 설정 한번 확인해보시면 좋을 것 같습니다
components/modal/CoinIcon.tsx
Outdated
components/modal/CoinAnimation.tsx
Outdated
| const moneyamount = Array.from({ length: amount }).map((_, index) => { | ||
| const randomTilt = tilts[Math.floor(Math.random() * 3)]; | ||
| const stackStyle = randomTilt === "none" ? styles.stack : styles.stackl; | ||
|
|
||
| return ( | ||
| <div key={index} className={`${stackStyle} ${styles.fall}`}> | ||
| <svg className={`${styles.coin}`}> | ||
| <CoinIcon /> | ||
| </svg> | ||
| </div> | ||
| ); | ||
| }); |
There was a problem hiding this comment.
저번에 코인 개수가 1개일 경우에는 좀 부족해보인다는 얘기가 있었던 것 같은데 일단은 코인 개수 그대로 보여주기로 한건가요???
| async function openChangeModal() { | ||
| openStatChangeModal(); | ||
| await new Promise((resolve) => setTimeout(resolve, 2000)); // 2초 대기 | ||
| openRankCoin(); | ||
| } |
There was a problem hiding this comment.
statChangeModal이 뜨고 2초 뒤에 코인 모달이 뜨게 되는데 statChangeModal을 단 2초간만 볼 수 있게 되어서 (코인 모달을 닫게 되면 모든 모달이 닫히게 됨) 좀 불편할수도 있을 것 같아요...
statChangeModal을 계속 볼 수 있는 방법을 생각해봐야 할 것 같습니다..
hooks/Layout/useGetUserSeason.ts
Outdated
| @@ -26,10 +41,17 @@ const useGetUserSeason = () => { | |||
| type: 'setError', | |||
| }); | |||
|
|
|||
| useEffect(() => { | |||
| console.log(user.isAttended, presentPath === '/', isLogIn); | |||
| /* async function openChangeModal() { | ||
| await new Promise((resolve) => setTimeout(resolve, 2000)); // 2초 대기 | ||
| openStatChangeModal(); | ||
| } */ |
📌 개요
💻 작업사항
✅ 변경로직