스켈레톤 색상 통일 #279
Merged
스켈레톤 색상 통일 #279
Conversation
This file contains hidden or 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
Closed
📝 WalkthroughWalkthrough이 변경사항은 skeleton 컴포넌트들의 배경색을 Changes
Sequence Diagram(s)(해당 변경은 UI 스타일 및 CSS 클래스 변경에 국한되므로 시퀀스 다이어그램 생성이 적합하지 않습니다.) Estimated code review effort🎯 1 (Trivial) | ⏱️ ~3 minutes Possibly related PRs
Poem
✨ Finishing Touches
🧪 Generate unit tests
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
Documentation and Community
|
|
🚀 오늘뭐해 Preview Deploy 완료! |
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 1
🔭 Outside diff range comments (1)
apps/what-today/src/components/skeletons/activities/ReservationFormSkeleton.tsx (1)
17-17: 누락된 색상 교체 – 통일성 깨짐
캘린더 그리드 아이템만 여전히bg-gray-200을 사용하고 있어 이번 PR 목적(색상 통일)에 어긋납니다.- <div key={`calendar-${index}`} className='h-32 w-32 animate-pulse rounded bg-gray-200' /> + <div key={`calendar-${index}`} className='h-32 w-32 animate-pulse rounded bg-gray-100' />
🧹 Nitpick comments (7)
apps/what-today/src/components/skeletons/activities/ReviewSectionSkeleton.tsx (1)
8-19: 스켈레톤 색상 하드코딩 대신 디자인 토큰(또는 Tailwind 테마 변수) 사용 고려
bg-gray-100을 파일 곳곳에 직접 쓰고 있는데, 전역 색상 정책이 또 변경될 경우 동일 파일뿐 아니라 전체 컴포넌트에서 일괄 교체가 필요합니다.Tailwind
theme.extend.colors에skeleton같은 별칭을 등록해 두거나, 디자인 시스템 util-class(예:bg-skeleton)를 두면 색상 변경 시 유지보수가 훨씬 수월합니다.
기능상 문제는 없으므로 필수는 아니지만, 장기적으로 색상 일관성과 유지보수성을 높일 수 있는 방향입니다.apps/what-today/src/components/skeletons/activities/ActivitiesDescriptionSkeleton.tsx (1)
5-13: 하드코딩된 Tailwind 색상 → 디자인 토큰으로 추출 고려여러 스켈레톤 컴포넌트에서 동일한
bg-gray-100클래스를 직접 기입하고 있는데, 추후 테마 변경 시 모든 파일을 수정해야 하는 유지보수 비용이 발생할 수 있습니다.
tw프리셋의 커스텀 색상 변수(예:bg-skeleton)를 Tailwind 설정에 추가하거나, 공용 utility class를 디자인-시스템 패키지로 이동시키면 한 곳에서 색상을 관리할 수 있어 유지보수성이 향상됩니다.apps/what-today/src/components/skeletons/activities/DividerSkeleton.tsx (1)
2-2: Tailwind 색상 하드코딩 대신 디자인 토큰 사용 고려
bg-gray-100으로 통일한 의도는 명확하지만, 여러 스켈레톤 컴포넌트에서 동일한 색상을 반복적으로 하드코딩하면 향후 디자인 시스템 변경 시 수정 범위가 넓어집니다.
packages/design-system에 스켈레톤용 배경 토큰(예:bg-skeleton)을 정의한 뒤 해당 토큰 클래스를 사용하면 유지보수성이 높아집니다.
필요 시 tailwind config의theme.extend.colors에 추가해 두세요.apps/what-today/src/components/skeletons/activities/ActivityImagesSkeleton.tsx (1)
5-25: 스켈레톤 배경색 하드코딩 반복 – 디자인 토큰으로 추출 검토
bg-gray-100클래스가 동일한 요소에 네 번 반복됩니다. 색상 통일 작업이 앞으로도 빈번할 경우 Tailwindtheme.extend또는 별도SKELETON_BG_COLOR상수로 추출하면 유지보수가 수월해집니다.apps/what-today/src/components/skeletons/activities/ActivitiesInformationSkeleton.tsx (1)
5-24: 색상 값 하드코딩 대신 테마 토큰 사용 고려스켈레톤 색상이 여러 컴포넌트에서 동일하게 반복되므로 Tailwind 플러그인(예:
@apply skeleton-bg)이나 CSS 변수(예:var(--skeleton-bg))로 추출하면 이후 디자인 가이드 변경 시 유지보수가 훨씬 수월합니다.- className='h-16 w-60 animate-pulse rounded bg-gray-100' + className='h-16 w-60 animate-pulse rounded skeleton-bg'tailwind.config.ts 예시:
theme: { extend: { backgroundColor: { 'skeleton-bg': 'var(--skeleton-bg, theme(colors.gray.100))', }, }, },apps/what-today/src/components/skeletons/activities/ActivitiesMapSkeleton.tsx (1)
5-5: Skeleton 배경색은 통일되었지만, 디자인 토큰/상수로 추출해 두면 유지보수가 훨씬 수월합니다
여러 스켈레톤 컴포넌트에서 동일한bg-gray-100값을 반복 선언하고 있으므로,
SKELETON_BG_COLOR같은 디자인 토큰을packages/design-system에 정의해 클래스 합성(clsx)으로 주입하거나, Tailwindtheme.extend.colors에 별칭을 추가하는 방식을 권장합니다.
나중에 색상 조정 시 파일 전역 검색 없이 한 곳만 고치면 되어 생산성이 높아집니다.Also applies to: 8-8, 12-12
apps/what-today/src/components/skeletons/activities/ReviewCardSkeleton.tsx (1)
7-13: 다크 모드 대비 색상 대비 확인 필요현재 밝은 회색(
bg-gray-100)은 라이트 모드에서는 보기 좋지만, 다크 모드 전환 시 skeleton이 거의 보이지 않을 가능성이 있습니다.
dark:bg-gray-700정도의 대안을 함께 지정하거나 앞서 제안한 토큰 방식으로 다크 변형을 정의해 두는 것을 권장드립니다.
📜 Review details
Configuration used: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (12)
apps/what-today/src/components/FloatingTranslateButton.tsx(2 hunks)apps/what-today/src/components/skeletons/activities/ActivitiesDescriptionSkeleton.tsx(1 hunks)apps/what-today/src/components/skeletons/activities/ActivitiesInformationSkeleton.tsx(1 hunks)apps/what-today/src/components/skeletons/activities/ActivitiesMapSkeleton.tsx(1 hunks)apps/what-today/src/components/skeletons/activities/ActivityDetailPageSkeleton.tsx(1 hunks)apps/what-today/src/components/skeletons/activities/ActivityImagesSkeleton.tsx(1 hunks)apps/what-today/src/components/skeletons/activities/DividerSkeleton.tsx(1 hunks)apps/what-today/src/components/skeletons/activities/ReservationFormSkeleton.tsx(2 hunks)apps/what-today/src/components/skeletons/activities/ReviewCardSkeleton.tsx(1 hunks)apps/what-today/src/components/skeletons/activities/ReviewSectionSkeleton.tsx(1 hunks)apps/what-today/src/components/skeletons/reservations-list/ReservationCardSkeleton.tsx(1 hunks)apps/what-today/src/components/skeletons/reservations-list/ReservationsListPageSkeleton.tsx(3 hunks)
🧰 Additional context used
🧠 Learnings (9)
📓 Common learnings
Learnt from: kjhyun0830
PR: What-Today-FE/What-Today#77
File: apps/what-today/src/pages/mypage/manage-activities/index.tsx:50-63
Timestamp: 2025-07-19T01:23:56.149Z
Learning: User kjhyun0830 follows an incremental development approach in What-Today project, implementing UI first and adding functionality in later iterations, as confirmed in PR #77 for the experience management page.
Learnt from: kjhyun0830
PR: What-Today-FE/What-Today#219
File: apps/what-today/src/pages/mypage/main/index.tsx:108-157
Timestamp: 2025-08-03T00:45:03.763Z
Learning: kjhyun0830은 What-Today 프로젝트의 마이페이지(apps/what-today/src/pages/mypage/main/index.tsx)에서 다음 브랜치에 스켈레톤 UI 작업과 함께 로딩 상태 처리를 구현할 계획이라고 언급함.
Learnt from: HarrySeop
PR: What-Today-FE/What-Today#89
File: packages/design-system/src/components/bottomsheet/hooks/index.ts:44-51
Timestamp: 2025-07-21T04:36:28.477Z
Learning: HarrySeop encountered a scroll restoration issue in the useBodyScrollLock hook where the base page jumps to the top during mount/unmount of the bottom sheet component. They tried adding isLocked check in cleanup function and ref-based approaches but both failed to resolve the issue. They decided to defer this fix to a later refactoring.
Learnt from: Taeil08
PR: What-Today-FE/What-Today#125
File: packages/design-system/src/components/DatePicker.tsx:25-28
Timestamp: 2025-07-24T13:33:33.202Z
Learning: packages/design-system/src/components/DatePicker.tsx에서 Taeil08은 sr-only 클래스를 가진 div 요소가 달력 트리거 버튼의 세로 정렬에 필요하다고 설명했음. 이 요소를 제거하면 버튼 정렬이 깨지는 레이아웃 의존성이 있음.
Learnt from: HarrySeop
PR: What-Today-FE/What-Today#129
File: apps/what-today/src/pages/mypage/reservations-list/index.tsx:13-25
Timestamp: 2025-07-24T19:36:15.516Z
Learning: HarrySeop은 What-Today 프로젝트에서 API 에러 처리를 토스터(toast notification)로 처리하는 방식을 선호하며, 핸들러 함수 구현 시점에 함께 연결하는 접근 방식을 취함.
📚 Learning: the mainpage component in apps/what-today/src/pages/main/index.tsx contains placeholder/example code...
Learnt from: MyungJiwoo
PR: What-Today-FE/What-Today#43
File: apps/what-today/src/pages/main/index.tsx:7-7
Timestamp: 2025-07-14T13:36:17.941Z
Learning: The MainPage component in apps/what-today/src/pages/main/index.tsx contains placeholder/example code that will be modified later, including the fixed height class 'h-1400' which the user indicated is temporary.
Applied to files:
apps/what-today/src/components/skeletons/activities/DividerSkeleton.tsxapps/what-today/src/components/skeletons/reservations-list/ReservationsListPageSkeleton.tsxapps/what-today/src/components/skeletons/activities/ActivitiesDescriptionSkeleton.tsxapps/what-today/src/components/skeletons/activities/ActivityDetailPageSkeleton.tsxapps/what-today/src/components/skeletons/reservations-list/ReservationCardSkeleton.tsxapps/what-today/src/components/skeletons/activities/ReviewSectionSkeleton.tsxapps/what-today/src/components/skeletons/activities/ReviewCardSkeleton.tsxapps/what-today/src/components/skeletons/activities/ActivitiesMapSkeleton.tsxapps/what-today/src/components/skeletons/activities/ActivitiesInformationSkeleton.tsxapps/what-today/src/components/skeletons/activities/ActivityImagesSkeleton.tsxapps/what-today/src/components/skeletons/activities/ReservationFormSkeleton.tsx
📚 Learning: packages/design-system/src/components/datepicker.tsx에서 taeil08은 sr-only 클래스를 가진 div 요소가 달력 트리거 버튼의 세...
Learnt from: Taeil08
PR: What-Today-FE/What-Today#125
File: packages/design-system/src/components/DatePicker.tsx:25-28
Timestamp: 2025-07-24T13:33:33.202Z
Learning: packages/design-system/src/components/DatePicker.tsx에서 Taeil08은 sr-only 클래스를 가진 div 요소가 달력 트리거 버튼의 세로 정렬에 필요하다고 설명했음. 이 요소를 제거하면 버튼 정렬이 깨지는 레이아웃 의존성이 있음.
Applied to files:
apps/what-today/src/components/skeletons/activities/DividerSkeleton.tsxapps/what-today/src/components/skeletons/reservations-list/ReservationsListPageSkeleton.tsxapps/what-today/src/components/skeletons/activities/ActivitiesDescriptionSkeleton.tsxapps/what-today/src/components/skeletons/activities/ActivityDetailPageSkeleton.tsxapps/what-today/src/components/skeletons/reservations-list/ReservationCardSkeleton.tsxapps/what-today/src/components/skeletons/activities/ReviewCardSkeleton.tsxapps/what-today/src/components/FloatingTranslateButton.tsxapps/what-today/src/components/skeletons/activities/ReservationFormSkeleton.tsx
📚 Learning: kjhyun0830 프로젝트에서 @what-today/design-system 패키지의 reservationstatus 타입이 calendar/index.ts에서 re-export...
Learnt from: kjhyun0830
PR: What-Today-FE/What-Today#91
File: apps/what-today/src/pages/mypage/reservations-status/index.tsx:2-2
Timestamp: 2025-07-22T03:59:52.657Z
Learning: kjhyun0830 프로젝트에서 @what-today/design-system 패키지의 ReservationStatus 타입이 calendar/index.ts에서 re-export되지 않아 메인 엔트리 포인트에서 접근할 수 없는 문제가 있음. DayCell.tsx에서 정의된 타입들을 calendar 모듈에서 명시적으로 export해야 함.
Applied to files:
apps/what-today/src/components/skeletons/reservations-list/ReservationsListPageSkeleton.tsxapps/what-today/src/components/skeletons/reservations-list/ReservationCardSkeleton.tsxapps/what-today/src/components/skeletons/activities/ReservationFormSkeleton.tsx
📚 Learning: kjhyun0830은 what-today 프로젝트의 마이페이지(apps/what-today/src/pages/mypage/main/index.tsx)에서 다음 브랜치에 스켈레톤 u...
Learnt from: kjhyun0830
PR: What-Today-FE/What-Today#219
File: apps/what-today/src/pages/mypage/main/index.tsx:108-157
Timestamp: 2025-08-03T00:45:03.763Z
Learning: kjhyun0830은 What-Today 프로젝트의 마이페이지(apps/what-today/src/pages/mypage/main/index.tsx)에서 다음 브랜치에 스켈레톤 UI 작업과 함께 로딩 상태 처리를 구현할 계획이라고 언급함.
Applied to files:
apps/what-today/src/components/skeletons/reservations-list/ReservationsListPageSkeleton.tsxapps/what-today/src/components/skeletons/activities/ActivityDetailPageSkeleton.tsxapps/what-today/src/components/skeletons/activities/ActivitiesMapSkeleton.tsxapps/what-today/src/components/skeletons/activities/ActivitiesInformationSkeleton.tsxapps/what-today/src/components/skeletons/activities/ActivityImagesSkeleton.tsxapps/what-today/src/components/skeletons/activities/ReservationFormSkeleton.tsx
📚 Learning: in korean react calendar components, it's common to use english weekday abbreviations (s, m, t, etc....
Learnt from: kjhyun0830
PR: What-Today-FE/What-Today#31
File: packages/design-system/src/components/calendar/CalendarGrid.tsx:13-13
Timestamp: 2025-07-12T16:11:37.214Z
Learning: In Korean React calendar components, it's common to use English weekday abbreviations (S, M, T, etc.) while keeping month/year displays in Korean format. CalendarGrid can use dayjs.locale('en') for weekdays while CalendarHeader uses hardcoded Korean format strings like 'YYYY년 MM월', and these don't conflict since the Korean text is hardcoded in the format string.
Applied to files:
apps/what-today/src/components/skeletons/reservations-list/ReservationsListPageSkeleton.tsxapps/what-today/src/components/skeletons/activities/ReservationFormSkeleton.tsx
📚 Learning: taeil08 prefers using translate-x-1/2 and translate-x-1/2 for carousel navigation button positioning...
Learnt from: Taeil08
PR: What-Today-FE/What-Today#237
File: packages/design-system/src/components/Carousel/Carousel.tsx:19-25
Timestamp: 2025-08-04T04:16:10.940Z
Learning: Taeil08 prefers using translate-x-1/2 and translate-x-1/2 for carousel navigation button positioning in packages/design-system/src/components/Carousel/Carousel.tsx as it provides better flexibility for button positioning compared to fixed positioning without transforms.
Applied to files:
apps/what-today/src/components/FloatingTranslateButton.tsx
📚 Learning: in packages/design-system/src/components/button/index.tsx, harryseop uses handleclick wrapper for se...
Learnt from: HarrySeop
PR: What-Today-FE/What-Today#53
File: packages/design-system/src/components/button/index.tsx:32-41
Timestamp: 2025-07-16T06:51:15.152Z
Learning: In packages/design-system/src/components/button/index.tsx, HarrySeop uses handleClick wrapper for security purposes to prevent execution when users remove disabled attributes via developer tools. The onClick handler should be extracted from rest props before spreading to avoid being overwritten.
Applied to files:
apps/what-today/src/components/FloatingTranslateButton.tsx
📚 Learning: popovertrigger component in controlled mode (when open and onopenchange props are provided to popove...
Learnt from: MyungJiwoo
PR: What-Today-FE/What-Today#117
File: apps/what-today/src/components/notification/NotificationPopover.tsx:21-21
Timestamp: 2025-07-24T08:18:09.297Z
Learning: PopoverTrigger component in controlled mode (when open and onOpenChange props are provided to PopoverRoot) does not automatically toggle the popover state on click. The developer must provide a manual onClick handler to manage the state toggle, as the internal handleClick only works when !isControlled.
Applied to files:
apps/what-today/src/components/FloatingTranslateButton.tsx
🔇 Additional comments (15)
apps/what-today/src/components/skeletons/activities/ActivitiesDescriptionSkeleton.tsx (1)
5-13: 색상 통일 적용 확인 완료
bg-gray-100으로 일괄 변경되어 디자인 가이드에 맞게 스켈레톤 색상이 통일되었습니다. 구조나 애니메이션 동작에 문제 없으며 접근성 대비도 기존과 동일 수준입니다.apps/what-today/src/components/skeletons/reservations-list/ReservationsListPageSkeleton.tsx (1)
9-9: 배경색 통일 적용 확인 완료
bg-gray-100으로 일관성 있게 변경되어 스켈레톤 UI가 디자인 가이드와 맞춰졌습니다. 추가 이슈 없습니다.Also applies to: 21-21, 32-32
apps/what-today/src/components/skeletons/reservations-list/ReservationCardSkeleton.tsx (1)
9-31: 스켈레톤 색상 하드코딩 제거를 고려해보세요.
bg-gray-100클래스를 모든 스켈레톤 요소에 직접 기입하고 있는데, 향후 색상을 다시 변경해야 할 때 동일한 수정을 여러 파일에서 반복해야 하는 유지보수 비용이 생길 수 있습니다.
Tailwind의@apply지시어를 사용한 유틸리티 클래스(예:.skeleton-bg) 또는 CSS 변수(예:--skeleton-bg)로 색상을 추상화해두면 추후 일괄 변경이 훨씬 수월해집니다.예시:
/* skeleton.css */ .skeleton-bg { @apply bg-gray-100; }그리고 JSX:
-<div className='h-24 w-80 animate-pulse rounded-full bg-gray-100' /> +<div className='h-24 w-80 animate-pulse rounded-full skeleton-bg' />이렇게 하면 색상 정책을 중앙에서 관리할 수 있고, 다크 모드 대응이나 테마 기능 추가 시에도 유리합니다.
[ suggest_optional_refactor ]apps/what-today/src/components/skeletons/activities/ReservationFormSkeleton.tsx (4)
9-12: 배경색 변경 확인 완료
bg-gray-100으로 정상 교체되었습니다.
24-29: 배경색 변경 확인 완료
해당 구간도 일관성 있게bg-gray-100으로 변경되었습니다.
33-33: 구분선 색상 변경 확인 완료
bg-gray-100적용 확인했습니다.
38-42: 총 합계 스켈레톤 색상 변경 확인 완료
모든 placeholder가 지정된 색상으로 통일되었습니다.apps/what-today/src/components/skeletons/activities/ActivityImagesSkeleton.tsx (2)
5-25: 밝은 톤 변경 시 명도 대비(contrast) 확인 필요
bg-gray-100은 기본 페이지 배경색(아마도white혹은gray-50)과 명도 차가 크지 않을 수 있습니다. Skeleton 애니메이션이 시각적 피드백을 주긴 하지만, 저시력 사용자를 위해 WCAG 2.1 AA 기준(3:1 이상) 충족 여부를 디자인 측과 다시 한번 점검해주세요.
5-25: 변경 자체는 문제없음
색상 일괄 변경과 클래스 추가 외에 로직 변경이 없으며, 컴파일/런타임 오류 가능성도 없습니다.apps/what-today/src/components/FloatingTranslateButton.tsx (2)
339-343: UI 개선이 적절히 적용되었습니다언어 선택 버튼에
cursor-pointer클래스를 추가하여 사용자 경험을 개선했습니다. 참고로<button>요소는 기본적으로 포인터 커서를 표시하지만, 명시적으로 지정하는 것이 코드의 명확성과 일관성 측면에서 도움이 됩니다.
358-358: 메인 버튼에도 일관성 있게 적용되었습니다플로팅 버튼에도
cursor-pointer를 추가하여 UI 일관성을 유지했습니다. 전체적으로 사용자 인터페이스의 상호작용 affordance가 개선되었습니다.apps/what-today/src/components/skeletons/activities/ActivitiesInformationSkeleton.tsx (2)
5-24: 스켈레톤 색상 통일 반영 👍
bg-gray-200→bg-gray-100로 일괄 교체되어 이번 PR 목적에 정확히 부합합니다. 다른 로직 변경이 없고 시각적 일관성도 확보되었습니다.
18-19: 비표준 Tailwind 폭 유틸리티 확인 필요
w-200과 같은 클래스는 기본 Tailwind 프리셋에 존재하지 않습니다.
- 프로젝트 전역에서
theme.spacing[200]을 확장한 것이라면 문제없지만,- 아니라면 빌드 시 purge 단계에서 제거되어 스타일이 적용되지 않습니다.
한번 tailwind 설정을 재확인해 주세요.
apps/what-today/src/components/skeletons/activities/ReviewCardSkeleton.tsx (1)
7-23: 색상 통일 작업 확인 완료
bg-gray-200→bg-gray-100일관 변경이 의도대로 잘 반영되었습니다. 추가 로직 변경 사항은 없으며 런타임에 영향 없습니다.apps/what-today/src/components/skeletons/activities/ActivityDetailPageSkeleton.tsx (1)
52-59: 스켈레톤 색상 통일: bg-gray-200 제거 필요
apps/what-today/src/components/skeletons/activities/ReservationFormSkeleton.tsx(17행)에서 여전히bg-gray-200이 사용되고 있습니다. 디자인 가이드에 맞춰bg-gray-100으로 교체해주세요.수정 예시:
- <div key={`calendar-${index}`} className='h-32 w-32 animate-pulse rounded bg-gray-200' /> + <div key={`calendar-${index}`} className='h-32 w-32 animate-pulse rounded bg-gray-100' />⛔ Skipped due to learnings
Learnt from: kjhyun0830 PR: What-Today-FE/What-Today#219 File: apps/what-today/src/pages/mypage/main/index.tsx:108-157 Timestamp: 2025-08-03T00:45:03.763Z Learning: kjhyun0830은 What-Today 프로젝트의 마이페이지(apps/what-today/src/pages/mypage/main/index.tsx)에서 다음 브랜치에 스켈레톤 UI 작업과 함께 로딩 상태 처리를 구현할 계획이라고 언급함.Learnt from: kjhyun0830 PR: What-Today-FE/What-Today#91 File: apps/what-today/src/pages/mypage/reservations-status/index.tsx:2-2 Timestamp: 2025-07-22T03:59:52.657Z Learning: kjhyun0830 프로젝트에서 @what-today/design-system 패키지의 ReservationStatus 타입이 calendar/index.ts에서 re-export되지 않아 메인 엔트리 포인트에서 접근할 수 없는 문제가 있음. DayCell.tsx에서 정의된 타입들을 calendar 모듈에서 명시적으로 export해야 함.Learnt from: Taeil08 PR: What-Today-FE/What-Today#125 File: packages/design-system/src/components/DatePicker.tsx:25-28 Timestamp: 2025-07-24T13:33:33.202Z Learning: packages/design-system/src/components/DatePicker.tsx에서 Taeil08은 sr-only 클래스를 가진 div 요소가 달력 트리거 버튼의 세로 정렬에 필요하다고 설명했음. 이 요소를 제거하면 버튼 정렬이 깨지는 레이아웃 의존성이 있음.Learnt from: MyungJiwoo PR: What-Today-FE/What-Today#43 File: apps/what-today/src/pages/main/index.tsx:7-7 Timestamp: 2025-07-14T13:36:17.941Z Learning: The MainPage component in apps/what-today/src/pages/main/index.tsx contains placeholder/example code that will be modified later, including the fixed height class 'h-1400' which the user indicated is temporary.Learnt from: Taeil08 PR: What-Today-FE/What-Today#237 File: packages/design-system/src/components/Carousel/Carousel.tsx:19-25 Timestamp: 2025-08-04T04:16:10.940Z Learning: Taeil08 prefers using translate-x-1/2 and translate-x-1/2 for carousel navigation button positioning in packages/design-system/src/components/Carousel/Carousel.tsx as it provides better flexibility for button positioning compared to fixed positioning without transforms.
apps/what-today/src/components/skeletons/activities/ReviewCardSkeleton.tsx
Show resolved
Hide resolved
kjhyun0830
approved these changes
Aug 5, 2025
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.
🧩 관련 이슈 번호
📌 작업 내용
✅ 체크리스트
Summary by CodeRabbit