diff --git a/apps/browser/src/auth/popup/extension-anon-layout-wrapper/extension-anon-layout-wrapper.component.html b/apps/browser/src/auth/popup/extension-anon-layout-wrapper/extension-anon-layout-wrapper.component.html
index 88a3b1c3076..54cb5203a87 100644
--- a/apps/browser/src/auth/popup/extension-anon-layout-wrapper/extension-anon-layout-wrapper.component.html
+++ b/apps/browser/src/auth/popup/extension-anon-layout-wrapper/extension-anon-layout-wrapper.component.html
@@ -21,6 +21,7 @@
[hideLogo]="true"
[maxWidth]="maxWidth"
[hideFooter]="hideFooter"
+ [hideIcon]="hideIcon"
>
diff --git a/apps/browser/src/auth/popup/extension-anon-layout-wrapper/extension-anon-layout-wrapper.component.ts b/apps/browser/src/auth/popup/extension-anon-layout-wrapper/extension-anon-layout-wrapper.component.ts
index 10ef65d0654..51dbb6503d7 100644
--- a/apps/browser/src/auth/popup/extension-anon-layout-wrapper/extension-anon-layout-wrapper.component.ts
+++ b/apps/browser/src/auth/popup/extension-anon-layout-wrapper/extension-anon-layout-wrapper.component.ts
@@ -26,6 +26,7 @@ export interface ExtensionAnonLayoutWrapperData extends AnonLayoutWrapperData {
showBackButton?: boolean;
showLogo?: boolean;
hideFooter?: boolean;
+ hideIcon?: boolean;
}
@Component({
@@ -48,6 +49,7 @@ export class ExtensionAnonLayoutWrapperComponent implements OnInit, OnDestroy {
protected showAcctSwitcher: boolean;
protected showBackButton: boolean;
protected showLogo: boolean = true;
+ protected hideIcon: boolean = false;
protected pageTitle: string;
protected pageSubtitle: string;
@@ -129,6 +131,10 @@ export class ExtensionAnonLayoutWrapperComponent implements OnInit, OnDestroy {
if (firstChildRouteData["showLogo"] !== undefined) {
this.showLogo = Boolean(firstChildRouteData["showLogo"]);
}
+
+ if (firstChildRouteData["hideIcon"] !== undefined) {
+ this.hideIcon = Boolean(firstChildRouteData["hideIcon"]);
+ }
}
private listenForServiceDataChanges() {
@@ -180,6 +186,10 @@ export class ExtensionAnonLayoutWrapperComponent implements OnInit, OnDestroy {
if (data.showLogo !== undefined) {
this.showLogo = data.showLogo;
}
+
+ if (data.hideIcon !== undefined) {
+ this.hideIcon = data.hideIcon;
+ }
}
private handleStringOrTranslation(value: string | Translation): string {
diff --git a/apps/browser/src/auth/popup/extension-anon-layout-wrapper/extension-anon-layout-wrapper.stories.ts b/apps/browser/src/auth/popup/extension-anon-layout-wrapper/extension-anon-layout-wrapper.stories.ts
index 841eefda0ad..a0990485d49 100644
--- a/apps/browser/src/auth/popup/extension-anon-layout-wrapper/extension-anon-layout-wrapper.stories.ts
+++ b/apps/browser/src/auth/popup/extension-anon-layout-wrapper/extension-anon-layout-wrapper.stories.ts
@@ -242,6 +242,7 @@ const initialData: ExtensionAnonLayoutWrapperData = {
showAcctSwitcher: true,
showBackButton: true,
showLogo: true,
+ hideIcon: false,
};
const changedData: ExtensionAnonLayoutWrapperData = {
@@ -255,6 +256,7 @@ const changedData: ExtensionAnonLayoutWrapperData = {
showAcctSwitcher: false,
showBackButton: false,
showLogo: false,
+ hideIcon: false,
};
@Component({
diff --git a/libs/auth/src/angular/anon-layout/anon-layout.component.html b/libs/auth/src/angular/anon-layout/anon-layout.component.html
index 4120ea59002..f31a5500b43 100644
--- a/libs/auth/src/angular/anon-layout/anon-layout.component.html
+++ b/libs/auth/src/angular/anon-layout/anon-layout.component.html
@@ -17,7 +17,7 @@
class="tw-text-center tw-mb-4 sm:tw-mb-6"
[ngClass]="{ 'tw-max-w-md tw-mx-auto': titleAreaMaxWidth === 'md' }"
>
-
+
diff --git a/libs/auth/src/angular/anon-layout/anon-layout.component.ts b/libs/auth/src/angular/anon-layout/anon-layout.component.ts
index 05ddb9614f1..1ca4ccd2432 100644
--- a/libs/auth/src/angular/anon-layout/anon-layout.component.ts
+++ b/libs/auth/src/angular/anon-layout/anon-layout.component.ts
@@ -39,6 +39,7 @@ export class AnonLayoutComponent implements OnInit, OnChanges {
@Input() showReadonlyHostname: boolean;
@Input() hideLogo: boolean = false;
@Input() hideFooter: boolean = false;
+ @Input() hideIcon: boolean = false;
/**
* Max width of the title area content
diff --git a/libs/auth/src/angular/anon-layout/anon-layout.stories.ts b/libs/auth/src/angular/anon-layout/anon-layout.stories.ts
index c7e15d9dcfa..34d561d5210 100644
--- a/libs/auth/src/angular/anon-layout/anon-layout.stories.ts
+++ b/libs/auth/src/angular/anon-layout/anon-layout.stories.ts
@@ -163,6 +163,22 @@ export const WithCustomIcon: Story = {
}),
};
+export const HideIcon: Story = {
+ render: (args) => ({
+ props: args,
+ template:
+ // Projected content (the
) and styling is just a sample and can be replaced with any content/styling.
+ `
+
+
+
Primary Projected Content Area (customizable)
+
Lorem ipsum dolor sit amet consectetur adipisicing elit. Necessitatibus illum vero, placeat recusandae esse ratione eius minima veniam nemo, quas beatae! Impedit molestiae alias sapiente explicabo. Sapiente corporis ipsa numquam?
+
+
+ `,
+ }),
+};
+
export const HideLogo: Story = {
render: (args) => ({
props: args,