From 8b805fbc05df442f73321154ca7f37a3bbe67b14 Mon Sep 17 00:00:00 2001 From: amankumar8084-web Date: Sun, 8 Feb 2026 10:27:07 +0530 Subject: [PATCH 1/2] Fix: Resolve signup form element overlap issue - Fixed CSS positioning conflicts between Login.css and Signup.css - Added proper spacing and margins for form elements - Fixed checkbox alignment with flex-start - Added !important overrides for critical styles - Ensured icons and toggle buttons are properly positioned --- package-lock.json | 21 +----- src/components/Signup.css | 135 +++++++++++++++++++++++++++++++++----- 2 files changed, 120 insertions(+), 36 deletions(-) diff --git a/package-lock.json b/package-lock.json index 2936ddb..07c5eef 100644 --- a/package-lock.json +++ b/package-lock.json @@ -90,7 +90,6 @@ "integrity": "sha512-e7jT4DxYvIDLk1ZHmU/m/mB19rex9sv0c2ftBtjSBv+kVM/902eh0fINUzD7UwLLNR+jU585GxUJ8/EBfAM5fw==", "dev": true, "license": "MIT", - "peer": true, "dependencies": { "@babel/code-frame": "^7.27.1", "@babel/generator": "^7.28.5", @@ -939,7 +938,6 @@ "resolved": "https://registry.npmjs.org/@firebase/app/-/app-0.14.6.tgz", "integrity": "sha512-4uyt8BOrBsSq6i4yiOV/gG6BnnrvTeyymlNcaN/dKvyU1GoolxAafvIvaNP1RCGPlNab3OuE4MKUQuv2lH+PLQ==", "license": "Apache-2.0", - "peer": true, "dependencies": { "@firebase/component": "0.7.0", "@firebase/logger": "0.5.0", @@ -1006,7 +1004,6 @@ "resolved": "https://registry.npmjs.org/@firebase/app-compat/-/app-compat-0.5.6.tgz", "integrity": "sha512-YYGARbutghQY4zZUWMYia0ib0Y/rb52y72/N0z3vglRHL7ii/AaK9SA7S/dzScVOlCdnbHXz+sc5Dq+r8fwFAg==", "license": "Apache-2.0", - "peer": true, "dependencies": { "@firebase/app": "0.14.6", "@firebase/component": "0.7.0", @@ -1022,8 +1019,7 @@ "version": "0.9.3", "resolved": "https://registry.npmjs.org/@firebase/app-types/-/app-types-0.9.3.tgz", "integrity": "sha512-kRVpIl4vVGJ4baogMDINbyrIOtOxqhkZQg4jTq3l8Lw6WSk0xfpEYzezFu+Kl4ve4fbPl79dvwRtaFqAC/ucCw==", - "license": "Apache-2.0", - "peer": true + "license": "Apache-2.0" }, "node_modules/@firebase/auth-compat": { "version": "0.6.2", @@ -1474,7 +1470,6 @@ "integrity": "sha512-0AZUyYUfpMNcztR5l09izHwXkZpghLgCUaAGjtMwXnCg3bj4ml5VgiwqOMOxJ+Nw4qN/zJAaOQBcJ7KGkWStqQ==", "hasInstallScript": true, "license": "Apache-2.0", - "peer": true, "dependencies": { "tslib": "^2.1.0" }, @@ -2165,7 +2160,6 @@ "integrity": "sha512-MWtvHrGZLFttgeEj28VXHxpmwYbor/ATPYbBfSFZEIRK0ecCFLl2Qo55z52Hss+UV9CRN7trSeq1zbgx7YDWWg==", "dev": true, "license": "MIT", - "peer": true, "dependencies": { "csstype": "^3.2.2" } @@ -2213,7 +2207,6 @@ "integrity": "sha512-NZyJarBfL7nWwIq+FDL6Zp/yHEhePMNnnJ0y3qfieCrmNvYct8uvtiV41UvlSe6apAfk0fY1FbWx+NwfmpvtTg==", "dev": true, "license": "MIT", - "peer": true, "bin": { "acorn": "bin/acorn" }, @@ -2456,7 +2449,6 @@ } ], "license": "MIT", - "peer": true, "dependencies": { "baseline-browser-mapping": "^2.9.0", "caniuse-lite": "^1.0.30001759", @@ -2567,7 +2559,6 @@ "resolved": "https://registry.npmjs.org/chart.js/-/chart.js-4.5.1.tgz", "integrity": "sha512-GIjfiT9dbmHRiYi6Nl2yFCq7kkwdkp1W/lp2J99rX0yo9tgJGn3lKQATztIjb5tVtevcBtIdICNWqlq5+E8/Pw==", "license": "MIT", - "peer": true, "dependencies": { "@kurkle/color": "^0.3.0" }, @@ -2750,8 +2741,7 @@ "version": "3.2.3", "resolved": "https://registry.npmjs.org/csstype/-/csstype-3.2.3.tgz", "integrity": "sha512-z1HGKcYy2xA8AGQfwrn0PAy+PB7X/GSj3UVJW9qKyn43xWa+gl5nXmU4qqLMRzWVLFC8KusUX8T/0kCiOYpAIQ==", - "license": "MIT", - "peer": true + "license": "MIT" }, "node_modules/debug": { "version": "4.4.3", @@ -2949,7 +2939,6 @@ "integrity": "sha512-LEyamqS7W5HB3ujJyvi0HQK/dtVINZvd5mAAp9eT5S/ujByGjiZLCzPcHVzuXbpJDJF/cxwHlfceVUDZ2lnSTw==", "dev": true, "license": "MIT", - "peer": true, "dependencies": { "@eslint-community/eslint-utils": "^4.8.0", "@eslint-community/regexpp": "^4.12.1", @@ -3750,7 +3739,6 @@ "integrity": "sha512-/imKNG4EbWNrVjoNC/1H5/9GFy+tqjGBHCaSsN+P2RnPqjsLmv6UD3Ej+Kj8nBWaRAwyk7kK5ZUc+OEatnTR3A==", "dev": true, "license": "MIT", - "peer": true, "bin": { "jiti": "bin/jiti.js" } @@ -4287,7 +4275,6 @@ } ], "license": "MIT", - "peer": true, "dependencies": { "nanoid": "^3.3.11", "picocolors": "^1.1.1", @@ -4517,7 +4504,6 @@ "resolved": "https://registry.npmjs.org/react/-/react-18.3.1.tgz", "integrity": "sha512-wS+hAgJShR0KhEvPJArfuPVN1+Hz1t0Y6n5jLrGQbkb4urgPE/0Rve+1kMB1v/oWgHgm4WIcV+i7F2pTVj+2iQ==", "license": "MIT", - "peer": true, "dependencies": { "loose-envify": "^1.1.0" }, @@ -4540,7 +4526,6 @@ "resolved": "https://registry.npmjs.org/react-dom/-/react-dom-18.3.1.tgz", "integrity": "sha512-5m4nQKp+rZRb09LNH59GM4BxTh9251/ylbKIbpe7TpGxfJ+9kv6BLkLBXIjjspbgbnIBNqlI23tRnTWT0snUIw==", "license": "MIT", - "peer": true, "dependencies": { "loose-envify": "^1.1.0", "scheduler": "^0.23.2" @@ -5121,7 +5106,6 @@ "integrity": "sha512-5gTmgEY/sqK6gFXLIsQNH19lWb4ebPDLA4SdLP7dsWkIXHWlG66oPuVvXSGFPppYZz8ZDZq0dYYrbHfBCVUb1Q==", "dev": true, "license": "MIT", - "peer": true, "engines": { "node": ">=12" }, @@ -5237,7 +5221,6 @@ "resolved": "https://registry.npmjs.org/vite/-/vite-5.4.21.tgz", "integrity": "sha512-o5a9xKjbtuhY6Bi5S3+HvbRERmouabWbyUcpXXUA1u+GNUKoROi9byOJ8M0nHbHYHkYICiMlqxkg1KkYmm25Sw==", "dev": true, - "peer": true, "dependencies": { "esbuild": "^0.21.3", "postcss": "^8.4.43", diff --git a/src/components/Signup.css b/src/components/Signup.css index 25a3444..96a5d48 100644 --- a/src/components/Signup.css +++ b/src/components/Signup.css @@ -1,44 +1,145 @@ -/* Reuse Login CSS for consistency */ +/* Signup.css - Fixed to work with existing Login.css */ @import "./Login.css"; -/* Signup specific overrides if any */ +/* Signup specific overrides */ .signup-card { - max-width: 520px; + max-width: 480px; + padding: 40px 35px !important; /* Override any existing padding */ } +/* Fix form spacing for signup - more fields than login */ +.auth-form { + margin-top: 10px !important; +} + +/* Fix terms checkbox alignment */ .terms-checkbox { - margin-bottom: 25px; display: flex; - align-items: center; - /* Vertical center */ - justify-content: center; - /* Horizontal center */ - gap: 12px; - font-size: 0.9rem; - color: var(--text-muted); - line-height: 1.4; + align-items: flex-start; /* Changed from center */ + gap: 10px; + margin: 15px 0 20px; + padding: 8px 0; + width: 100%; } -.terms-checkbox input { - margin: 0; - /* Remove manual offset */ +.terms-checkbox input[type="checkbox"] { + margin-top: 3px; /* Align with first line of text */ + width: 18px; + height: 18px; accent-color: var(--neon-cyan); - width: 17px; - height: 17px; cursor: pointer; flex-shrink: 0; } .terms-checkbox label { + font-size: 0.9rem; + color: var(--text-muted); + line-height: 1.5; cursor: pointer; user-select: none; + text-align: left; } .terms-link { color: var(--neon-cyan); font-weight: 500; + text-decoration: none; + transition: color 0.2s ease; } .terms-link:hover { + color: #fff; text-decoration: underline; +} + +/* Ensure proper spacing between form groups */ +.form-group { + margin-bottom: 20px !important; +} + +/* Fix input icon position for signup */ +.input-with-icon { + position: relative; + width: 100%; +} + +.input-icon { + position: absolute; + left: 15px; + top: 50%; + transform: translateY(-50%); + color: var(--text-muted); + font-size: 1.1rem; + z-index: 10; +} + +/* Adjust padding for inputs with icons */ +.auth-input { + padding-left: 45px !important; /* Ensure space for icon */ + padding-right: 45px !important; /* Ensure space for toggle button */ +} + +/* Fix toggle password button positioning */ +.toggle-password { + position: absolute !important; + right: 15px; + top: 50%; + transform: translateY(-50%); + background: none; + border: none; + color: var(--text-muted); + cursor: pointer; + font-size: 1.1rem; + padding: 5px; + display: flex; + align-items: center; + justify-content: center; + z-index: 10; + transition: color 0.2s; +} + +.toggle-password:hover { + color: #fff; +} + +/* Fix error message spacing */ +.error-message { + display: block; + color: #ff3366; + font-size: 0.8rem; + margin-top: 5px !important; + margin-left: 5px; + min-height: 20px; /* Reserve space to prevent layout shift */ +} + +/* Fix button spacing */ +.btn-neon-purple.w-full { + margin-top: 5px !important; + margin-bottom: 5px !important; +} + +/* Fix divider spacing */ +.divider { + margin: 20px 0 !important; +} + +/* Fix Google button spacing */ +.google-signin-btn { + margin-top: 5px !important; +} + +/* Fix footer spacing */ +.auth-footer { + margin-top: 20px !important; +} + +/* Responsive adjustments for signup */ +@media (max-width: 500px) { + .signup-card { + padding: 30px 20px !important; + } + + .terms-checkbox label { + font-size: 0.85rem; + } } \ No newline at end of file From e691f2feb900b66e1960e9f96bba21bf294605d6 Mon Sep 17 00:00:00 2001 From: amankumar8084-web Date: Mon, 9 Feb 2026 21:20:03 +0530 Subject: [PATCH 2/2] Fix: Resolve signup form element overlap --- src/components/Signup.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/src/components/Signup.css b/src/components/Signup.css index 96a5d48..a22d6ef 100644 --- a/src/components/Signup.css +++ b/src/components/Signup.css @@ -7,7 +7,7 @@ padding: 40px 35px !important; /* Override any existing padding */ } -/* Fix form spacing for signup - more fields than login */ +/* Fix form spacing for signup fields than login */ .auth-form { margin-top: 10px !important; }