fix(machine): wrap debug footer so theme buttons don't get cut off

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Patrick Mulligan 2026-02-19 16:50:10 -05:00
commit a0e0c98573

View file

@ -75,7 +75,7 @@ function toggleLiveServices() {
v-if="atmStore.debugMode" v-if="atmStore.debugMode"
class="fixed inset-x-0 bottom-0 z-50 bg-popover font-mono text-xs text-popover-foreground" class="fixed inset-x-0 bottom-0 z-50 bg-popover font-mono text-xs text-popover-foreground"
> >
<div class="flex items-center gap-4 px-4 py-2"> <div class="flex flex-wrap items-center gap-2 px-4 py-2 sm:gap-4">
<Button <Button
variant="ghost" variant="ghost"
size="sm" size="sm"
@ -88,8 +88,7 @@ function toggleLiveServices() {
<Button variant="outline" size="sm" class="h-6 text-xs" @click="toggleLiveServices"> <Button variant="outline" size="sm" class="h-6 text-xs" @click="toggleLiveServices">
{{ atmStore.useLiveServices ? 'Switch to Mock' : 'Connect Live' }} {{ atmStore.useLiveServices ? 'Switch to Mock' : 'Connect Live' }}
</Button> </Button>
<span class="text-muted-foreground">|</span> <div class="flex flex-wrap items-center gap-1">
<div class="flex items-center gap-1">
<Button <Button
v-for="theme in themes" v-for="theme in themes"
:key="theme.id" :key="theme.id"