Fix Main Content Overlapping Navbar (#104) #106
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
Description
This PR fixes the issue where the main content on multiple pages was overlapping with the fixed navbar, causing the top part of the content to be hidden.
Fixes :
Fixes: #104
Applies top padding or margin to the main content containers to ensure they start below the fixed navbar.
Affected pages:
Landing Page
About Page
Home Page
Explore / Features Page
Ensures consistent layout across all screen sizes (desktop and mobile).
🧪 How to Test
Open each of the following pages:
Landing Page
About Page
Home Page
Explore Page
Verify that:
The main heading and top content are fully visible.
No part of the content is hidden behind the navbar.
The layout adjusts correctly on both desktop and mobile view.
✅ Expected Result
Content now starts below the navbar.
No overlap occurs, and the user can read all content clearly.
Visual consistency is maintained across pages.
📁 Files Changed
LandingPage.css / LandingPage.jsx
AboutPage.css / AboutPage.jsx
HomePage.css / HomePage.jsx
ExplorePage.css / ExplorePage.jsx
Screenshots: