diff --git a/src/renderer/src/pages/profile/profile-content/profile-content.scss b/src/renderer/src/pages/profile/profile-content/profile-content.scss index 4cdea61b..21acfa47 100644 --- a/src/renderer/src/pages/profile/profile-content/profile-content.scss +++ b/src/renderer/src/pages/profile/profile-content/profile-content.scss @@ -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; diff --git a/src/renderer/src/pages/profile/profile-content/profile-content.tsx b/src/renderer/src/pages/profile/profile-content/profile-content.tsx index d245aa5e..97d9b1a9 100644 --- a/src/renderer/src/pages/profile/profile-content/profile-content.tsx +++ b/src/renderer/src/pages/profile/profile-content/profile-content.tsx @@ -461,29 +461,12 @@ export function ProfileContent() { transition={{ duration: 0.3 }} >
-
- {review.game.title} -
- -
- {formatDistance( - new Date(review.createdAt), - new Date(), - { addSuffix: true } - )} -
-
+
+ {formatDistance( + new Date(review.createdAt), + new Date(), + { addSuffix: true } + )}
@@ -517,6 +500,28 @@ export function ProfileContent() { }} /> +
+
+
+
+ {review.game.title} + +
+
+
+
+