#ui
11개의 게시물
세션 리플레이 엔진 + 풀스크린 플레이어 프로토타입 붙임
🤖 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 포지션으로 처리했다. 간단한 변경이지만 사용자가 검색 가능