Skip to content

cherry-pick Kevin's mobile navbar fix from 2025 - #1

Open
medjakub wants to merge 1 commit into
ICAPS2027:mainfrom
medjakub:bugfix/navigation
Open

cherry-pick Kevin's mobile navbar fix from 2025#1
medjakub wants to merge 1 commit into
ICAPS2027:mainfrom
medjakub:bugfix/navigation

Conversation

@medjakub

@medjakub medjakub commented Jul 6, 2026

Copy link
Copy Markdown

Overview

This PR resolves the broken mobile navigation menu (specifically in Firefox mobile) and backports several other responsive layout optimizations. Because the issue was deeply rooted in the underlying Hugo "Mainroad" template we inherited, this PR addresses it by importing the community fix originally authored by Kevin (@kzhe0012).

(Note: A similar fix addressing this exact template issue was also previously deployed to the ICAPS 2026 repository. See 2026 Pull Request / 2026 Commit)

Original 2025 Commit: icaps25/icaps25.github.io@1fbb5c0

Changes Included

  • Mobile Navbar Fix: Replaced the <a> wrapper tags on dropdown menus with <label> tags and nested the toggle checkboxes within them. This allows tapping anywhere on the label to reliably toggle the submenu on Firefox mobile.
  • Dropdown Animations: Refactored the submenu open state to utilize CSS Grid (display: grid; grid-template-rows: 1fr;), significantly smoothing out the slide-down animation on touch devices.
  • Improved Touch Targets: Increased the padding on .menu__link items to improve mobile accessibility.
  • Responsive Typography: Added dynamic scaling (clamp()) to h1 and h2 elements so they resize gracefully on smaller viewports.
  • Pager Alignment: Removed restrictive block layouts on the .pager items, allowing "Next" and "Previous" navigation buttons to neatly align on a single line on mobile screens.

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.

1 participant