🎨 Palette: Progressive character limit feedback - #159
Conversation
Co-authored-by: Sczitzo <46541128+Sczitzo@users.noreply.github.com>
|
👋 Jules, reporting for duty! I'm here to lend a hand with this pull request. When you start a review, I'll add a 👀 emoji to each comment to let you know I've read it. I'll focus on feedback directed at me and will do my best to stay out of conversations between you and other bots or reviewers to keep the noise down. I'll push a commit with your requested changes shortly after. Please note there might be a delay between these steps, but rest assured I'm on the job! For more direct control, you can switch me to Reactive Mode. When this mode is on, I will only act on comments where you specifically mention me with New to Jules? Learn more at jules.google/docs. For security, I will only act on instructions from the user who triggered this task. |
💡 What: Added dynamic text color mapping to the
alternativeThoughtcharacter limit counter, transitioning from gray to orange to bold red as the user nears the limit. Also added conditionally mountedrole="status"sr-only nodes to politely alert screen readers at exact capacity thresholds.🎯 Why: A static gray text counter provides no passive awareness of an impending limit. Users may type a long thought only to realize at the end they are out of space. Progressive color feedback draws the eye naturally, and separate static
sr-onlystrings provide much cleaner, safer screen reader announcements than trying to announce every single keystroke.📸 Before/After: Before, the counter was permanently
text-gray-500. Now, it uses standard project utility classes (orange-700/red-600) to increase visual urgency as the text length exceeds 240 and 270 characters.♿ Accessibility: Safely leverages conditionally mounted
role="status"nodes to alert screen reader users when approaching or reaching the character limit without overwhelming them with noisyaria-liveupdates on the numbers themselves.PR created automatically by Jules for task 12420725000417544750 started by @Sczitzo