[CL-904] Migrate CL/Navigation to use OnPush (#16958)

* Migrate CL/Navigation to use OnPush

* Modernize the code

* Swap to signals and class

* Further tweaks

* Remove this.

* Replace setOpen and setClose with a public signal

* fix merge issues and signal-ifying service

* fix class and style bindings

* fix accidental behavior change from merge conflicts

* fix redundant check

* fix missed ngClass

* fix comment

* Re-add share ng-template

---------

Co-authored-by: Vicki League <vleague@bitwarden.com>
Co-authored-by: Will Martin <contact@willmartian.com>
Co-authored-by: Claude Sonnet 4.5 <noreply@anthropic.com>

libs/components/src/layout/layout.component.html

@@ -30,21 +30,14 @@
       <ng-content></ng-content>
     </main>
     <!-- overlay backdrop for side-nav -->
-    @if (
-      {
-        open: sideNavService.open$ | async,
-      };
-      as data
-    ) {
-      <div
-        class="tw-pointer-events-none tw-fixed tw-inset-0 tw-z-10 tw-bg-black tw-bg-opacity-0 motion-safe:tw-transition-colors md:tw-hidden"
-        [ngClass]="[data.open ? 'tw-bg-opacity-30 md:tw-bg-opacity-0' : 'tw-bg-opacity-0']"
-      >
-        @if (data.open) {
-          <div (click)="sideNavService.toggle()" class="tw-pointer-events-auto tw-size-full"></div>
-        }
-      </div>
-    }
+    <div
+      class="tw-pointer-events-none tw-fixed tw-inset-0 tw-z-10 tw-bg-black tw-bg-opacity-0 motion-safe:tw-transition-colors md:tw-hidden"
+      [class]="sideNavService.open() ? 'tw-bg-opacity-30 md:tw-bg-opacity-0' : 'tw-bg-opacity-0'"
+    >
+      @if (sideNavService.open()) {
+        <div (click)="sideNavService.toggle()" class="tw-pointer-events-auto tw-size-full"></div>
+      }
+    </div>
   </div>
   <div class="tw-absolute tw-z-50 tw-left-0 md:tw-sticky tw-top-0 tw-h-full md:tw-w-auto">
     <ng-template [cdkPortalOutlet]="drawerPortal()"></ng-template>