ci: review message ui change and fix loading reviews positioning

This commit is contained in:
Moyasee
2025-10-23 10:33:29 +03:00
parent 035f6e8d24
commit acf8f340dd
2 changed files with 48 additions and 25 deletions

View File

@@ -182,6 +182,10 @@
.user-reviews__loading {
padding: calc(globals.$spacing-unit * 2);
color: rgba(255, 255, 255, 0.8);
text-align: center;
display: flex;
justify-content: center;
align-items: center;
}
.user-reviews__empty {
@@ -208,6 +212,14 @@
margin-bottom: calc(globals.$spacing-unit * 1.5);
}
.user-reviews__review-footer {
display: flex;
justify-content: space-between;
align-items: center;
margin-top: calc(globals.$spacing-unit * 1.5);
margin-bottom: calc(globals.$spacing-unit * 1.5);
}
.user-reviews__review-game {
display: flex;
align-items: center;
@@ -215,8 +227,8 @@
}
.user-reviews__game-icon {
width: 40px;
height: 40px;
width: 24px;
height: 24px;
border-radius: 8px;
object-fit: cover;
}
@@ -227,6 +239,12 @@
gap: calc(globals.$spacing-unit * 0.25);
}
.user-reviews__game-details {
display: flex;
align-items: center;
gap: calc(globals.$spacing-unit * 0.5);
}
.user-reviews__game-title {
background: none;
border: none;

View File

@@ -461,29 +461,12 @@ export function ProfileContent() {
transition={{ duration: 0.3 }}
>
<div className="user-reviews__review-header">
<div className="user-reviews__review-game">
<img
src={review.game.iconUrl}
alt={review.game.title}
className="user-reviews__game-icon"
/>
<div className="user-reviews__game-info">
<button
className="user-reviews__game-title user-reviews__game-title--clickable"
onClick={() =>
navigate(buildGameDetailsPath(review.game))
}
>
{review.game.title}
</button>
<div className="user-reviews__review-date">
{formatDistance(
new Date(review.createdAt),
new Date(),
{ addSuffix: true }
)}
</div>
</div>
<div className="user-reviews__review-date">
{formatDistance(
new Date(review.createdAt),
new Date(),
{ addSuffix: true }
)}
</div>
<div className="user-reviews__review-score-stars">
@@ -517,6 +500,28 @@ export function ProfileContent() {
}}
/>
<div className="user-reviews__review-footer">
<div className="user-reviews__review-game">
<div className="user-reviews__game-info">
<div className="user-reviews__game-details">
<img
src={review.game.iconUrl}
alt={review.game.title}
className="user-reviews__game-icon"
/>
<button
className="user-reviews__game-title user-reviews__game-title--clickable"
onClick={() =>
navigate(buildGameDetailsPath(review.game))
}
>
{review.game.title}
</button>
</div>
</div>
</div>
</div>
<div className="user-reviews__review-actions">
<div className="user-reviews__review-votes">
<motion.button