Skip to content

[WIP] Test a horizontal docs nav#3303

Draft
m-hulbert wants to merge 8 commits intomainfrom
docs-nav-update
Draft

[WIP] Test a horizontal docs nav#3303
m-hulbert wants to merge 8 commits intomainfrom
docs-nav-update

Conversation

@m-hulbert
Copy link
Copy Markdown
Contributor

Description

This is a draft PR experimenting with changing the docs navigation to be a horizontal product menu.

m-hulbert and others added 7 commits March 27, 2026 16:00
New components to support the navigation redesign:
- ProductBar: horizontal product switcher shown below the header
- CopyForLLM: dropdown menu for markdown copy/view and LLM links
- useShowLanguageSelector: extracted hook for language selector visibility
- PRODUCT_BAR_HEIGHT constant for derived sticky offsets

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Replace Documentation/Examples TabMenu with three discrete nav links.
Header is now fixed with max-width inner container so content aligns
with the body while the background spans full viewport width. Search
bar moved to center of header. Added comments to shadow DOM queries
for Inkeep widget interaction.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Move Header and ProductBar outside max-width container so their
backgrounds and borders span the full viewport. Add pt-16 offset
for fixed header. Integrate CopyForLLM into breadcrumb bar.
Remove mt-8 from breadcrumbs, add min-w-0 for overflow safety.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Replace product accordion with SectionNav that renders top-level
sections as static headings, always expanded. Sidebar now shows only
the active product's navigation. Derive sticky offset from
HEADER_HEIGHT + PRODUCT_BAR_HEIGHT constants instead of hardcoded
pixel values. Left border and indent only apply at layer 2+ to
avoid visual noise on direct children of section headings. Remove
duplicate inkeep-search-mount ID that conflicted with header.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
…nstants

Language selector relocated from PageHeader to RightSidebar for
better layout balance. Derive sticky offset from HEADER_HEIGHT +
PRODUCT_BAR_HEIGHT constants instead of hardcoded top-[108px].

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Remove markdown fetching, LLM links, language selector, and clipboard
logic from PageHeader — all moved to CopyForLLM and RightSidebar.
PageHeader now only renders title and intro text.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
LeftSidebar tests updated for single-product nav with static section
headings. RightSidebar tests mock new LanguageSelector and
useShowLanguageSelector dependencies.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
@m-hulbert m-hulbert self-assigned this Mar 27, 2026
@m-hulbert m-hulbert added the review-app Create a Heroku review app label Mar 27, 2026
@coderabbitai
Copy link
Copy Markdown

coderabbitai bot commented Mar 27, 2026

Important

Review skipped

Auto reviews are disabled on this repository. Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro

Run ID: b9fb0a4a-6bce-44f4-b7cb-37cfa11d231b

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

  • 🔍 Trigger review
✨ Finishing Touches
🧪 Generate unit tests (beta)
  • Create PR with unit tests
  • Commit unit tests in branch docs-nav-update

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

@ably-ci ably-ci temporarily deployed to ably-docs-docs-nav-upda-eow4fy March 27, 2026 17:47 Inactive
- Remove left sidebar from homepage
- Fix left nav scroll so it works independently of main content
- Adjust nav item padding (4px top/bottom) and heading spacing (20px/6px)
- Align first nav heading with breadcrumb row
- Left border/indent only on layer 2+ nav items
- Remove horizontal rule between language selector and "On this page"

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

review-app Create a Heroku review app

Development

Successfully merging this pull request may close these issues.

2 participants