aiolabs/bitspire
9
0
Fork 0
Code Issues 52 Pull requests 2 Projects Releases Packages Wiki Activity Actions

feat(machine): add light/dark toggle on idle screen

Browse source 
Subtle sun/moon button in bottom-left corner lets users switch
between light and dark mode. Persists via localStorage.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Patrick Mulligan 2026-02-27 20:02:10 -05:00
commit 09611c0958
1 changed files with 12 additions and 0 deletions
Download patch file Download diff file Expand all files Collapse all files

12
apps/machine/src/views/IdleView.vue
View file

@ -3,6 +3,7 @@ import { ref, computed, watch } from 'vue'
import { useRouter } from 'vue-router' import { useRouter } from 'vue-router'
import { nip19 } from 'nostr-tools' import { nip19 } from 'nostr-tools'
import { useAtmStore } from '@/stores/atm' import { useAtmStore } from '@/stores/atm'
import { useTheme } from '@/composables/useTheme'
import { Button } from '@/components/ui/button' import { Button } from '@/components/ui/button'
import { Card, CardContent } from '@/components/ui/card' import { Card, CardContent } from '@/components/ui/card'
import { Badge } from '@/components/ui/badge' import { Badge } from '@/components/ui/badge'
@ -11,6 +12,7 @@ import QRCode from '@/components/QRCode.vue'
const router = useRouter() const router = useRouter()
const atmStore = useAtmStore() const atmStore = useAtmStore()
const { colorMode } = useTheme()
const lndconnectUrl = import.meta.env.VITE_LNDCONNECT_URL || '' const lndconnectUrl = import.meta.env.VITE_LNDCONNECT_URL || ''
const showZeusQR = ref(false) const showZeusQR = ref(false)
const showLpQR = ref(false) const showLpQR = ref(false)
@ -197,6 +199,16 @@ function handleCashOut() {
</div> </div>
</div> </div>
<!-- Light/dark toggle -->
<Button
variant="ghost"
size="sm"
class="absolute bottom-4 left-4 text-xs text-muted-foreground"
@click="colorMode = colorMode === 'dark' ? 'light' : 'dark'"
>
{{ colorMode === 'dark' ? '☀' : '☾' }}
</Button>
<!-- Debug toggle (only visible when debug bar is hidden, never in production) --> <!-- Debug toggle (only visible when debug bar is hidden, never in production) -->
<Button <Button
v-if="!atmStore.debugMode && atmStore.allowMockFallback" v-if="!atmStore.debugMode && atmStore.allowMockFallback"