Skip to content

Fix mobile hamburger white space fix - #72

Closed
Shresth-14 wants to merge 0 commit into
learning-unlimited:masterfrom
Shresth-14:fix-hambburgermenu
Closed

Shresth-14 wants to merge 0 commit into
learning-unlimited:masterfrom
Shresth-14:fix-hambburgermenu

Conversation

@Shresth-14

Copy link
Copy Markdown
Contributor
Screenshot 2026-09-13 at 2 05 38 AM

The mobile navigation menu had excessive white space above the navigation links when opened. This made the mobile navbar feel unbalanced and pushed the menu items unnecessarily far down the screen.

Cause
The .nav-links element inherited justify-content: center from the default navigation styles. Since the mobile menu uses a full-height column layout, this caused the navigation links to be vertically centered.

Fix
Changed justify-content to flex-start so the menu items begin directly below the navbar.
Added align-items: stretch to ensure the navigation items use the available width.
Added type="button" to the hamburger button for better HTML semantics and to prevent unintended form submission behavior.

Testing
Tested the changes locally on the Jekyll development server and verified that the mobile navigation now starts correctly below the navbar without the excessive white space.

Copilot AI lite review requested due to automatic review settings September 12, 2026 20:36

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🟢 Approval recommended

No unresolved review comments remain, and the changes address the reported mobile navigation issue.

Pull request overview

Fixes excessive whitespace in the mobile navigation menu and improves hamburger button semantics.

Changes:

  • Aligns mobile navigation links to the top and stretches them.
  • Adds type="button" to the hamburger control.
File summaries
File Description
media/css/index.css Adjusts mobile menu alignment.
_includes/nav.html Prevents unintended form submission.
Review details
  • Files reviewed: 2/2 changed files
  • Comments generated: 0
  • Review effort level: Lite

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.

This branch was successfully deployed

1 active deployment
github-pages — d4380fb2 Deployed Sep 3, 2026 by willgearty via deploy #83
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants