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.

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

[Footer] Subscribe component overlaps on zoom greater than 100% #3865

Closed
leecalcote opened this issue Mar 2, 2023 · 30 comments
Closed

[Footer] Subscribe component overlaps on zoom greater than 100% #3865

leecalcote opened this issue Mar 2, 2023 · 30 comments
Assignees
Labels
good first issue Good for newcomers help wanted Extra attention is needed kind/bug Something isn't working language/css

Comments

@leecalcote
Copy link
Member

Description

When a site visitor has their browser zoom level at a level higher than 100%, the subscribe component overlaps other elements in the footer.

Expected Behavior

No overlap.

Screenshots

Screenshot 2023-03-02 at 12 32 40 PM

Environment:

  • Host OS: macOS
  • Browser: Safari

Contributor Resources and Handbook

The layer5.io website uses Gatsby, React, and GitHub Pages. Site content is found under the master branch.

Join the Layer5 Community by submitting your community member form.

@leecalcote leecalcote added kind/bug Something isn't working help wanted Extra attention is needed language/css good first issue Good for newcomers labels Mar 2, 2023
@Srinja333
Copy link
Contributor

can i work on this?

@sambhavgupta0705
Copy link
Contributor

Hey @leecalcote Can I work on this one.

@leecalcote
Copy link
Member Author

Proceeding in chronological order...

@Anishsme
Copy link

Anishsme commented Mar 5, 2023

Can I please be next in line to work on this ?

@ghost
Copy link

ghost commented Mar 6, 2023

can i work on this

@Srinja333
Copy link
Contributor

Srinja333 commented Mar 9, 2023

hello @leecalcote, i am a window user how to test it in safari&macos, i have downloaded safari but it does not work properly, and also try to use playwright, but getting error?

@Srinja333 Srinja333 removed their assignment Mar 9, 2023
@Nikhil-Ladha
Copy link
Contributor

@sambhavgupta0705 , @Anishsme , @Darrendsouza1111 does either of you have access to Safari?

@ghost
Copy link

ghost commented Mar 10, 2023

@sambhavgupta0705 , @Anishsme , @Darrendsouza1111 does either of you have access to Safari?

i dont.Is there any alternative way?

@UsmanDev09
Copy link
Contributor

Can I work on this? @leecalcote @Nikhil-Ladha

@Nikhil-Ladha
Copy link
Contributor

@UsmanDev09 do you have access to Safari? And, do you have the site up and running locally?

@UsmanDev09
Copy link
Contributor

UsmanDev09 commented Mar 22, 2023 via email

@Nikhil-Ladha
Copy link
Contributor

I do have site up and running locally on linux. But, I I can set up my environment on Macbook too to access Safari

The thing is the issue is reproducible only on Safari, so you need access to Safari to fix this issue properly.
That said, once you havee the site setup done on Mac, let me know I will assign the issue to you.

@Gaurav-08-dev
Copy link

Hey @Nikhil-Ladha , is this issue resolved ? As I setup up the project locally and tried recreating the bug on safari, there is no overlapping of subscribe component on zoom greater than 100%

@chiragchhabria2
Copy link

Hey, can I get this? I have already fixed the issue in my local repo.

@stale
Copy link

stale bot commented Jun 10, 2023

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

@stale stale bot added the issue/stale Issue has not had any activity for an extended period of time label Jun 10, 2023
@vishalvivekm vishalvivekm removed the issue/stale Issue has not had any activity for an extended period of time label Jun 11, 2023
@nakulbh
Copy link

nakulbh commented Jul 23, 2023

HEY @leecalcote is issue still open to work ?

@leecalcote
Copy link
Member Author

@nakulbh yes, will you review @chiragchhabria2’s open PR?

@nakulbh
Copy link

nakulbh commented Jul 24, 2023

@leecalcote yes sir I can review his PR

@abhijeetgauravm
Copy link
Contributor

@nakulbh This issue is only reproducible on Safari, as mentioned by @Nikhil-Ladha. Do you have access to Safari?

@MohitGupta14
Copy link

I would like to work on this issue, I have access to macOS.
Kindly assign to me if it is available @leecalcote

@abhijeetgauravm
Copy link
Contributor

There u go @MohitGupta14

@MohitGupta14
Copy link

Tested with the latest version of Safari and macOS, and everything is working fine. The footer is aligning perfectly. Please see the screen recording for confirmation. Let me know if I am doing anything incorrectly.

Layer.Issue.mov

@leecalcote
Copy link
Member Author

The issue occurs between 1200px and 1100px.

@abhijeetgauravm
Copy link
Contributor

@MohitGupta14 any updates here?

@Ashparshp
Copy link
Contributor

Hi all,

I've noticed the ongoing discussion on issue #3865 regarding the [Footer] Subscribe component overlapping problem. If this issue is still pending or unassigned, I'm ready to take it on. I've previously worked on a similar matter (#4768) and can jump in to assist.

Let me know if I can get started on resolving this.

@abhijeetgauravm @leecalcote

@saurabh100ni
Copy link
Contributor

This issue has been open for some time with no recent activity, unassigning to open it up for new contributors to give it a go.

@Ashparshp
Copy link
Contributor

@saurabh100ni May i?

@Ashparshp
Copy link
Contributor

@saurabh100ni @leecalcote Please review the changes in the media query for screens between 704px and 1199px.
and confirm that the adjustments resolve the reported issue.

@saurabh100ni
Copy link
Contributor

Thank you for the PR @Ashparshp. LGTM.

@iArchitSharma
Copy link
Contributor

Fixed

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
good first issue Good for newcomers help wanted Extra attention is needed kind/bug Something isn't working language/css
Development

Successfully merging a pull request may close this issue.