Fix/sidebar misalignment navigation pages#1007
Fix/sidebar misalignment navigation pages#1007Sbragul26 wants to merge 3 commits intolayer5io:masterfrom
Conversation
…s pages Signed-off-by: Sbragul26 <sbragul26@gmail.com>
Signed-off-by: Sbragul26 <sbragul26@gmail.com>
There was a problem hiding this comment.
Code Review
This pull request updates the layout styling in _styles_project.scss by removing the top margin from .td-outer and adding a top padding to the body element. Additionally, a media query was added to reset these values for mobile devices. Feedback was provided regarding the media query breakpoint, suggesting it be changed from 767px to 768px to ensure consistency with the rest of the codebase and prevent layout discrepancies at specific screen widths.
| scroll-margin-top: 1rem; | ||
| } | ||
|
|
||
| @media (max-width: 767px) { |
There was a problem hiding this comment.
The media query breakpoint 767px is inconsistent with the rest of the file, which consistently uses 768px for mobile/tablet transitions (e.g., lines 255, 487, 540, 579, 629, 634, and 665). This discrepancy can cause layout issues at exactly 768px width, where the sidebar transitions to its mobile state (per line 255) but the body padding and navbar styles added here do not yet reset, potentially leading to unexpected gaps or overlaps.
@media (max-width: 768px) {|
🚀 Preview deployment: https://layer5io.github.io/docs/pr-preview/pr-1007/
|
|
@Sbragul26 Thank you for your contribution! Let's discuss this during the website call tomorrow at 5:30 PM IST | 7 AM CST Add it as an agenda item to the meeting minutes, if you would 🙂 |
Notes for Reviewers
This PR fixes #999
It resolves the sidebar misalignment issue when navigating between release versions. Now, both the left and right sidebars stay in the correct position and the layout looks consistent across pages.
Signed commits