Skip to content

Conversation

@wesbillman
Copy link
Collaborator

Summary

Adds a font picker to the theme settings, allowing users to customize both UI and code (monospace) fonts.

Features

  • System font discovery: Uses font-kit crate to enumerate all available system fonts
  • Tabbed font picker: Separate tabs for Code fonts and UI fonts
  • Smart categorization: Automatically categorizes fonts as monospace based on keywords (mono, code, console, etc.)
  • Font preview: Each font in the list is displayed in its own typeface
  • Persistence: Font selection saved to localStorage and restored on app startup
  • Search: Filter fonts by name

Implementation

Backend (Rust)

  • Added font-kit = "0.14" dependency
  • New list_system_fonts Tauri command

Frontend

  • New fonts.svelte.ts store for font state management
  • New FontSelectorModal.svelte component
  • CSS variables --font-family (UI) and --font-mono (code)
  • Updated all components to use var(--font-mono) instead of hardcoded font stacks

UI

The font picker is accessible via the "T" (Type) icon in the top bar, next to the theme picker.

Font picker location

Testing

  • just check-all passes
  • UI font changes apply to interface text
  • Code font changes apply to diff viewer and all monospace text

- Add font-kit crate for system font discovery
- Create list_system_fonts Tauri command to enumerate available fonts
- Add fonts.svelte.ts store for font selection state and persistence
- Create FontSelectorModal with tabbed UI/Code font picker
- Add --font-family and --font-mono CSS variables
- Replace hardcoded monospace fonts with var(--font-mono) across components
- Initialize fonts on app startup, persist selection to localStorage
@wesbillman
Copy link
Collaborator Author

xsmall.mov

Move getCategorizedFonts() call inside the derived block to ensure
proper reactivity when systemFonts state updates or tab changes.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants