[Feat] UX 개선 #161
Merged
[Feat] UX 개선 #161
Conversation
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
|
빌드를 성공했습니다! 🎉 |
|
빌드를 실패했습니다. ❌ 자세한 내용은 로그를 참고해주세요. |
|
빌드를 성공했습니다! 🎉 |
|
빌드를 성공했습니다! 🎉 |
1 similar comment
|
빌드를 성공했습니다! 🎉 |
sooyeoniya
approved these changes
Aug 18, 2024
| <p className="text-n-black">{expectations}</p> | ||
| <p | ||
| className="text-n-black max-w-full text-center" | ||
| style={{ overflowWrap: "break-word" }} |
There was a problem hiding this comment.
tailiwindCSS에 사용할 수 있는 속성이 있어서 이걸로 바꿔도 괜찮을 것 같아요! 혹시 적용이 안되는 문제였을까요?
There was a problem hiding this comment.
오 이런 속성 있는줄 몰랐네용 적용했어요! 7b3cc4b
Comment on lines
21
to
25
| <div | ||
| className="inline-flex flex-col items-center gap-500" | ||
| onClick={onClick} | ||
| {...(onClick && { style: { cursor: "pointer" } })} | ||
| > |
There was a problem hiding this comment.
스프레드 연산자를 사용하는 이유가 따로 있을까용?
제 생각에는 스프레드 연산자 말고, 그냥 조건부로 넣어줘도 클래스 속성 자체 텍스트가 분리 되지는 않아서 동적 스타일 적용 오류는 안날 것 같은데 아래처럼 하는건 어떨까여?
<div
className={`inline-flex flex-col items-center gap-500 ${onClick && "cursor-pointer"}`}
onClick={onClick}
>There was a problem hiding this comment.
아하 tailwind 안 쓰던 시절에 사용하던 방식이 익숙해서 저렇게 했었던 것 같네용,, 수정했습니다!
| const containerRef = useRef<HTMLUListElement>(null); | ||
| const transitionControls = useAnimation(); | ||
|
|
||
| const [x, setX] = useState<number>(initialX); | ||
| const [visibleCardListIdx, setVisibleCardListIdx] = useState(0); | ||
|
|
||
| const startAnimation = (x: number) => { |
There was a problem hiding this comment.
startAnimation, stopAnimation 함수는 useCallback으로 감싸줘도 될 것 같은데 어떻게 생각하시나용..?
|
빌드를 성공했습니다! 🎉 |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
🖥️ Preview
캐스퍼 쇼케이스 UX 개선
아무도 캐스퍼 봇을 만들지 않은 경우
캐스퍼 봇이 한 줄에서 무한 transition이 불가능한 경우
2024-08-16.4.56.49.mov
캐스퍼 봇이 한 줄에서 무한 transition이 가능한 경우
2024-08-16.4.54.19.mov
캐스퍼 봇이 두 줄에서 무한 transition이 가능한 경우
2024-08-16.4.54.36.mov
Windowing 방식으로 무한 Transition 개선
default.mov
스크롤 클릭 이벤트
2024-08-16.6.12.33.mov
close #160
✏️ 한 일
❗️ 발생한 이슈 (해결 방안)
크롱님이 말씀해주신대로 무한 Transition 방식을 개선해봤습니다
관련 위키 글 >> wiki
❓ 논의가 필요한 사항