layer5io
Fix: issue #6538 Overlapping Content on HandBook TOC
Description
This PR fixes #6538 [UI] Overlapping Content on HandBook Repository OverView.
Notes for Reviewers
Here are screenshots showing the fix. Adjustments are now media-query scoped to prevent layout shift.
- [x] Yes, I signed my commits.
🚀 Preview for commit 6864d8ae6ed2b64af59e6bc6c6104e86e3d9bd89 at: https://684ddaa7c5658ea4cea0868f--layer5.netlify.app
🚀 Preview for commit 7e626b974b80142e8444520f27ee8899651bca5b at: https://684ddfd3a49b72b3aa3d086c--layer5.netlify.app
🚀 Preview for commit b62fe031ecad30dff3dfbc0ade5ee4ba42a0ac94 at: https://684de38ab54488b74aaa3950--layer5.netlify.app
Hi @Vincamine,
Thank you for your contribution! We refrain from using media queries as much as possible, There are theme breakpoints I couldn't locate them, I think @M-DEV-1 can help us here, Would it be possible to reduce the space on the image below by any chance :innocent: ?
🚀 Preview for commit 2b7e1a7441ef2b49ed4777cd33a88065c593b7d4 at: https://684f3ea1a49b7240993d076b--layer5.netlify.app
Hi @LibenHailu. I’ve refined the solution by 1.Defining the layout behavior for screens under 750px 2.Replacing the existing mobile media query with a more robust version. As for reducing the space, seems like there are same layout pattern on other pages due to their content structure. I’d be happy to implement a more global fix if that’s helpful
🚀 Preview for commit 91e669318ff0d876029aed7c409c318e5e4e7852 at: https://684f5e31ffd5140380a46808--layer5.netlify.app
🚀 Preview for commit 91e669318ff0d876029aed7c409c318e5e4e7852 at: https://684f6110f153d1bbed94c49a--layer5.netlify.app
Hi @Vincamine, do you join today's sites meeting, Let's discuss this during the websites call today.
@Vincamine Thank you for your contribution! Let's discuss this during the website call today at 7 AM CT
Add it as an agenda item to the meeting minutes, if you would :)
Hi @Vincamine, do you join today's sites meeting, Let's discuss this during the websites call today.
Hi @Vincamine, do you join today's sites meeting, Let's discuss this during the websites call today.
@Vincamine Thank you for your contribution! Let's discuss this during the website call today at 7 AM CT
Add it as an agenda item to the meeting minutes, if you would :)
Hi guys! the time zone doesn’t quite work for me.. But I’m really curious if there were any updates or insights on the issue. Happy to catch up via notes or async!
Hi guys! the time zone doesn’t quite work for me.. But I’m really curious if there were any updates or insights on the issue. Happy to catch up via notes or async!
Hi @Vincamine , Can you join next sites meeting if you are able to, if not we can have a discussion offline?
@Vincamine the changed page looks much better 👍🏼
some pages still have some gap though, a global fix would be nice, along with some horizontal padding for mobile view on these pages.
were you able to find the theme breakpoints?
🚀 Preview for commit ceeb34766bba81572483b3bacc2313a9f7fc3fe6 at: https://685f9406e802b8c7727ac07f--layer5.netlify.app
@Vincamine any update on this??
The code has some unmatched conditions. I added a breakpoint (see the code), but there seem to be additional issues. Let’s discuss it in more detail on Slack?
@Vincamine Thank you for your contribution! Let's discuss this during the website call today at 7 AM CT
Add it as an agenda item to the meeting minutes, if you would :)
Hey @Vincamine, This issue is addressed https://github.com/layer5io/layer5/pull/6597 as well and fixes it would you like to give a review!!
🚀 Preview for commit 9e6610ec0cb01f91ed2a32ecf6f332791b9d2860 at: https://68663045f3b420706ec10edd--layer5.netlify.app
If this work is complete, this is a good item to add to the weekly Websites meeting agenda. You can add this item in the doc, attend, and present it. Meeting details at https://meet.layer5.io.
If this work is complete, this is a good item to add to the weekly Websites meeting agenda. You can add this item in the doc, attend, and present it. Meeting details at https://meet.layer5.io.
Got it.