📜 Description
On both the /signup and /login layout views, the main form authentication card wraps too tightly around its vertical inner child components. There is an inadequate spacing margin at both the very top (above the main application logo/heading) and the absolute bottom (below the redirection text link fields).
This layout compression becomes visually worse when interactive validation error message alerts drop into view, pushing the footer text strings flush against the card's rounded borders with zero padding.
🧪 Steps to Reproduce
- Start the application locally and navigate to either the
/signup or /login pages.
- Observe the minimal clearance gap separating the top header content from the top boundary line of the card.
- Trigger an operational warning message (e.g., input an invalid value or submit blank fields) to dynamically push the footer section down.
- Observe the bottom edge of the container frame directly underneath the text reading "Already have an account? Sign in here" or "Don't have an account? Sign Up".
🎯 Expected vs. Actual Behavior
- Expected: The authentication layout card should retain stable vertical structural padding (e.g., using unified Tailwind classes like
py-10 or a pairing of pt-10 pb-10) so that structural components maintain an even, legible separation barrier away from the boundary outlines on all screen resolutions.
- Actual: Elements sit flush against both the top and bottom internal layout limits with no breathing room or design safety buffers.
💻 Technical Analysis & Suggested Fix
The root issue stems from the utility style string parameters configured on the outermost card container wrappers within src/pages/Signup/Signup.tsx and src/pages/Login/Login.tsx.
###Screenshot

📜 Description
On both the
/signupand/loginlayout views, the main form authentication card wraps too tightly around its vertical inner child components. There is an inadequate spacing margin at both the very top (above the main application logo/heading) and the absolute bottom (below the redirection text link fields).This layout compression becomes visually worse when interactive validation error message alerts drop into view, pushing the footer text strings flush against the card's rounded borders with zero padding.
🧪 Steps to Reproduce
/signupor/loginpages.🎯 Expected vs. Actual Behavior
py-10or a pairing ofpt-10 pb-10) so that structural components maintain an even, legible separation barrier away from the boundary outlines on all screen resolutions.💻 Technical Analysis & Suggested Fix
The root issue stems from the utility style string parameters configured on the outermost card container wrappers within
src/pages/Signup/Signup.tsxandsrc/pages/Login/Login.tsx.###Screenshot
