github-starred/cs249r_book
2
0
Fork 0
mirror of https://github.com/harvard-edge/cs249r_book.git synced 2026-07-18 08:54:25 -05:00
Code Issues 276 Packages Projects Releases 26 Wiki Activity

[PR #1797] [MERGED] fix(staffml): make mobile ecosystem nav menu scroll internally #20971

New Issue
Closed
opened 2026-06-01 20:14:14 -05:00 by GiteaMirror · 0 comments
GiteaMirror commented 2026-06-01 20:14:14 -05:00
Owner
Copy Link

📋 Pull Request Information

Original PR: https://github.com/harvard-edge/cs249r_book/pull/1797
Author: @farhan523
Created: 5/23/2026
Status: ✅ Merged
Merged: 5/27/2026
Merged by: @profvjreddi

Base: dev ← Head: fix/staffml-mobile-nav-menu-scroll

📝 Commits (1)

  • 2a87d45 fix(staffml): make mobile ecosystem nav menu scroll internally

📊 Changes

1 file changed (+23 additions, -1 deletions)

View changed files

📝 interviews/staffml/src/components/EcosystemBar.tsx (+23 -1)

📄 Description

Summary

  • Mobile hamburger menu on the EcosystemBar lived inside a position: sticky parent with overflow-y: visible. Once the menu was taller than the viewport, the overflow items sat below the fold and a swipe scrolled the page instead of the menu — items only became reachable once the sticky bar released at the body bottom.
  • Cap the expanded menu at calc(100dvh - 60px) with overflow-y: auto and overscroll-behavior: contain so the menu owns its own scroll and stops chaining swipes to the page.
  • dvh (not vh) so the bottom of the menu doesn't get clipped on iOS Safari when the URL bar collapses.

Scoped to interviews/staffml/src/components/EcosystemBar.tsx. No behavior change for desktop (nav-lg:hidden gate is unchanged).

Test plan

  • Open the StaffML site on a phone (or DevTools mobile emulator) at a viewport short enough that the open hamburger menu exceeds it.
  • Tap the hamburger on the top MLSysBook ecosystem bar.
  • Swipe up/down inside the menu — the menu scrolls; the page behind it stays put.
  • Reaching the bottom of the menu does not start scrolling the page (no overscroll-chain).
  • Tall-viewport / desktop behavior is unchanged.

🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.

## 📋 Pull Request Information **Original PR:** https://github.com/harvard-edge/cs249r_book/pull/1797 **Author:** [@farhan523](https://github.com/farhan523) **Created:** 5/23/2026 **Status:** ✅ Merged **Merged:** 5/27/2026 **Merged by:** [@profvjreddi](https://github.com/profvjreddi) **Base:** `dev` ← **Head:** `fix/staffml-mobile-nav-menu-scroll` --- ### 📝 Commits (1) - [`2a87d45`](https://github.com/harvard-edge/cs249r_book/commit/2a87d4538b4d5b76f4bdba874571deb38195904f) fix(staffml): make mobile ecosystem nav menu scroll internally ### 📊 Changes **1 file changed** (+23 additions, -1 deletions) <details> <summary>View changed files</summary> 📝 `interviews/staffml/src/components/EcosystemBar.tsx` (+23 -1) </details> ### 📄 Description ## Summary - Mobile hamburger menu on the `EcosystemBar` lived inside a `position: sticky` parent with `overflow-y: visible`. Once the menu was taller than the viewport, the overflow items sat below the fold and a swipe scrolled the **page** instead of the menu — items only became reachable once the sticky bar released at the body bottom. - Cap the expanded menu at `calc(100dvh - 60px)` with `overflow-y: auto` and `overscroll-behavior: contain` so the menu owns its own scroll and stops chaining swipes to the page. - `dvh` (not `vh`) so the bottom of the menu doesn't get clipped on iOS Safari when the URL bar collapses. Scoped to `interviews/staffml/src/components/EcosystemBar.tsx`. No behavior change for desktop (`nav-lg:hidden` gate is unchanged). ## Test plan - [ ] Open the StaffML site on a phone (or DevTools mobile emulator) at a viewport short enough that the open hamburger menu exceeds it. - [ ] Tap the hamburger on the top MLSysBook ecosystem bar. - [ ] Swipe up/down inside the menu — the **menu** scrolls; the page behind it stays put. - [ ] Reaching the bottom of the menu does not start scrolling the page (no overscroll-chain). - [ ] Tall-viewport / desktop behavior is unchanged. --- <sub>🔄 This issue represents a GitHub Pull Request. It cannot be merged through Gitea due to API limitations.</sub>
GiteaMirror added the pull-request label 2026-06-01 20:14:14 -05:00
Sign in to join this conversation.
No Branch/Tag Specified
Branches Tags
Labels
Clear labels
area: book
area: collabs
area: kits
area: labs
area: socratiq
area: staffml
area: tinytorch
area: tools
area: website
bug
dependencies
format: epub
format: pdf
javascript
link-health
link-rot
priority-high
pull-request
Mirrored from GitHub Pull Request
 staffml
type: bug
type: citation
type: code
type: errata
type: improvement
type: new
type: question
vault-sli
No Label pull-request
Milestone
No items
No Milestone
Projects
Clear projects
No project
Assignees
Clear assignees
GiteaMirror ninjasurge
No Assignees
1 Participants
Notifications
Due Date
No due date set.
Dependencies

No dependencies set.

Reference: github-starred/cs249r_book#20971
Delete Branch "%!s()"

Deleting a branch is permanent. Although the deleted branch may continue to exist for a short time before it actually gets removed, it CANNOT be undone in most cases. Continue?