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

overlapping-text-issue-resolved #70

Open
wants to merge 2 commits into
base: main
Choose a base branch
from

Conversation

Shayan12456
Copy link
Contributor

@Shayan12456 Shayan12456 commented Oct 31, 2024

Fixes #67

Now text is not overlapping

Iphone se 2022:
After:
Screenshot 2024-10-31 at 6 27 35 PM

Before:
Screenshot 2024-10-31 at 6 28 20 PM

Copy link

vercel bot commented Oct 31, 2024

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
responsively-app-website ✅ Ready (Inspect) Visit Preview 💬 Add feedback Oct 31, 2024 2:04pm

@violetadev
Copy link
Contributor

hi @Shayan12456 , please re do this using css, you are adding complexity to the component that impacts performance and it's not really necessary. You can use media queries like you did but in the css easily. Thanks!

@JusticeMatthew
Copy link

When inspecting the preview deploy for this while yes the text is firmly placed on the green box now, the tab switcher that comes next in the layout is now pushed mostly off screen and only allows selecting the first two options

Imo the best solution would be to remove the green block as part of the SVG and instead use it as the section/divs background, then just have the little gradient color blobs be the actual absolutely positioned SVGs rather than that whole green block being an absolutely positioned SVG

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

Successfully merging this pull request may close these issues.

Text Overlapping on Narrow Screens
3 participants