See Figma for more details (Mid-Fi, Login/auth section):
https://www.figma.com/design/Xlgn5mdVa3GEx8aw2z3QfL/FCC?node-id=1627-2075&t=ezc9fHahYQ5uQoa2-0
-
Implement the signup form frontend to match the latest Figma design. This includes layout, colors, typography, and spacing for all states. Use Tailwind + shadcn components (prioritize existing components) and other design system elements within our codebase.
-
Build the page, include the background
-
Build the password + confirm password fields with proper error states (e.g., “Passwords do not match”) as shown in Figma.
-
Reference the image below (BCAN's design, use as inspiration but use our colorscheme) for password completion checks (e.g., must contain at least 1 number, min length, etc.) and implement dynamic checkmarks/feedback while the user types.
-
No backend changes; just wire up basic client-side validation and UI behavior.
Reference
Notes
If design changes, it will likely only be for the password completion checks and be very subtle, we can loop back.
See Figma for more details (Mid-Fi, Login/auth section):
https://www.figma.com/design/Xlgn5mdVa3GEx8aw2z3QfL/FCC?node-id=1627-2075&t=ezc9fHahYQ5uQoa2-0
Implement the signup form frontend to match the latest Figma design. This includes layout, colors, typography, and spacing for all states. Use Tailwind + shadcn components (prioritize existing components) and other design system elements within our codebase.
Build the page, include the background
Build the password + confirm password fields with proper error states (e.g., “Passwords do not match”) as shown in Figma.
Reference the image below (BCAN's design, use as inspiration but use our colorscheme) for password completion checks (e.g., must contain at least 1 number, min length, etc.) and implement dynamic checkmarks/feedback while the user types.
No backend changes; just wire up basic client-side validation and UI behavior.
Reference
Notes
If design changes, it will likely only be for the password completion checks and be very subtle, we can loop back.