fix(docs): made sidebar directories scrollable, stylistic changes

[waleedlatif1]

Summary

made sidebar directories scrollable, stylistic changes

Type of Change

• Bug fix

Testing

Tested manually.

Checklist

• Code follows project style guidelines
• Self-reviewed my changes
• Tests added/updated and passing
• No new warnings introduced
• I confirm that I have read and agree to the terms outlined in the Contributor License Agreement (CLA)

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Preview	Comments	Updated (UTC)
docs	Ready	Preview	Comment	Oct 21, 2025 7:04pm

[greptile-apps]

Greptile Overview

Summary

This PR implements UI improvements for the docs interface, focusing on sidebar scrollability and navbar alignment. The changes increase the sidebar folder's expandable height limit from 2000px to 10000px to accommodate longer directory structures, adjust the navbar search positioning with additional left padding, and reduce the search trigger width slightly for better visual balance.

Key Changes:

• Increased sidebar folder max-h from 2000px to 10000px for expanded state
• Added pl-32 padding to center cluster in navbar for improved alignment
• Reduced search trigger width from 500px to 460px

Minor Considerations:

• The fixed max-h approach works for most cases but may need refinement if directories exceed 10000px in the future

Confidence Score: 5/5

• This PR is safe to merge with minimal risk
• Simple styling changes focused on layout improvements with no logic modifications or breaking changes
• No files require special attention

Important Files Changed

File Analysis

Filename	Score	Overview
apps/docs/components/docs-layout/sidebar-components.tsx	4/5	Increased max-height from 2000px to 10000px to accommodate longer sidebar directories
apps/docs/components/navbar/navbar.tsx	5/5	Added left padding (pl-32) to center search trigger for better visual alignment
apps/docs/components/ui/search-trigger.tsx	5/5	Reduced search trigger width from 500px to 460px for better layout balance

Sequence Diagram

sequenceDiagram
participant User
participant Navbar
participant SearchTrigger
participant SidebarFolder
participant DOM
User->>Navbar: Loads docs page
Navbar->>SearchTrigger: Renders centered with pl-32
SearchTrigger->>DOM: Displays 460px wide button
User->>SidebarFolder: Clicks folder toggle
SidebarFolder->>SidebarFolder: setOpen(!open)
SidebarFolder->>DOM: Animates max-h: 0 → 10000px
SidebarFolder->>DOM: Shows nested items with smooth transition
User->>SearchTrigger: Clicks search button
SearchTrigger->>DOM: Dispatches Cmd+K keyboard event
DOM->>User: Opens search modal

Loading

_{3 files reviewed, 1 comment}

_{Edit Code Review Agent Settings | Greptile}

[greptile-apps]

style: Using a fixed max-h value for animation limits scalability. Consider using max-h-screen or implementing proper scrolling with overflow-y-auto if content exceeds 10000px.

Prompt To Fix With AI

This is a comment left during a code review.
Path: apps/docs/components/docs-layout/sidebar-components.tsx
Line: 100:100
Comment:
**style:** Using a fixed `max-h` value for animation limits scalability. Consider using `max-h-screen` or implementing proper scrolling with `overflow-y-auto` if content exceeds 10000px.
How can I resolve this? If you propose a fix, please make it concise.