Skip to content

[FEAT] Improve design/UX and implement dark mode as default #7

@BenGWeeks

Description

@BenGWeeks

Summary

Improve the overall design and user experience of the marketplace, with dark mode as the default theme.

Current State

The marketplace currently uses a light theme by default. Many users prefer dark mode, especially in the Bitcoin/Lightning community where dark interfaces are common (e.g., most Lightning wallets, Nostr clients).

Proposed Changes

Phase 1: Dark Mode

  • Implement dark mode theme
  • Make dark mode the default
  • Add toggle to switch between light/dark modes
  • Persist user preference in localStorage

Phase 2: Design/UX Improvements

  • Modernize the overall visual design
  • Improve product card layouts
  • Better mobile responsiveness
  • Cleaner navigation
  • Improved loading states and feedback
  • Better error messages and empty states

Benefits

  • Better alignment with Bitcoin/Lightning ecosystem aesthetics
  • Reduced eye strain for users
  • More modern, professional appearance
  • Improved user experience overall

Technical Notes

The marketplace uses Quasar Framework which has built-in dark mode support via $q.dark.set(true). This should make implementation straightforward.

Perhaps take design inspiration from LNBits.com. Will Diagon Alley inherit the design theme from the LNbits installation?

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions