Skip to content

글자 수 카운팅 추가 및 테마 CSS 토큰화#96

Merged
deholic merged 5 commits intodevelopfrom
feature/character-count
Jan 8, 2026
Merged

글자 수 카운팅 추가 및 테마 CSS 토큰화#96
deholic merged 5 commits intodevelopfrom
feature/character-count

Conversation

@deholic
Copy link
Copy Markdown
Owner

@deholic deholic commented Jan 8, 2026

Summary

  • 글 작성 상자의 입력란 아래와 버튼들의 사이 공간에 실시간 문자 수 카운팅 추가
  • 플랫폼별 동적 문자 수 제한 적용 (Mastodon: URL 23자 계산, Misskey: 순수 텍스트)
  • 인스턴스별 설정 자동 적용 (API 호출로 max_toot_chars/maxNoteLength 가져옴)
  • 문자 수 제한 초과 시 제출 방지 및 사용자 알림
  • 테마 CSS를 토큰 기반으로 정리하고 라이트/다크 테마 파일을 분리

Changes Made

  • 도메인 타입: InstanceInfo와 CharacterCountStatus 타입 추가
  • 유틸리티: 플랫폼별 문자 수 계산 함수 구현
  • API 클라이언트: Mastodon/Misskey 인스턴스 정보 조회 기능 추가
  • UI 컴포넌트: ComposeBox에 실시간 문자 수 표시 및 상태 관리
  • 스타일링: 테마별 문자 수 색상 및 테마 토큰화/분리
  • 유효성 검사: 제출 시 문자 수 제한 체크

Technical Details

  • Mastodon: /api/v1/instance -> max_toot_chars (기본 500자)
  • Misskey: /api/meta -> maxNoteLength (기본 3000자)
  • URL 처리: Mastodon은 URL을 23자로 계산, Misskey는 순수 텍스트 기준
  • CW 텍스트: 플랫폼에 따라 포함하여 계산
  • 테마: src/ui/styles/themes/light.css, src/ui/styles/themes/dark.css에 변수 정의로 정리

Fixes #94

- 도메인 타입에 InstanceInfo와 CharacterCountStatus 추가
- 플랫폼별 문자 수 계산 유틸리티 구현 (Mastodon: URL 23자 계산, Misskey: 순수 텍스트)
- MastodonHttpClient와 MisskeyHttpClient에 fetchInstanceInfo 메서드 추가
- UnifiedApiClient에 인스턴스 정보 조회 기능 통합
- ComposeBox 컴포넌트에 실시간 문자 수 표시 UI 추가
- 문자 수 제한 초과 시 제출 방지 및 알림 기능
- 라이트/다크 테마별 문자 수 색상 스타일링
- 인스턴스별 동적 문자 수 제한 적용 (Mastodon: 500자, Misskey: 3000자 기본값)

Fixes #94
@deholic deholic self-assigned this Jan 8, 2026
@deholic deholic added the enhancement New feature or request label Jan 8, 2026
@deholic deholic added this to the v0.7.0 milestone Jan 8, 2026
@deholic deholic changed the base branch from main to develop January 8, 2026 00:31
- v2 API(/api/v2/instance) 우선 시도로 최신 정보 가져오기
- configuration.statuses.max_characters 필드 확인으로 서버별 제한 적용
- v2 API 실패 시 v1 API로 안전한 fallback 처리
- 이전 버전 마스토돈 서버와의 호환성 유지

서버별 문자 수 제한을 정확히 반영하여 사용자 경험 개선
- textarea와 이미지 첨부 영역을 compose-input-container로 통합
- flexbox 레이아웃으로 글자와 이미지 겹침 문제 해결
- textarea 테두리 제거 및 vertical 리사이징만 허용
- 모든 테마(라이트/다크 + 4가지 테마)에서 일관된 디자인 제공
- CSS 선택자 단순화로 유지보수성 향상
- 글자수 카운트를 첨부 영역 오른쪽 고정 위치로 이동
- 이미지 추가 버튼을 첨부 영역 내부로 이동하여 더 자연스러운 UX 제공
- 첨부 영역 좌우 스크롤 기능 추가 (스크롤바 숨김 처리)
- 모든 테마에 맞는 외곽선 색상 적용 및 flex-shrink 방지
- 이미지가 많아져도 레이아웃이 찌그러지지 않도록 개선
@deholic deholic changed the title 글 작성시 글자 수 카운팅 추가 글자 수 카운팅 추가 및 테마 CSS 토큰화 Jan 8, 2026
@deholic deholic merged commit 1c5f58e into develop Jan 8, 2026
@deholic deholic deleted the feature/character-count branch January 8, 2026 05:07
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

enhancement New feature or request

Projects

None yet

Development

Successfully merging this pull request may close these issues.

글 작성시 글자 수 카운팅 추가

1 participant