Reorder dashboard cards: 3 Strikes and TV Dashboard now appear first

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
2026-03-03 00:30:38 -08:00
parent e70446a46e
commit 6cb83daa51

View File

@@ -12,6 +12,37 @@
</div>
<div v-else class="dashboard-grid">
<!-- 3 Strikes -->
<div class="card strikes-card">
<div class="card-title">3 Strikes</div>
<div class="strikes-list">
<div v-for="child in childrenStore.children" :key="child.id" class="strikes-row">
<div class="strikes-child-color" :style="{ background: child.color }"></div>
<span class="strikes-child-name">{{ child.name }}</span>
<div class="strikes-buttons">
<button
v-for="i in 3"
:key="i"
class="strike-btn"
:class="{ lit: i <= child.strikes }"
@click="toggleStrike(child, i)"
:title="`Strike ${i}`"
></button>
</div>
</div>
<div v-if="childrenStore.children.length === 0" class="empty-small">No children added yet.</div>
</div>
</div>
<!-- TV Link -->
<div class="card tv-card">
<div class="card-title">TV Dashboard</div>
<p class="tv-desc">Open this on the living room TV for the full-screen view.</p>
<a :href="`/tv/${activeChild.id}`" target="_blank" class="btn-primary">
Open TV View
</a>
</div>
<!-- Today's session card -->
<div class="card session-card">
<div class="card-title">Today's Session</div>
@@ -92,36 +123,6 @@
</div>
</div>
<!-- 3 Strikes -->
<div class="card strikes-card">
<div class="card-title">3 Strikes</div>
<div class="strikes-list">
<div v-for="child in childrenStore.children" :key="child.id" class="strikes-row">
<div class="strikes-child-color" :style="{ background: child.color }"></div>
<span class="strikes-child-name">{{ child.name }}</span>
<div class="strikes-buttons">
<button
v-for="i in 3"
:key="i"
class="strike-btn"
:class="{ lit: i <= child.strikes }"
@click="toggleStrike(child, i)"
:title="`Strike ${i}`"
>✕</button>
</div>
</div>
<div v-if="childrenStore.children.length === 0" class="empty-small">No children added yet.</div>
</div>
</div>
<!-- TV Link -->
<div class="card tv-card">
<div class="card-title">TV Dashboard</div>
<p class="tv-desc">Open this on the living room TV for the full-screen view.</p>
<a :href="`/tv/${activeChild.id}`" target="_blank" class="btn-primary">
Open TV View →
</a>
</div>
</div>
<!-- Start session dialog -->