Repository navigation
Keep Get Started Back control in normal layout flow - #3682
Merged
Merged
Conversation
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Member
|
The "after" hides the title text though |
Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
navya9singh
requested review from
Jake Bailey (jakebailey)
and
a balanced review from Copilot
October 26, 2026 19:38
There was a problem hiding this comment.
🟡 Changes recommended
The short-mobile navigation retains upward-opening search results, placing suggestions above the viewport at the top of the page.
1 open issue
What changed in this PR
This PR adjusts the TypeScript website’s Get Started controls and responsive navigation to prevent heading overlap on short mobile viewports.
Changes:
- Targets the actual Back control and keeps it in normal layout flow with spacing.
- Makes navigation static at widths up to 790px and heights up to 480px, while retaining fixed navigation on taller mobile screens.
- Constrains the search input within the short-mobile layout.
| File | Description |
|---|---|
packages/typescriptlang-org/src/templates/pages/css/index.scss |
Updates the Back control selector, positioning, and spacing. |
packages/typescriptlang-org/src/components/layout/TopNav.scss |
Adds short-mobile navigation and search sizing overrides. |
Review effort: Balanced
Reset dropdown direction and arrow when navigation is in document flow, and constrain the dropdown to the viewport. Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
Jake Bailey (jakebailey)
approved these changes
Oct 28, 2026
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
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.
Remove obsolete absolute positioning from the actual Get Started Back control so it does not overlap the heading.
Addresses the review feedback about the hidden title: navigation now stays in document flow on short mobile viewports (up to 790px wide and 480px high), with a bounded search input. Taller mobile screens keep fixed navigation.
Verification
Fresh production builds reproduce title occlusion on the published PR head and verify the revision. Native Edge menu readback confirms real 200% browser zoom, with DPR 1 to 2 and viewport 640x512 to 320x256 (CSS zoom remains 1). The full title hit-tests to the heading, not navigation, with Back focused and no additional scroll keys. Panel-link Tab navigation and Back activation pass. Six viewport checks cover desktop, tall/short mobile, and the exact responsive boundaries.
Proof
Original Back-overlap verification. Its after image demonstrated Back/title separation but did not establish full title visibility; the revised proof above addresses that gap.
Search review follow-up
Results now open below the input, with an upward-pointing arrow and viewport-bounded width, only in short-mobile mode (width up to 790px and height up to 480px). Fresh production builds verified live DocSearch results, Escape dismissal, ArrowDown selection and Enter navigation at native Edge 200% zoom and across six responsive modes. The original title/Web/Back keyboard path and responsive checks still pass. Tall-mobile and desktop positioning are unchanged; this does not address pre-existing tall-mobile result clipping.