Skip to content

fix: Login button overlaps with Google sign-in button on login modal (Closes #215) - #218

Open
suryaprakash0010 wants to merge 1 commit into
Skrishna0703:mainfrom
suryaprakash0010:bugfix/login-google-button-overlap
Open

fix: Login button overlaps with Google sign-in button on login modal (Closes #215)#218
suryaprakash0010 wants to merge 1 commit into
Skrishna0703:mainfrom
suryaprakash0010:bugfix/login-google-button-overlap

Conversation

@suryaprakash0010

Copy link
Copy Markdown

Which issue does this PR close?

Rationale for this change

Fixed the button overlapping issue in the login modal where the Login/Create Account button was overlapping with the Google sign-in button. The issue was caused by missing CSS spacing between consecutive button elements in the form. This fix improves the user experience by providing clear visual separation between interactive elements.

What changes are included in this PR?

  • LoginPopup.jsx: Wrapped both login buttons in a login-buttons div container to apply proper CSS spacing
  • LoginPopup.css: Enhanced overall spacing throughout the login modal including:
    • Fixed button overlapping with 15px gap between buttons
    • Improved form section spacing and visual hierarchy
    • Enhanced password checklist styling with better readability
    • Fixed negative margin issues in terms & conditions section
    • Added mobile-responsive spacing adjustments

Are these changes tested?

The changes have been visually tested by running the development server and confirming:

  • Buttons are properly spaced with no overlapping
  • Login modal displays correctly on both desktop and mobile
  • All form elements maintain proper visual hierarchy
  • Responsive design works across different screen sizes

Are there any user-facing changes?

Yes, this PR improves the user interface of the login modal by:

  • Eliminating button overlap issues
  • Providing better visual spacing and readability
  • Enhancing the overall user experience during authentication

The login modal now displays with proper button spacing - the Login/Create Account button and Google sign-in button are clearly separated with appropriate spacing between all form elements.

@github-actions

github-actions Bot commented Oct 2, 2025

Copy link
Copy Markdown

Thanks for creating a PR for your Issue! ☺️

We'll review it as soon as possible.
In the meantime, please double-check the file changes and ensure that all commits are accurate.

If there are any unresolved review comments, feel free to resolve them. 🙌🏼

@Skrishna0703 Skrishna0703 added GSSOC 25 Issues/PRs participating in GirlScript Summer of Code 2025 Level 1 Easy issue - 3 Points (GSSoC'25) labels Oct 3, 2025
@suryaprakash0010

Copy link
Copy Markdown
Author

please check the PR and merge it .

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

GSSOC 25 Issues/PRs participating in GirlScript Summer of Code 2025 Level 1 Easy issue - 3 Points (GSSoC'25)

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Login button overlaps with Google sign-in button on login modal

2 participants