feat(themes): add theme folders and basic Typora compatibility

[murongg]

Users can select a desktop CSS theme folder, keep Markra’s default folder, or import a Typora stylesheet and apply its basic appearance in Markra. Light and dark appearances have independent sources, and Refresh themes reloads external edits across open windows.

Closes #722

Changes

• Add Choose theme folder, Open theme folder, manual refresh, and separate light/dark file selectors under Custom theme. Show the active path, an empty-folder hint, and Use default folder for custom locations.
• Save the folder and file choices together locally and synchronize them across windows. Switching to a different resolved folder clears file selections to avoid applying an unrelated file with the same name; cancellation or a failed change preserves the current source. Serialize choices so background refreshes cannot interrupt saving.
• Seed editable starter themes and a bilingual guide once in the default directory, preserving user edits and deletions. Read custom folders without adding, moving or changing files. Existing selections migrate to the default folder, and settings-based CSS remains an alternative and fallback.
• Automatically detect common Typora selectors/variables in both file themes and settings CSS. Use css-tree to adapt palette colors, installed fonts, heading sizes/weights/spacing, links, code fonts/backgrounds and common syntax colors into Markra's existing theme variables.
• Preserve supported selector specificity, source order, !important, and custom-property inheritance/fallbacks. Detect variable cycles, including references inside unused fallbacks, and bound dependency traversal and substitution.
• Keep original CSS unchanged through supported imports, storage and export. Accept CSS files up to 1 MiB; reject oversized imports with a clear error while retaining the current CSS. Show localized compatibility notices for skipped rules, resource dependencies and syntax errors.
• Add --editor-code-font-family while retaining CodeMirror's row geometry safeguards. Handle missing files, stale reads, startup readiness and cross-window changes; constrain long filenames in settings.

The English and Chinese READMEs and bundled theme guide explain folder selection, refresh, fallback behavior and Typora compatibility.

Validation

• corepack pnpm test — 2,851 tests passed across 273 files.
• corepack pnpm typecheck:test — passed.
• corepack pnpm build — passed, including desktop and web builds and vendor-chunk verification.
• Focused folder loading, persistence, settings UI and theme application tests — 37 tests passed across four files, including deferred saves, cross-window refreshes, successive choices, cancellation and unavailable folders.
• cargo fmt --manifest-path apps/desktop/src-tauri/Cargo.toml -- --check — passed.
• cargo test --manifest-path apps/desktop/src-tauri/Cargo.toml --lib — 294 tests passed.
• macOS QA in isolated Tauri instances covered directory selection, same-name files in different folders, cancellation, empty folders, restoring the default, restart persistence, file selection, refresh, missing-file recovery, multiple windows and long filenames. Verified custom directory contents remain unchanged. Tested Typora's GitHub, Night and Newsprint stylesheet samples, compatibility notices, code input/undo, and Preview/Source/Split transitions; the synthetic Markdown source remained unchanged.

Compatibility boundaries

Typora support is a basic appearance adapter. Arbitrary layouts and spacing, pseudo-elements, interactive selectors, nested/conditional rules, cascade layers, font shorthands and complex heading sizes are skipped. Theme fonts/images and imported stylesheets are not loaded; installed or fallback fonts are used. This does not promise complete Typora visual parity.

Automatic file watching, theme-resource bundles and export-style parity remain outside this change. Desktop gets theme-folder access; web users can use the same adapter through settings CSS/import. HTML/PDF exports retain their own styles. CI covers Linux native tests and Windows compilation; local UI testing was on macOS.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Actions	Updated
markra-web	Ready	Preview	Sep 15, 2026 12:50am UTC