-
Notifications
You must be signed in to change notification settings - Fork 11.6k
Labels
🐛 bugSomething isn't workingSomething isn't working
Description
Bug Description
On the "Add your details" onboarding page, the Bio textarea has two issues:
-
Layout Issue: When the textarea is resized (by dragging the bottom-right corner), the footer buttons overlay the bottom portion of the textarea content, making text invisible and uneditable.
-
Missing Character Limit: The Bio field has no character limit or counter, allowing users to enter unlimited text which can cause:
- Database issues if there's a backend limit
- Poor UX (users don't know the limit)
- Performance issues with very long text
Steps to Reproduce
- Go to the onboarding flow (first-time user setup)
- Navigate to "Add your details" page
- Type or paste a long text in the Bio field (e.g., Lorem Ipsum paragraph)
- Drag the bottom-right corner of the Bio textarea to resize it larger
- Observe that the bottom portion of text is hidden under the Continue/Back buttons
- Notice there's no character limit or counter
Expected Behavior
- The Bio textarea should have a maximum height with internal scrolling
- The Bio field should have a character limit (e.g., 256 characters)
- A character counter should show remaining characters (e.g., "45/256")
- Footer buttons should never overlay textarea content
Actual Behavior
- Textarea can be resized infinitely
- No character limit exists
- No character counter visible
- Footer buttons overlay textarea content when resized
- Users don't know how long their bio can be
Screenshots
Problem 1 - brave: Buttons overlay textarea with no text limit
Problem 2 - chrome: no proper gap between Bio textarea and buttons
Proposed Fix
- Add
max-h-[200px] resize-y overflow-y-autoto limit textarea height - Add
maxLength={256}to enforce character limit - Add character counter component showing "X/256 characters"
- Add proper spacing (
mb-8) between textarea and footer
Environment
- Browsers tested: Chrome, Brave (100% zoom)
- Device: Desktop
Metadata
Metadata
Assignees
Labels
🐛 bugSomething isn't workingSomething isn't working