Align sidebar with Penpot design (#630)

[Roshan-Singh-07]

This PR aligns the sidebar with the official Penpot design to improve visual consistency and UX.

Changes

• Updated sidebar typography to use Lato and secondary text color
• Set HTTP method labels to font-weight 400
• Made request and folder context menus (three dots) visible only on hover
• Fixed text truncation to prevent overlap with context menu
• Ensured consistent hover behavior between requests and folders
• Fixed a TypeScript issue where a non-renderable URL object could be passed as a React child (fallback now uses url.base)

Result

• Sidebar now visually matches the Penpot design
• Cleaner UI with less visual noise
• Improved readability for long request and folder names

Demo: short screen recording attached showing hover behavior and text truncation.

Screen.Recording.2026-02-07.144348.mp4

Closes #630

[SoulKa]

This is currently blocked by #693. Will review and merge after that PR

[SoulKa]

The PR #693 is merged now. There are two conflicting changes (see NavFolder and NavRequest). You will need to rebase on the develop branch.

[Roshan-Singh-07]

Rebased on the latest main branch and resolved the conflicts in NavFolder and NavRequest.

The sidebar now preserves the recent collapsible and drag-and-drop changes while aligning the styling and behavior with the Penpot design. Please let me know if any further adjustments are needed.

Thanks!

[SoulKa]

I rebased locally, the long name cutoff is still there, the other issues seem resolved for me. So another rebase and I think the work is done

[Roshan-Singh-07]

Fixed the truncation issue for request titles and folder titles by adjusting the flex layout and ensuring the context menu does not overlap the text.

[SoulKa]

I think there went something wrong in the rebase. The collapsible is not needed in its current form of implementation (see line 94 where CollapsibleContent is empty.

You can remove the collapsible and only keep the SidebarMenuSubButton as it's implemented on the main branch. This PR should likely only modify CSS class names

[Roshan-Singh-07]

Removed the Collapsible implementation as suggested and kept the structure consistent with the main branch by using only SidebarMenuSubButton. Thanks