fix: apply correct styles to sidebarItemToggler

[avivkeller]

Fixes the hamburger visual regression. (I think that's all the regressions!)

[vercel]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Updated (UTC)
nodejs-org	✅ Ready (Inspect)	Visit Preview	Mar 25, 2025 0:23am

[Copilot]

Pull Request Overview

This PR aims to fix the hamburger visual regression by correcting the styles applied to the sidebar item toggler. The key changes include:

• Removing unnecessary template literal usage in the nav element.
• Replacing the previous className (which included the "peer" class and sidebarItemToggler) with a new style (sidebarItemTogglerLabel) for the Label component.

Comments suppressed due to low confidence (2)

packages/ui-components/Containers/NavBar/index.tsx:58

• Ensure that removing the 'peer' class (which was present in the previous version) does not impact any CSS rules or behaviors that relied on it. Confirm that the new 'sidebarItemTogglerLabel' style encapsulates all necessary styling for the toggler.

className={style.sidebarItemTogglerLabel}

packages/ui-components/Containers/NavBar/index.tsx:51

• [nitpick] The change from a template literal to a direct reference simplifies the code; however, verify that no dynamic behavior was expected from the original string interpolation.

<nav className={style.container}>

[github-actions]

Lighthouse Results

URL	Performance	Accessibility	Best Practices	SEO	Report
/en	🟢 98	🟢 100	🟢 100	🟢 91	🔗
/en/about	🟢 100	🟢 100	🟢 100	🟢 91	🔗
/en/about/previous-releases	🟢 100	🟢 100	🟢 100	🟢 92	🔗
/en/download	🟢 91	🟢 100	🟢 100	🟢 91	🔗
/en/blog	🟢 100	🟢 100	🟢 96	🟢 92	🔗

[github-actions]

Unit Test Coverage Report

Title	Lines	Statements	Branches	Functions
@node-core/ui-components		95.83% (161/168)	77.86% (102/131)	88.57% (31/35)
@nodejs/website		84.74% (500/590)	76.03% (165/217)	87.09% (108/124)

Title	Tests	Skipped	Failures	Errors	Time
@node-core/ui-components	24	0 💤	0 ❌	0 🔥	4.712s ⏱️
@nodejs/website	157	0 💤	0 ❌	0 🔥	6.235s ⏱️