feat: overhaul profile UI, add QR support and web creation tool

[samyuktaap]

Summary

This PR completely overhauls the public profile UI with a modern, glassmorphic design. It introduces a 'Premium Card' aesthetic with smooth animations, dynamic mesh gradient backgrounds, and an integrated QR code generator for easy contactless sharing. Additionally, it implements a new web-based profile creation workflow that allows users to instantly preview their profiles.

---

Type of Change

• Bug fix
• New feature
• Refactor (no functional change)
• UI / Design change
• Tests only
• Documentation
• Infrastructure / DevOps
• Security

---

What Changed

• Profile UI Overhaul: Redesigned apps/web/src/routes/u/[username]/+page.svelte with a premium glassmorphic layout, 3D floating animations, and dynamic gradients.
• QR Code Support: Added auto-generated QR codes directly onto the profile card for easy sharing.
• Web Creation Workflow: Improved the profile creation tool with a Create-to-Preview workflow.
• Merge Conflicts: Resolved upstream merge conflicts to ensure a clean branch.

---

How to Test

1. Navigate to /create to test the new profile creation flow and preview.
2. Visit a user profile (e.g., /u/username) to view the new premium glassmorphic interface and verify the 3D card layout.
3. Scan the generated QR code on the profile card to ensure it links correctly.

---

Checklist

• My code follows the project's coding style (pnpm -r run lint passes).
• TypeScript compiles without errors (pnpm -r run typecheck).
• I have added or updated tests for the changes I made.
• All tests pass locally (pnpm -r run test).
• I have updated documentation where necessary.
• No new console.log or debug statements left in the code.
• Breaking changes are documented in this PR description.

[samyuktaap]

@mohi2006august , I have submitted the PR (#89) for this task with the updated UI and QR support. Looking forward to your feedback!"

[ShantKhatri]

@samyuktaap Please update the PR description properly.

[Harxhit]

@samyuktaap Please join our discord channel -> https://discord.gg/cTpXtEyqd

[samyuktaap]

Done

…

On Sun, May 17, 2026, 3:58 PM Harshit Singh Parihar < ***@***.***> wrote: *Harxhit* left a comment (Dev-Card/DevCard#89) <#89 (comment)> @samyuktaap <https://github.com/samyuktaap> Please join our discord channel -> https://discord.gg/cTpXtEyqd — Reply to this email directly, view it on GitHub <#89 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/BZPVEIZ35V6MYECOPW2DAOD43GH5FAVCNFSM6AAAAACY6BEK5CVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHM2DINZQGI4TSMBWGA> . You are receiving this because you were mentioned.Message ID: ***@***.***>

[Harxhit]

@samyuktaap Please update your PR description

[samyuktaap]

@Harxhit I have updated the PR description and resolved all merge conflicts with the main branch. The PR should be ready for review! Let me know if you need anything else.

[samyuktaap]

@Harxhit I have updated the PR description and resolved all merge conflicts with the main branch. The PR should be ready for review! Let me know if you need anything else.

[ShantKhatri]

LGTM. Just add a demo video for this and fix the merge conflicts, will be merged.

[ShantKhatri]

No activity from last 5 days, so closing this PR.

[samyuktaap]

Hi @ShantKhatri,

Apologies for the delay. I was unable to respond within the expected timeframe.

I have already completed the implementation and would still like to contribute this enhancement. If possible, could you please reopen the PR or allow me to submit a fresh PR with the requested demo video and any additional changes required?

Thank you for your time and review.

[Harxhit]

Hi @ShantKhatri,

Apologies for the delay. I was unable to respond within the expected timeframe.

I have already completed the implementation and would still like to contribute this enhancement. If possible, could you please reopen the PR or allow me to submit a fresh PR with the requested demo video and any additional changes required?

Thank you for your time and review.

I have reopened the pr please fix the merge conflicts and pin PA.

[samyuktaap]

Thank you for reopening the PR.

I will fix the merge conflicts and update the PR shortly.

Could you please clarify what is meant by "pin PA" so that I can address it correctly?

[Harxhit]

Thank you for reopening the PR.

I will fix the merge conflicts and update the PR shortly.

Could you please clarify what is meant by "pin PA" so that I can address it correctly?

PA is Project Admin. You can pin in him discord or here.

[samyuktaap]

Hi @ShantKhatri,

I have completely resolved the merge conflicts, and the branch is now fully up to date!

I understand what you meant by "pin PA" now. Could you (or another Project Admin) please authorize the Vercel deployment preview so that the checks can run and pass?

Thank you!

[samyuktaap]

@Harxhit @ShantKhatri The branch is now fully up to date with upstream/main and all merge conflicts are resolved. Could you please authorize the Vercel deployment preview so the checks can run?

[github-actions]

CI Results — ❌ Some checks failed

🖥️ Backend (⏭️ skipped)

Check	Status
Lint	⚪ unknown
Test	⚪ unknown
Typecheck	⚪ unknown

📱 Mobile (⏭️ skipped)

Check	Status
Lint	⚪ unknown
Test	⚪ unknown

🌐 Web (❌ failure)

Check	Status
Check	❌ failure
Build	✅ success

---

🕐 Last updated: Wed, 03 Jun 2026 05:30:04 GMT

[samyuktaap]

@Harxhit @ShantKhatri Just a heads up, the web-ci is currently failing on this PR because of the recent switch to pull_request_target in the CI workflow. By default, actions/checkout checks out the base branch instead of the PR merge commit. Because the base main branch currently has a TypeScript error (copyMessageTimeout is used before being assigned) in +page.svelte, the CI fails. The maintainers will need to fix the actions/checkout step in the main branch workflow (by adding ref: ${{ github.event.pull_request.head.sha }}) or fix the TS errors on main for PRs to pass.

[ShantKhatri]

We have been migrated to React for web module(with prior notice), thanks for this PR, but this will need rework here.