feat(web): extract appearance settings to a separate tab

[akarabach]

Summary

• Extract Theme and Time format settings from the General tab into a new dedicated Appearance tab
• Add PaletteIcon sidebar nav item between General and Connections
• General tab retains all behavioral settings (diff wrapping, streaming, thread mode, confirmations, model, providers, etc.)
• "Restore defaults" button continues to work across all tabs

Note: This is the first PR extracting appearance settings. I'm planning to move (and add) additional appearance-related settings in a follow-up PR.

Test plan

• Verified Theme switching (system / light / dark) works from the new Appearance tab
• Verified Time format switching (system default / 12-hour / 24-hour) works from the new Appearance tab
• Verified "Restore defaults" button in the header correctly resets appearance settings across tabs
• Verified General tab no longer shows Theme / Time format rows
• Verified sidebar navigation highlights the active Appearance tab

Demo

---

Note

Low Risk
Primarily a UI re-organization with the same underlying setting writes; main risk is routing/nav wiring or regressions in the moved controls.

Overview
Adds a new Appearance settings section (/settings/appearance) and panel that hosts the existing Theme (system/light/dark) and Time format (locale/12-hour/24-hour) controls.

Updates settings navigation to include an Appearance tab (with PaletteIcon) and removes the Theme/Time format rows (and related constants/theme hook usage) from the General settings panel; the settings route tree is regenerated to register the new route.

^{Reviewed by Cursor Bugbot for commit faf108a. Bugbot is set up for automated code reviews on this repo. Configure here.}

[coderabbitai]

Important

Review skipped

Auto reviews are disabled on this repository. Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro

Run ID: b8ca66ac-841a-4f56-a4b2-bad862707f8f

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[macroscopeapp]

Approvability

Verdict: Approved

This is a mechanical code extraction that moves existing appearance settings (theme and timestamp format) from the General settings panel to a new dedicated Appearance tab. The extracted code is unchanged - same constants, same hooks, same component structure. Only routing and navigation entries were added.

^{You can customize Macroscope's approvability policy. Learn more.}

[juliusmarminge]

This makes more sense to do when adding a proper appearance system

[akarabach]

This makes more sense to do when adding a proper appearance system

didnt want to create xxxxl prs! reopened with font size settings, other appearance settings will do if the pr is fine #2174