From 91fbf66b1d61788285e91902815cb603dda1cadf Mon Sep 17 00:00:00 2001
From: Zsolt Tasnadi <rastasi@gmail.com>
Date: Tue, 4 Aug 2026 10:14:34 +0200
Subject: [PATCH] more fa icons for matrix

---
 .../src/page/builds/BuildsIndexPage.vue       | 24 +++++++++++++++++--
 1 file changed, 22 insertions(+), 2 deletions(-)

diff --git a/apps/frontend/src/page/builds/BuildsIndexPage.vue b/apps/frontend/src/page/builds/BuildsIndexPage.vue
index fc7b902..91a5ff5 100644
--- a/apps/frontend/src/page/builds/BuildsIndexPage.vue
+++ b/apps/frontend/src/page/builds/BuildsIndexPage.vue
@@ -34,7 +34,10 @@
           </thead>
           <tbody>
             <tr v-for="(info, platform) in data.platforms" :key="platform" class="builds-row">
-              <td class="builds-td-engine">{{ info.label }}</td>
+              <td class="builds-td-engine">
+                <i :class="engineIcons[platform as string] || defaultEngineIcon" class="builds-engine-icon"></i>
+                {{ info.label }}
+              </td>
               <template v-for="group in columnGroups" :key="group.label">
                 <td v-for="(col, colIdx) in group.kinds" :key="col.kind" :class="['builds-td-kind', group.color, { 'builds-group-start': colIdx === 0 }]">
                   <i v-if="info.kinds.includes(col.kind)" class="fa-solid fa-check builds-check"></i>
@@ -50,7 +53,10 @@
     <!-- Mobile cards -->
     <div v-if="data" class="builds-mobile">
       <div v-for="(info, platform) in data.platforms" :key="platform" class="builds-card">
-        <h3 class="builds-card-title">{{ info.label }}</h3>
+        <h3 class="builds-card-title">
+          <i :class="engineIcons[platform as string] || defaultEngineIcon" class="builds-engine-icon"></i>
+          {{ info.label }}
+        </h3>
         <div v-for="group in columnGroups" :key="group.label" :class="['builds-card-group', group.color]">
           <div class="builds-card-group-header">
             <i :class="group.icon" class="builds-card-group-icon"></i>
@@ -86,6 +92,17 @@ const { t } = useI18n()
 const store = useBuildsStore()
 const { data, error } = storeToRefs(store)
 
+const engineIcons: Record<string, string> = {
+  tic80: 'fa-solid fa-tv',
+  ebitengine: 'fa-brands fa-golang',
+  love: 'fa-solid fa-heart',
+  godot: 'fa-solid fa-robot',
+  c64: 'fa-solid fa-floppy-disk',
+  bevy: 'fa-solid fa-cubes',
+  phaser: 'fa-solid fa-bolt',
+}
+const defaultEngineIcon = 'fa-solid fa-cube'
+
 const columnGroups = [
   {
     label: 'Windows',
@@ -232,6 +249,9 @@ th.group-gray.builds-group-start, td.group-gray.builds-group-start { @apply bord
 .builds-td-engine {
   @apply px-6 py-4 font-bold text-gray-900 whitespace-nowrap;
 }
+.builds-engine-icon {
+  @apply text-gray-400 text-sm mr-2;
+}
 .builds-td-kind {
   @apply px-3 py-4 text-center;
 }