design: beautiful table

2025-08-07 09:43:03 +02:00
parent f683c61bb1
commit 6ba486a216
1 changed files with 16 additions and 14 deletions
--- a/src/modules/5s/BoardGameWorkshop.vue
+++ b/src/modules/5s/BoardGameWorkshop.vue
@@ -29,20 +29,22 @@ const submit = () => {
  <div class="board-game-workshop prose">
    <aside>
      <h2>Tools</h2>
-      <table>
-        <thead>
-          <tr>
-            <th>Tool</th>
-            <th>Alias</th>
-          </tr>
-        </thead>
-        <tbody>
-          <tr v-for="tool in boardGameStore.tools" :key="tool.alias">
-            <td>{{ tool.name }}</td>
-            <td>{{ tool.alias }}</td>
-          </tr>
-        </tbody>
-      </table>
+      <div class="overflow-x-auto">
+        <table class="table table-zebra">
+          <thead>
+            <tr>
+              <th>Tool</th>
+              <th>Alias</th>
+            </tr>
+          </thead>
+          <tbody>
+            <tr v-for="tool in boardGameStore.tools" :key="tool.alias">
+              <td>{{ tool.name }}</td>
+              <td>{{ tool.alias }}</td>
+            </tr>
+          </tbody>
+        </table>
+      </div>
    </aside>

    <div class="main">