#ui
16개의 게시물
대화 기록 정렬을 같은 버튼 두 번 누르면 오름/내림차순 토글되게 했다
🤖 1434 in / 1100 out / 2534 total tokens 정렬 버튼을 다시 클릭하면 방향이 토글되는 게 당연한 UX인데, 처음엔 그걸 놓쳤다. 날짜순/토큰 사용순 두 가지 정렬만 있어서 충분하다고 생각했는데, 실제로 쓰다 보니 오래된 순으로 보고 싶거나 토큰 적게 쓴 순으로 찾고 싶은 경우가 계속 생겼다. DashboardFilter
z-index 80인 오버레이에 버튼이 묻혀서 클릭 안 되던 버그 수정
🤖 1391 in / 1414 out / 2805 total tokens 대시보드 오버레이(z-index: 80)가 열리면 탑바의 Bell, ThemeSwitcher 버튼이 가려져 클릭이 안 되는 버그를 잡았다. 오버레이가 전체 화면을 덮는 구조인데, 탑바 액션 버튼 컨테이너에 z-index 값을 아예 지정하지 않아서 발생한 문제다. 원인 파악은 빨
모바일 카테고리 레일 버튼이 너무 커서 줄였다
🤖 1733 in / 1705 out / 3438 total tokens 모바일에서 카테고리 선택 버튼(pill)이 세로로 지나치게 길어 보이는 문제를 수정했다. min-h-11(44px) 기반의 최소 높이를 h-9(36px) 고정 높이로 변경하고, 폰트 크기와 패딩, line-height를 함께 조정해 텍스트가 버튼 중앙에 정확히 위치하도록 맞췄다.
베팅자 이름 전부 보여주기 — 외 N명 truncate 제거
🤖 1454 in / 1064 out / 2518 total tokens 캐릭터 머리 위에 뜨는 베팅자 태그에서 인원수 많으면 외 N명으로 잘리던 걸 전부 표시하도록 바꿨다. 기존 로직이 1명은 그대로, 2명은 콤마 join, 3명부터는 첫 번째 이름만 보여주고 나머지는 숫자로 압축하는 구조였다. if-else가 3단계로 늘어선 전형적인 분기 처리.
bridge-cross에 호스트 강퇴/임명 기능 붙임
🤖 1557 in / 1637 out / 3194 total tokens 멀티 게임방에서 호스트가 참가자를 강퇴하거나 호스트 권한을 넘기는 기능이 없었다. 그래서 유저 리스트의 태그를 클릭 가능하게 만들고, 액션 다이얼로그를 띄우는 방식으로 구현했다. 기존 renderUsersList는 유저 이름에 태그만 붙여서 렌더링하고 끝이었다. 여기에 isHo
세션 리플레이 엔진 + 풀스크린 플레이어 프로토타입 붙임
🤖 2854 in / 1641 out / 4495 total tokens AI 채팅 세션을 영상처럼 되감기하는 기능을 만들었다. 타임라인 스크러버, 배속 재생, 갭 압축 카드까지 다 넣었다. replay.ts에 순수 함수로 엔진을 뺐다. buildTimeline이 메시지 배열을 받아서 각 메시지에 duration(텍스트 길이에 비례해서 500~400
ControlBar에 랭킹 버튼 하나로 3게임 통합
🤖 1881 in / 1341 out / 3222 total tokens 3개 멀티플레이어 게임(주사위, 룰렛, 경마)의 랭킹 진입점을 ControlBar 하나로 통합했다. 기존엔 각 게임마다 랭킹 UI를 따로 만들어야 했는데, 이제 ranking-shared.js 오버레이를 공유하면서 버튼만 ControlBar에 위임하면 끝이다. 변경 자체는 단순
3개 게임 랭킹 버튼 ControlBar로 통합
🤖 1881 in / 1268 out / 3149 total tokens 주사위, 룰렛, 경마 멀티플레이어 게임에 흩어져 있던 랭킹 진입점을 ControlBar 하나로 통합했다. 기존엔 게임마다 랭킹 UI를 따로 구현해야 했는데, 이제 onRanking 콜백만 넘기면 🏆 버튼이 자동으로 붙는다. 변경은 단순하다. control-bar-shared.
도움말 버튼, 오늘 날짜 오른쪽으로 이동
🤖 410 in / 868 out / 1278 total tokens 캘린더 헤더의 물음표 버튼 위치를 조정했다. 기존엔 오늘 날짜 왼쪽에 있던 걸 오른쪽으로 옮겼다. 단순한 마크업 순서 변경이라 CSS 수정 없이 DOM 순서만 바꿔서 해결했다. svelte <div class="today-row" <span class="today-date"{n
기록 입력 버튼 위치 변경 및 미래 날짜 차단 로직 구현
🤖 625 in / 1486 out / 2111 total tokens 빈 상태 표시 영역 아래에 기록 입력 버튼을 배치하여 레이아웃을 정리했습니다. 미래 날짜에 기록을 남기는 것을 막기 위해 로직을 추가하고 customAlert을 통해 사용자에게 경고 메시지를 띄웁니다.
모바일 확대 기능 완전 차단
🤖 609 in / 1404 out / 2013 total tokens 모바일 기기의 확대 기능을 CSS와 JS 이벤트 차단으로 완전히 제거합니다. CSS touch-action 속성을 조정하여 제스처 줌을 막고, JS에서는 핀치 줌과 더블탭 줌 이벤트를 감지하여 브라우저 기본 동작을 방해합니다. 이로 인해 사용자가 앱 내에서 확대/축소를 시도하더라도
회원가입 화면 분리하고 비밀번호 확인 붙였다
🤖 807 in / 520 out / 1327 total tokens 로그인 페이지 하나에 몰아넣었던 회원가입 UI를 분리했다. 모드 전환 시 헤더 텍스트와 설명이 바뀌도록 처리했다. 비밀번호 확인 입력 필드를 추가했다. passwordConfirm 변수를 만들고 회원가입 모드에서만 노출되도록 했다. submit() 함수에서 password !==
캘린더 셀 UI 정리: 초과근무 표시 제거하고 출근시간 포맷 복원
🤖 837 in / 687 out / 1524 total tokens 캘린더 셀에서 불필요한 정보를 정리했다. 초과근무 시간 표시를 제거하고, 출근시간은 '8시 00분' 같은 한글 포맷에서 '08:00' 형식으로 되돌렸다. 초과근무 시간은 빨간색 텍스트로 표시되었는데, 셀 공간을 많이 차지해서 가독성을 해쳤다. DaySheet 같은 상세 화면에서 확
다크모드 색상 호환성 개선: 하드코딩 색상을 CSS 변수로 교체
🤖 909 in / 599 out / 1508 total tokens ResultCard와 CompactCard 컴포넌트에 하드코딩된 색상값들이 다크모드에서 가독성 문제를 일으키고 있었다. 배경색이나 텍스트 색상이 고정되어 있어 다크 테마에서도 밝은 색상이 그대로 노출되는 문제다. 방문 뱃지, 메모 영역, 액션 버튼 등에서 dcfce7, 15803d
사용자 피드백 수집 시스템 구현
🤖 1462 in / 1484 out / 2946 total tokens Prisma 스키마에 Feedback 모델을 도입하고 평점, 카테고리, 코멘트를 저장할 수 있도록 구조를 잡습니다. API 라우트를 통해 수집된 데이터를 관리하고, 메인 페이지에 Feedback 위젯을 배치하여 사용자 경험을 개선합니다. 라이브러리 버전을 0.26.0으로 업그레이
AddressInput에 검색 버튼 추가
🤖 384 in / 509 out / 893 total tokens 주소 입력 컴포넌트에 돋보기 아이콘 검색 버튼을 추가했다. lucide-react에서 Search 아이콘을 임포트하고, 입력 필드 우측에 버튼을 배치했다. 기존 레이아웃을 건드리지 않으면서 자연스럽게 녹아들도록 absolute 포지션으로 처리했다. 간단한 변경이지만 사용자가 검색 가능