feat: add star icon and styled steam review score to game cards

- Show steamReviewScore on games list cards in compact badge row with star icon
- Update search result right panel to use blue-400 styling with star icon
- Include "Positive" label on search results for clarity
This commit is contained in:
2026-04-30 22:15:09 +08:00
parent 99766d3b4b
commit 730793d6b6
2 changed files with 13 additions and 2 deletions
+8
View File
@@ -686,6 +686,14 @@ function GameCard({ game }: { game: GamesListItem }) {
compact
/>
)}
{game.steamReviewScore != null && (
<span className="inline-flex items-center gap-1 text-[10px] text-blue-400">
<svg className="h-2.5 w-2.5" viewBox="0 0 24 24" fill="currentColor">
<path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z" />
</svg>
{game.steamReviewScore}%
</span>
)}
</div>
<div className="mt-1.5 flex items-center gap-2 flex-wrap">
{game.benchmarkCount > 0 ? (
+5 -2
View File
@@ -503,8 +503,11 @@ function SearchResultCard({
{/* Steam review score */}
{result.steamReviewScore != null && (
<span className="text-xs text-zinc-400">
{result.steamReviewScore}% positive
<span className="inline-flex items-center gap-1 text-xs text-blue-400">
<svg className="h-3 w-3" viewBox="0 0 24 24" fill="currentColor">
<path d="M12 2l3.09 6.26L22 9.27l-5 4.87 1.18 6.88L12 17.77l-6.18 3.25L7 14.14 2 9.27l6.91-1.01L12 2z" />
</svg>
{result.steamReviewScore}% Positive
</span>
)}
</div>