golomazov/hotelsync
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix: stabilize star rating layout — reserve label height, use inline scale
Some checks failed
Deploy to Production / deploy (push) Has been cancelled
Details

Browse Source 
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
HotelSync
2026-04-21 17:21:52 +03:00
parent d1948f95b9
commit 6165e4c67c
2 changed files with 14 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

13
src/pages/GuestReviewPage.tsx
View File

@@ -119,7 +119,8 @@ export function GuestReviewPage() {
onMouseEnter={() => setHover(i + 1)}
onMouseLeave={() => setHover(0)}
onClick={() => setRating(i + 1)}
className="transition-transform hover:scale-110 active:scale-95"
className="transition-transform active:scale-95"
style={{ transform: (hover || rating) > i ? 'scale(1.12)' : 'scale(1)' }}
>
<Star
size={40}
@@ -134,11 +135,11 @@ export function GuestReviewPage() {
))}
</div>
{(hover || rating) > 0 && (
<p className="text-sm font-medium text-slate-600 -mt-2">
{['', 'Очень плохо', 'Плохо', 'Нормально', 'Хорошо', 'Отлично!'][hover || rating]}
</p>
)}
<p className="text-sm font-medium text-slate-600 -mt-2 h-5 text-center">
{(hover || rating) > 0
? ['', 'Очень плохо', 'Плохо', 'Нормально', 'Хорошо', 'Отлично!'][hover || rating]
: ''}
</p>
{rating > 0 && config?.showTextField && (
<textarea

13
src/pages/GuestReviewQrPage.tsx
View File

@@ -111,7 +111,8 @@ export function GuestReviewQrPage() {
onMouseEnter={() => setHover(i + 1)}
onMouseLeave={() => setHover(0)}
onClick={() => setRating(i + 1)}
className="transition-transform hover:scale-110 active:scale-95"
className="transition-transform active:scale-95"
style={{ transform: (hover || rating) > i ? 'scale(1.12)' : 'scale(1)' }}
>
<Star
size={40}
@@ -126,11 +127,11 @@ export function GuestReviewQrPage() {
))}
</div>
{(hover || rating) > 0 && (
<p className="text-sm font-medium text-slate-600 -mt-2">
{['', 'Очень плохо', 'Плохо', 'Нормально', 'Хорошо', 'Отлично!'][hover || rating]}
</p>
)}
<p className="text-sm font-medium text-slate-600 -mt-2 h-5 text-center">
{(hover || rating) > 0
? ['', 'Очень плохо', 'Плохо', 'Нормально', 'Хорошо', 'Отлично!'][hover || rating]
: ''}
</p>
{rating > 0 && config?.showTextField && (
<textarea