From 09aeb2a2ff70827fd5ffb842611d28b344a40fd3 Mon Sep 17 00:00:00 2001
From: Pandipipas <62224708+Pandipipas@users.noreply.github.com>
Date: Sun, 8 Feb 2026 19:56:37 +0100
Subject: [PATCH 1/4] Embed scoreboard panel in dashboard

---
 .../example/components/ScoreboardPanel.vue    | 140 ++++++++++++++++++
 src/dashboard/example/views/Dashboard.vue     |  21 +++
 src/dashboard/example/views/Scoreboard.vue    | 137 +----------------
 3 files changed, 164 insertions(+), 134 deletions(-)
 create mode 100644 src/dashboard/example/components/ScoreboardPanel.vue

diff --git a/src/dashboard/example/components/ScoreboardPanel.vue b/src/dashboard/example/components/ScoreboardPanel.vue
new file mode 100644
index 0000000..f1d7589
--- /dev/null
+++ b/src/dashboard/example/components/ScoreboardPanel.vue
@@ -0,0 +1,140 @@
+<script setup lang="ts">
+import { computed } from 'vue';
+import type { Schemas } from '../../../types';
+import { usePlayersStore } from '../stores/players';
+import { useScoreboardStore } from '../stores/scoreboard';
+
+const playersStore = usePlayersStore();
+const scoreboardStore = useScoreboardStore();
+
+const playerOptions = computed(() => {
+  const base = [{ label: '(Sin asignar)', value: '' }];
+  const entries = Object.entries(playersStore.players) as [string, Schemas.Players[string]][];
+  const options = entries.map(([id, player]) => ({
+    value: id,
+    label: player.gamertag || id,
+  }));
+  return base.concat(options);
+});
+</script>
+
+<template>
+  <div class="scoreboard-panel">
+    <div class="row items-center q-mb-md">
+      <div class="text-h4">Scoreboard</div>
+      <QSpace />
+      <QBtn
+        color="secondary"
+        outline
+        icon="swap_horiz"
+        label="Intercambiar lados"
+        class="q-mr-sm"
+        @click="scoreboardStore.swapPlayers"
+      />
+      <QBtn
+        color="secondary"
+        outline
+        icon="restart_alt"
+        label="Reset scores"
+        @click="scoreboardStore.resetScores"
+      />
+    </div>
+
+    <div class="row q-col-gutter-lg">
+      <div class="col-12 col-md-6">
+        <QCard flat bordered>
+          <QCardSection>
+            <div class="text-subtitle1 text-weight-bold">Lado izquierdo</div>
+          </QCardSection>
+          <QSeparator />
+          <QCardSection>
+            <QSelect
+              v-model="scoreboardStore.scoreboard.leftPlayerId"
+              :options="playerOptions"
+              label="Jugador"
+              dense
+              outlined
+              emit-value
+              map-options
+            />
+            <QInput
+              v-model="scoreboardStore.scoreboard.leftNameOverride"
+              label="Nombre override"
+              dense
+              outlined
+              class="q-mt-md"
+            />
+            <QInput
+              v-model.number="scoreboardStore.leftScore"
+              type="number"
+              label="Score"
+              dense
+              outlined
+              class="q-mt-md"
+              min="0"
+            />
+          </QCardSection>
+        </QCard>
+      </div>
+
+      <div class="col-12 col-md-6">
+        <QCard flat bordered>
+          <QCardSection>
+            <div class="text-subtitle1 text-weight-bold">Lado derecho</div>
+          </QCardSection>
+          <QSeparator />
+          <QCardSection>
+            <QSelect
+              v-model="scoreboardStore.scoreboard.rightPlayerId"
+              :options="playerOptions"
+              label="Jugador"
+              dense
+              outlined
+              emit-value
+              map-options
+            />
+            <QInput
+              v-model="scoreboardStore.scoreboard.rightNameOverride"
+              label="Nombre override"
+              dense
+              outlined
+              class="q-mt-md"
+            />
+            <QInput
+              v-model.number="scoreboardStore.rightScore"
+              type="number"
+              label="Score"
+              dense
+              outlined
+              class="q-mt-md"
+              min="0"
+            />
+          </QCardSection>
+        </QCard>
+      </div>
+    </div>
+
+    <QCard flat bordered class="q-mt-lg">
+      <QCardSection>
+        <div class="text-subtitle1 text-weight-bold">Detalles de la ronda</div>
+      </QCardSection>
+      <QSeparator />
+      <QCardSection>
+        <QInput
+          v-model="scoreboardStore.scoreboard.round"
+          label="Ronda (ej. Winners Finals)"
+          dense
+          outlined
+        />
+      </QCardSection>
+    </QCard>
+  </div>
+</template>
+
+<style scoped>
+.scoreboard-panel {
+  display: flex;
+  flex-direction: column;
+  gap: 16px;
+}
+</style>
diff --git a/src/dashboard/example/views/Dashboard.vue b/src/dashboard/example/views/Dashboard.vue
index d428b34..db43fe6 100644
--- a/src/dashboard/example/views/Dashboard.vue
+++ b/src/dashboard/example/views/Dashboard.vue
@@ -1,5 +1,6 @@
 <script setup lang="ts">
 import { useHead } from '@unhead/vue';
+import ScoreboardPanel from '../components/ScoreboardPanel.vue';
 
 useHead({ title: 'Dashboard' });
 </script>
@@ -10,5 +11,25 @@ useHead({ title: 'Dashboard' });
     <div class="text-body1">
       Panel principal del dashboard.
     </div>
+    <QCard bordered class="dashboard-scoreboard-window q-mt-lg">
+      <QCardSection class="dashboard-scoreboard-content">
+        <ScoreboardPanel />
+      </QCardSection>
+    </QCard>
   </QPage>
 </template>
+
+<style scoped>
+.dashboard-scoreboard-window {
+  width: 50vw;
+  height: 50vh;
+  min-width: 320px;
+  min-height: 320px;
+  overflow: hidden;
+}
+
+.dashboard-scoreboard-content {
+  height: 100%;
+  overflow-y: auto;
+}
+</style>
diff --git a/src/dashboard/example/views/Scoreboard.vue b/src/dashboard/example/views/Scoreboard.vue
index f11f63d..bc2fb0f 100644
--- a/src/dashboard/example/views/Scoreboard.vue
+++ b/src/dashboard/example/views/Scoreboard.vue
@@ -1,143 +1,12 @@
 <script setup lang="ts">
 import { useHead } from '@unhead/vue';
-import { computed } from 'vue';
-import type { Schemas } from '../../../types';
-import { usePlayersStore } from '../stores/players';
-import { useScoreboardStore } from '../stores/scoreboard';
+import ScoreboardPanel from '../components/ScoreboardPanel.vue';
 
 useHead({ title: 'Scoreboard' });
-
-const playersStore = usePlayersStore();
-const scoreboardStore = useScoreboardStore();
-
-const playerOptions = computed(() => {
-  const base = [{ label: '(Sin asignar)', value: '' }];
-  const entries = Object.entries(playersStore.players) as [string, Schemas.Players[string]][];
-  const options = entries.map(([id, player]) => ({
-    value: id,
-    label: player.gamertag || id,
-  }));
-  return base.concat(options);
-});
 </script>
 
 <template>
-  <QPage class="q-pa-lg scoreboard-page">
-    <div class="row items-center q-mb-md">
-      <div class="text-h4">Scoreboard</div>
-      <QSpace />
-      <QBtn
-        color="secondary"
-        outline
-        icon="swap_horiz"
-        label="Intercambiar lados"
-        class="q-mr-sm"
-        @click="scoreboardStore.swapPlayers"
-      />
-      <QBtn
-        color="secondary"
-        outline
-        icon="restart_alt"
-        label="Reset scores"
-        @click="scoreboardStore.resetScores"
-      />
-    </div>
-
-    <div class="row q-col-gutter-lg">
-      <div class="col-12 col-md-6">
-        <QCard flat bordered>
-          <QCardSection>
-            <div class="text-subtitle1 text-weight-bold">Lado izquierdo</div>
-          </QCardSection>
-          <QSeparator />
-          <QCardSection>
-            <QSelect
-              v-model="scoreboardStore.scoreboard.leftPlayerId"
-              :options="playerOptions"
-              label="Jugador"
-              dense
-              outlined
-              emit-value
-              map-options
-            />
-            <QInput
-              v-model="scoreboardStore.scoreboard.leftNameOverride"
-              label="Nombre override"
-              dense
-              outlined
-              class="q-mt-md"
-            />
-            <QInput
-              v-model.number="scoreboardStore.leftScore"
-              type="number"
-              label="Score"
-              dense
-              outlined
-              class="q-mt-md"
-              min="0"
-            />
-          </QCardSection>
-        </QCard>
-      </div>
-
-      <div class="col-12 col-md-6">
-        <QCard flat bordered>
-          <QCardSection>
-            <div class="text-subtitle1 text-weight-bold">Lado derecho</div>
-          </QCardSection>
-          <QSeparator />
-          <QCardSection>
-            <QSelect
-              v-model="scoreboardStore.scoreboard.rightPlayerId"
-              :options="playerOptions"
-              label="Jugador"
-              dense
-              outlined
-              emit-value
-              map-options
-            />
-            <QInput
-              v-model="scoreboardStore.scoreboard.rightNameOverride"
-              label="Nombre override"
-              dense
-              outlined
-              class="q-mt-md"
-            />
-            <QInput
-              v-model.number="scoreboardStore.rightScore"
-              type="number"
-              label="Score"
-              dense
-              outlined
-              class="q-mt-md"
-              min="0"
-            />
-          </QCardSection>
-        </QCard>
-      </div>
-    </div>
-
-    <QCard flat bordered class="q-mt-lg">
-      <QCardSection>
-        <div class="text-subtitle1 text-weight-bold">Detalles de la ronda</div>
-      </QCardSection>
-      <QSeparator />
-      <QCardSection>
-        <QInput
-          v-model="scoreboardStore.scoreboard.round"
-          label="Ronda (ej. Winners Finals)"
-          dense
-          outlined
-        />
-      </QCardSection>
-    </QCard>
+  <QPage class="q-pa-lg">
+    <ScoreboardPanel />
   </QPage>
 </template>
-
-<style scoped>
-.scoreboard-page {
-  display: flex;
-  flex-direction: column;
-  gap: 16px;
-}
-</style>

From c5c870ae5bbfe73c531ccd930833c70db832fb41 Mon Sep 17 00:00:00 2001
From: Pandipipas <62224708+Pandipipas@users.noreply.github.com>
Date: Sun, 8 Feb 2026 20:34:33 +0100
Subject: [PATCH 2/4] Adjust dashboard scoreboard sizing

---
 src/dashboard/example/views/Dashboard.vue | 7 ++-----
 1 file changed, 2 insertions(+), 5 deletions(-)

diff --git a/src/dashboard/example/views/Dashboard.vue b/src/dashboard/example/views/Dashboard.vue
index db43fe6..cebc1c8 100644
--- a/src/dashboard/example/views/Dashboard.vue
+++ b/src/dashboard/example/views/Dashboard.vue
@@ -22,14 +22,11 @@ useHead({ title: 'Dashboard' });
 <style scoped>
 .dashboard-scoreboard-window {
   width: 50vw;
-  height: 50vh;
   min-width: 320px;
-  min-height: 320px;
-  overflow: hidden;
+  max-width: 100%;
 }
 
 .dashboard-scoreboard-content {
-  height: 100%;
-  overflow-y: auto;
+  padding-bottom: 16px;
 }
 </style>

From 755a6f38212b61e605f1c3863f2d2380fd4a1a03 Mon Sep 17 00:00:00 2001
From: Pandipipas <62224708+Pandipipas@users.noreply.github.com>
Date: Sun, 8 Feb 2026 20:38:39 +0100
Subject: [PATCH 3/4] Remove scoreboard route

---
 src/dashboard/example/main.vue             |  1 -
 src/dashboard/example/router.ts            |  2 --
 src/dashboard/example/views/Scoreboard.vue | 12 ------------
 3 files changed, 15 deletions(-)
 delete mode 100644 src/dashboard/example/views/Scoreboard.vue

diff --git a/src/dashboard/example/main.vue b/src/dashboard/example/main.vue
index 1579589..e41b596 100644
--- a/src/dashboard/example/main.vue
+++ b/src/dashboard/example/main.vue
@@ -7,7 +7,6 @@ const route = useRoute();
 const menuItems = [
   { label: 'Dashboard', to: '/', icon: 'dashboard' },
   { label: 'Players', to: '/players', icon: 'groups' },
-  { label: 'Scoreboard', to: '/scoreboard', icon: 'scoreboard' },
   { label: 'Graphics', to: '/graphics', icon: 'collections' },
   { label: 'Settings', to: '/settings', icon: 'settings' },
   { label: 'About', to: '/about', icon: 'info' },
diff --git a/src/dashboard/example/router.ts b/src/dashboard/example/router.ts
index bff8157..dd90558 100644
--- a/src/dashboard/example/router.ts
+++ b/src/dashboard/example/router.ts
@@ -3,7 +3,6 @@ import AboutView from './views/About.vue';
 import DashboardView from './views/Dashboard.vue';
 import GraphicsView from './views/Graphics.vue';
 import PlayersView from './views/Players.vue';
-import ScoreboardView from './views/Scoreboard.vue';
 import SettingsView from './views/Settings.vue';
 
 const router = createRouter({
@@ -11,7 +10,6 @@ const router = createRouter({
   routes: [
     { path: '/', name: 'dashboard', component: DashboardView },
     { path: '/players', name: 'players', component: PlayersView },
-    { path: '/scoreboard', name: 'scoreboard', component: ScoreboardView },
     { path: '/graphics', name: 'graphics', component: GraphicsView },
     { path: '/settings', name: 'settings', component: SettingsView },
     { path: '/about', name: 'about', component: AboutView },
diff --git a/src/dashboard/example/views/Scoreboard.vue b/src/dashboard/example/views/Scoreboard.vue
deleted file mode 100644
index bc2fb0f..0000000
--- a/src/dashboard/example/views/Scoreboard.vue
+++ /dev/null
@@ -1,12 +0,0 @@
-<script setup lang="ts">
-import { useHead } from '@unhead/vue';
-import ScoreboardPanel from '../components/ScoreboardPanel.vue';
-
-useHead({ title: 'Scoreboard' });
-</script>
-
-<template>
-  <QPage class="q-pa-lg">
-    <ScoreboardPanel />
-  </QPage>
-</template>

From 89d05df8dd21d19768e85d3d437b9b5a0915c065 Mon Sep 17 00:00:00 2001
From: Pandipipas <62224708+Pandipipas@users.noreply.github.com>
Date: Sun, 8 Feb 2026 20:45:20 +0100
Subject: [PATCH 4/4] Remove unnecessary dashboard header and description

---
 src/dashboard/example/views/Dashboard.vue | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/src/dashboard/example/views/Dashboard.vue b/src/dashboard/example/views/Dashboard.vue
index cebc1c8..537f1f0 100644
--- a/src/dashboard/example/views/Dashboard.vue
+++ b/src/dashboard/example/views/Dashboard.vue
@@ -7,10 +7,6 @@ useHead({ title: 'Dashboard' });
 
 <template>
   <QPage class="q-pa-lg">
-    <div class="text-h4 q-mb-md">Dashboard</div>
-    <div class="text-body1">
-      Panel principal del dashboard.
-    </div>
     <QCard bordered class="dashboard-scoreboard-window q-mt-lg">
       <QCardSection class="dashboard-scoreboard-content">
         <ScoreboardPanel />