Skip to content

feat(ui): redesign sidebar welcome screen and add missing translations#1447

Open
SameDesu123 wants to merge 1 commit into
kwaroran:mainfrom
SameDesu123:feature/sidebar-welcome-redesign
Open

feat(ui): redesign sidebar welcome screen and add missing translations#1447
SameDesu123 wants to merge 1 commit into
kwaroran:mainfrom
SameDesu123:feature/sidebar-welcome-redesign

Conversation

@SameDesu123
Copy link
Copy Markdown
Contributor

PR Checklist

  • Required Checks
    • Have you added type definitions?
    • Have you tested your changes?
    • Have you checked that it won't break any existing features?
  • If your PR uses models[^1], check the following:
    • Have you checked if it works normally in all models?
    • Have you checked if it works normally in all web, local, and node-hosted versions? If it doesn't, have you blocked it in those versions?
  • If your PR is highly AI generated[^2], check the following:
    • Have you understood what the code does?
    • Have you cleaned up any unnecessary or redundant code?
    • Is it not a huge change?

Summary

This PR modernizes the empty state "Welcome" screen in the sidebar and ensures all localization files are fully synchronized with the newly added text keys.

Related Issues

None

Changes

  • UI Redesign: Replaced the static grayscale logo in Sidebar.svelte with a glowing Sparkles Lucide icon.
  • Aura Effect: Added a beautifully smooth, blurred cyan-to-blue gradient backdrop (blur-3xl) behind the icon to match the Risu theme without sharp boundaries.
  • Localization Sync: Added the missing welcomeToRisuai and selectBotToStartChatting translation keys to cn.ts, zh-Hant.ts, de.ts, es.ts, and vi.ts.

Impact

  • No impact on existing functionality or chat behavior.

Additional Notes

The glowing effect uses heavily blurred Tailwind CSS utilities and seamlessly assimilates into the dark background, ensuring a premium aesthetic without clashing with dynamic themes.

Preview

In dark mode In white mode
haeRrsTEiWARhrse vdhskthasierEAre

- Replace static logo with glowing Sparkles icon on welcome screen
- Add soft cyan-to-blue gradient aura matching Risu branding
- Sync welcomeToRisuai and selectBotToStartChatting keys across all supported languages (en, ko, cn, zh-Hant, de, es, vi)
@SameDesu123
Copy link
Copy Markdown
Contributor Author

SameDesu123 commented May 15, 2026

Also, change the hardcoded RisuAI to Risuai.
The aura effect colors are extracted from the Risuai logo.

Copy link
Copy Markdown
Collaborator

@cubicj cubicj left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Code-wise this looks fine. The new language keys are synced across locale files, and check, tests, and build pass locally.

This is mostly a design change, so I think the final call should follow the maintainer's preference. My only subjective note is that the welcome text wraps while the sidebar width shrinks during the closing animation, so the transition feels a little less clean.

Approving — thanks for the contribution!

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