Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[BUG]: In Singup Page contact number input field is overflowing from box in small devices. #620

Open
1 of 2 tasks
love-sonkar opened this issue Sep 5, 2023 · 3 comments · May be fixed by #621
Open
1 of 2 tasks

[BUG]: In Singup Page contact number input field is overflowing from box in small devices. #620

love-sonkar opened this issue Sep 5, 2023 · 3 comments · May be fixed by #621

Comments

@love-sonkar
Copy link

love-sonkar commented Sep 5, 2023 •
edited
Loading

Describe the bug

In singup page the contact number input is overflow from the box, when we change width to small devices

Steps to reproduce this bug

Open singup page and change the width to small devices or you can do inspect element and switch to mobile device.

Location of the bug

the bug was found in Singup page.

Expected behavior

the contact number field should be width 100% of thair parent element

don't use hardcode value in contact input field width is 300px you can change it to the 100% this will take 100% width of their parent element and solve the issue.

Screenshot

ex

Screenshots (if any)

overflowing but images

singupform

Checklist

  • I am willing to work on this issue (optional)
  • I am a GSSoC'23 contributor (optional)
@love-sonkar
Copy link
Author

I looked at your code and found the issue.
you are using a npm package called react-phone-input-2
so this package's default styling is width:300px; that's why your tailwindcss style w-full not applies so i made a small changes in your PhoneInput component there is props called inputStyle props so in this props we can pass width:"100%" to solve the bug.

Screenshot of default width

newissue

Hope you understand the propblem you can assing this proplem to me,

i have fix this propblem ##.

love-sonkar added a commit to love-sonkar/Scene-Movie-Platform that referenced this issue Sep 5, 2023
@love-sonkar
fixes sourabhsikarwar#620 issue contact number input field is overflo…
1f61fd6 
…wing from box in small devices
@love-sonkar love-sonkar linked a pull request Sep 9, 2023 that will close this issue
Open
@shubhampr07
Copy link

hello, can you assign this issue to me.

@love-sonkar
Copy link
Author

i have fixed the issue bro you can check another one

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
2 participants
@love-sonkar @shubhampr07