Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feature/#206 이전 텍스트 스타일 연속으로 적용 #209

Merged

Conversation

Ludovico7
Copy link
Collaborator

📝 변경 사항

🔍 변경 사항 설명

  • 텍스트 모달 UX 개선
    • 텍스트를 드래그하고 있는 상태에서 모달창 내부를 클릭할때는 포커스 사라지지 않음
    • 색상과 배경 버튼은 hover할때만 서브 모달이 나오고, 두 버튼을 클릭해도 동작하지 않도록 수정
  • 텍스트 입력시, 이전 텍스트에 스타일이 적용되어 있으면 동일한 스타일로 삽입

🙏 질문 사항

  • 평소에는 잘 작동하는데, 맥 영상 녹화를 틀면 버튼에 마우스를 올려도 포인터로 안바뀌는 문제가 있습니다. 코드 문제는 아닌 것 같은데, 이유를 잘 모르겠습니다...

📷 스크린샷 (선택)

style.mov

✅ 작성자 체크리스트

  • Self-review: 코드가 스스로 검토됨
  • Unit tests 추가 또는 수정
  • 로컬에서 모든 기능이 정상 작동함
  • 린터 및 포맷터로 코드 정리됨
  • 의존성 업데이트 확인
  • 문서 업데이트 또는 주석 추가 (필요 시)

- 텍스트를 드래그하고 있는 상태에서 모달창 내부를 클릭할때는 포커스 사라지지 않음
- 색상과 배경 버튼은 hover할때만 서브 모달이 나오고, 두 버튼을 클릭해도 동작하지 않도록 수정
- 옵션 모달 위치를 모달 컨테이너 밖으로 위치
- 모달 내부를 클릭해도 포커스 사라지지 않음
@Ludovico7 Ludovico7 added Bug 기능 또는 UI에서 발생한 오류나 예상치 못한 동작을 해결 FE 프론트엔드 작업 Design 사용자 UI 레이아웃 디자인 및 CSS 스타일 변경 labels Nov 26, 2024
@Ludovico7 Ludovico7 self-assigned this Nov 26, 2024
setHoveredType(null);
}
const handleModalClick = (e: React.MouseEvent<HTMLDivElement>) => {
e.preventDefault();
Copy link
Member

@pipisebastian pipisebastian Nov 26, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

혹시 텍스트 포커스되는게 유지되는거는 이 이벤트 막는거 때문일까요?? 궁금합니당!

Copy link
Collaborator Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

네 맞습니다! onMouseDown 이벤트를 막아줘야 포커스가 안풀립니다!

Copy link
Member

@pipisebastian pipisebastian left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

수고하셨습니다~!!!!

Copy link
Collaborator

@hyonun321 hyonun321 left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

연규님!! 수고하셨습니다.

이부분은 저도 구현한다면 어떻게 해야하나 머리속에서 잘 그려지지 않았는데요..😮

연규님 구현을 보니, 맨뒤, 맨앞, 중간 삽입별로 상황을 나눠서 처리를 하신걸 보니 머리속에 그려지기 시작했습니다 ㅋㅋ

이전에 있는 prevChar의 스타일을 가져오는군요. 생각을 해보면, 왼쪽에서 오른쪽으로 글을 읽기때문에 prevChar를 보는게 합당한 선택 같네요.

이제는 정말 마크다운 스타일 관련해서는 끝에 도달 한 것 같습니다.

고생 많으셨습니다 !!! 😎

@github-actions github-actions bot merged commit f39cdbd into dev Nov 26, 2024
7 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Bug 기능 또는 UI에서 발생한 오류나 예상치 못한 동작을 해결 Design 사용자 UI 레이아웃 디자인 및 CSS 스타일 변경 FE 프론트엔드 작업
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants