From 5504d4975121be79c493caf10288030a53370f81 Mon Sep 17 00:00:00 2001
From: Bryan Cunningham <bcunningham@bitwarden.com>
Date: Wed, 17 Dec 2025 15:02:37 -0500
Subject: [PATCH] [CL-927] add popup header back to extension layout for now
 (#18023)

* add popup header back to extension layout for now

* conditionally add margin for now if not hiding logo
---
 ...tension-anon-layout-wrapper.component.html | 23 +++++++++++++------
 .../anon-layout/anon-layout.component.html    |  6 ++++-
 2 files changed, 21 insertions(+), 8 deletions(-)

diff --git a/apps/browser/src/popup/components/extension-anon-layout-wrapper/extension-anon-layout-wrapper.component.html b/apps/browser/src/popup/components/extension-anon-layout-wrapper/extension-anon-layout-wrapper.component.html
index 7a1815b86ed..484f9680519 100644
--- a/apps/browser/src/popup/components/extension-anon-layout-wrapper/extension-anon-layout-wrapper.component.html
+++ b/apps/browser/src/popup/components/extension-anon-layout-wrapper/extension-anon-layout-wrapper.component.html
@@ -1,21 +1,30 @@
 <popup-page [disablePadding]="true">
+  <popup-header
+    slot="header"
+    [background]="'alt'"
+    [showBackButton]="showBackButton"
+    [pageTitle]="''"
+  >
+    <div class="tw-w-32">
+      <bit-icon *ngIf="showLogo" [icon]="logo" [ariaLabel]="'appLogoLabel' | i18n"></bit-icon>
+    </div>
+
+    <ng-container slot="end">
+      <app-pop-out></app-pop-out>
+      <app-current-account *ngIf="showAcctSwitcher && hasLoggedInAccount"></app-current-account>
+    </ng-container>
+  </popup-header>
   <auth-anon-layout
     [title]="pageTitle"
     [subtitle]="pageSubtitle"
     [icon]="pageIcon"
     [showReadonlyHostname]="showReadonlyHostname"
-    [hideLogo]="!showLogo"
+    [hideLogo]="true"
     [maxWidth]="maxWidth"
     [hideFooter]="hideFooter"
     [hideCardWrapper]="hideCardWrapper"
   >
     <router-outlet></router-outlet>
-    <div class="tw-flex tw-gap-2" slot="header-actions">
-      <app-pop-out></app-pop-out>
-      @if (showAcctSwitcher && hasLoggedInAccount) {
-        <app-current-account></app-current-account>
-      }
-    </div>
     <router-outlet slot="secondary" name="secondary"></router-outlet>
     <router-outlet slot="environment-selector" name="environment-selector"></router-outlet>
   </auth-anon-layout>
diff --git a/libs/components/src/anon-layout/anon-layout.component.html b/libs/components/src/anon-layout/anon-layout.component.html
index edb73bbf588..6bd72a25382 100644
--- a/libs/components/src/anon-layout/anon-layout.component.html
+++ b/libs/components/src/anon-layout/anon-layout.component.html
@@ -5,7 +5,11 @@
     'tw-min-h-full': clientType === 'browser' || clientType === 'desktop',
   }"
 >
-  <div class="tw-flex tw-justify-between tw-items-center tw-w-full tw-mb-12">
+  <div
+    [class]="
+      'tw-flex tw-justify-between tw-items-center tw-w-full' + (!hideLogo() ? ' tw-mb-12' : '')
+    "
+  >
     @if (!hideLogo()) {
       <a
         [routerLink]="['/']"