From 295ae5aa4e0cba046df684433830fa2cef563e3c Mon Sep 17 00:00:00 2001
From: Robyn MacCallum <robyntmaccallum@gmail.com>
Date: Fri, 19 Aug 2022 09:31:50 -0400
Subject: [PATCH] [SG-577] Display content based on layout params (#3339)

* display content based on layout params

* Subfolder TrialInitiationModule content components

Co-authored-by: rr-bw <rrichetto@bitwarden.com>
Co-authored-by: addison <addisonbeck1@gmail.com>
---
 .../cnet-enterprise-content.component.html    | 17 +++++++++++
 .../cnet-enterprise-content.component.ts      |  7 +++++
 .../cnet-individual-content.component.html    | 17 +++++++++++
 .../cnet-individual-content.component.ts      |  7 +++++
 .../content/cnet-teams-content.component.html | 17 +++++++++++
 .../content/cnet-teams-content.component.ts   |  7 +++++
 .../content/default-content.component.html    | 17 +++++++++++
 .../content/default-content.component.ts      |  7 +++++
 .../content/enterprise-content.component.html | 17 +++++++++++
 .../enterprise-content.component.ts           |  0
 .../enterprise1-content.component.html        | 17 +++++++++++
 .../content/enterprise1-content.component.ts  |  7 +++++
 .../enterprise2-content.component.html        | 17 +++++++++++
 .../content/enterprise2-content.component.ts  |  7 +++++
 .../content/logo-cnet.component.html          | 15 ++++++++++
 .../content/logo-cnet.component.ts            |  7 +++++
 .../content/logo-forbes.component.html        | 15 ++++++++++
 .../content/logo-forbes.component.ts          |  7 +++++
 .../content/logo-us-news.component.html       |  5 ++++
 .../content/logo-us-news.component.ts         |  7 +++++
 .../content/teams-content.component.html      | 17 +++++++++++
 .../{ => content}/teams-content.component.ts  |  0
 .../content/teams1-content.component.html     | 17 +++++++++++
 .../content/teams1-content.component.ts       |  7 +++++
 .../content/teams2-content.component.html     | 17 +++++++++++
 .../content/teams2-content.component.ts       |  7 +++++
 .../enterprise-content.component.html         | 11 -------
 .../families-content.component.html           | 13 --------
 .../families-content.component.ts             |  7 -----
 .../teams-content.component.html              | 10 -------
 .../trial-initiation.component.html           | 25 +++++++++++-----
 .../trial-initiation.component.ts             |  5 ++++
 .../trial-initiation.module.ts                | 30 ++++++++++++++++---
 33 files changed, 330 insertions(+), 53 deletions(-)
 create mode 100644 apps/web/src/app/accounts/trial-initiation/content/cnet-enterprise-content.component.html
 create mode 100644 apps/web/src/app/accounts/trial-initiation/content/cnet-enterprise-content.component.ts
 create mode 100644 apps/web/src/app/accounts/trial-initiation/content/cnet-individual-content.component.html
 create mode 100644 apps/web/src/app/accounts/trial-initiation/content/cnet-individual-content.component.ts
 create mode 100644 apps/web/src/app/accounts/trial-initiation/content/cnet-teams-content.component.html
 create mode 100644 apps/web/src/app/accounts/trial-initiation/content/cnet-teams-content.component.ts
 create mode 100644 apps/web/src/app/accounts/trial-initiation/content/default-content.component.html
 create mode 100644 apps/web/src/app/accounts/trial-initiation/content/default-content.component.ts
 create mode 100644 apps/web/src/app/accounts/trial-initiation/content/enterprise-content.component.html
 rename apps/web/src/app/accounts/trial-initiation/{ => content}/enterprise-content.component.ts (100%)
 create mode 100644 apps/web/src/app/accounts/trial-initiation/content/enterprise1-content.component.html
 create mode 100644 apps/web/src/app/accounts/trial-initiation/content/enterprise1-content.component.ts
 create mode 100644 apps/web/src/app/accounts/trial-initiation/content/enterprise2-content.component.html
 create mode 100644 apps/web/src/app/accounts/trial-initiation/content/enterprise2-content.component.ts
 create mode 100644 apps/web/src/app/accounts/trial-initiation/content/logo-cnet.component.html
 create mode 100644 apps/web/src/app/accounts/trial-initiation/content/logo-cnet.component.ts
 create mode 100644 apps/web/src/app/accounts/trial-initiation/content/logo-forbes.component.html
 create mode 100644 apps/web/src/app/accounts/trial-initiation/content/logo-forbes.component.ts
 create mode 100644 apps/web/src/app/accounts/trial-initiation/content/logo-us-news.component.html
 create mode 100644 apps/web/src/app/accounts/trial-initiation/content/logo-us-news.component.ts
 create mode 100644 apps/web/src/app/accounts/trial-initiation/content/teams-content.component.html
 rename apps/web/src/app/accounts/trial-initiation/{ => content}/teams-content.component.ts (100%)
 create mode 100644 apps/web/src/app/accounts/trial-initiation/content/teams1-content.component.html
 create mode 100644 apps/web/src/app/accounts/trial-initiation/content/teams1-content.component.ts
 create mode 100644 apps/web/src/app/accounts/trial-initiation/content/teams2-content.component.html
 create mode 100644 apps/web/src/app/accounts/trial-initiation/content/teams2-content.component.ts
 delete mode 100644 apps/web/src/app/accounts/trial-initiation/enterprise-content.component.html
 delete mode 100644 apps/web/src/app/accounts/trial-initiation/families-content.component.html
 delete mode 100644 apps/web/src/app/accounts/trial-initiation/families-content.component.ts
 delete mode 100644 apps/web/src/app/accounts/trial-initiation/teams-content.component.html

diff --git a/apps/web/src/app/accounts/trial-initiation/content/cnet-enterprise-content.component.html b/apps/web/src/app/accounts/trial-initiation/content/cnet-enterprise-content.component.html
new file mode 100644
index 0000000000..610a5df311
--- /dev/null
+++ b/apps/web/src/app/accounts/trial-initiation/content/cnet-enterprise-content.component.html
@@ -0,0 +1,17 @@
+<h1 class="tw-text-4xl !tw-text-alt2">Start Your Enterprise Free Trial Now</h1>
+<div class="tw-pt-24">
+  <h2 class="tw-text-2xl">
+    Millions of individuals, teams, and organizations worldwide trust Bitwarden for secure password
+    storage and sharing.
+  </h2>
+</div>
+<ul class="tw-mt-12 tw-flex tw-flex-col tw-gap-10 tw-text-2xl tw-text-main">
+  <li>Collaborate and share securely</li>
+  <li>Deploy and manage quickly and easily</li>
+  <li>Access anywhere on any device</li>
+  <li>Create your account to get started</li>
+</ul>
+<div class="tw-mt-28 tw-flex tw-flex-col tw-items-center tw-gap-5">
+  <app-logo-cnet></app-logo-cnet>
+  <app-logo-us-news></app-logo-us-news>
+</div>
diff --git a/apps/web/src/app/accounts/trial-initiation/content/cnet-enterprise-content.component.ts b/apps/web/src/app/accounts/trial-initiation/content/cnet-enterprise-content.component.ts
new file mode 100644
index 0000000000..4a6de8d300
--- /dev/null
+++ b/apps/web/src/app/accounts/trial-initiation/content/cnet-enterprise-content.component.ts
@@ -0,0 +1,7 @@
+import { Component } from "@angular/core";
+
+@Component({
+  selector: "app-cnet-enterprise-content",
+  templateUrl: "cnet-enterprise-content.component.html",
+})
+export class CnetEnterpriseContentComponent {}
diff --git a/apps/web/src/app/accounts/trial-initiation/content/cnet-individual-content.component.html b/apps/web/src/app/accounts/trial-initiation/content/cnet-individual-content.component.html
new file mode 100644
index 0000000000..c8921b82ac
--- /dev/null
+++ b/apps/web/src/app/accounts/trial-initiation/content/cnet-individual-content.component.html
@@ -0,0 +1,17 @@
+<h1 class="tw-text-4xl !tw-text-alt2">Start Your Premium Account Now</h1>
+<div class="tw-pt-24">
+  <h2 class="tw-text-2xl">
+    Millions of individuals, teams, and organizations worldwide trust Bitwarden for secure password
+    storage and sharing.
+  </h2>
+</div>
+<ul class="tw-mt-12 tw-flex tw-flex-col tw-gap-10 tw-text-2xl tw-text-main">
+  <li>Store logins, secure notes, and more</li>
+  <li>Secure your account with advanced two-step login</li>
+  <li>Access anywhere on any device</li>
+  <li>Create your account to get started</li>
+</ul>
+<div class="tw-mt-28 tw-flex tw-flex-col tw-items-center tw-gap-5">
+  <app-logo-cnet></app-logo-cnet>
+  <app-logo-us-news></app-logo-us-news>
+</div>
diff --git a/apps/web/src/app/accounts/trial-initiation/content/cnet-individual-content.component.ts b/apps/web/src/app/accounts/trial-initiation/content/cnet-individual-content.component.ts
new file mode 100644
index 0000000000..56d8b37af9
--- /dev/null
+++ b/apps/web/src/app/accounts/trial-initiation/content/cnet-individual-content.component.ts
@@ -0,0 +1,7 @@
+import { Component } from "@angular/core";
+
+@Component({
+  selector: "app-cnet-individual-content",
+  templateUrl: "cnet-individual-content.component.html",
+})
+export class CnetIndividualContentComponent {}
diff --git a/apps/web/src/app/accounts/trial-initiation/content/cnet-teams-content.component.html b/apps/web/src/app/accounts/trial-initiation/content/cnet-teams-content.component.html
new file mode 100644
index 0000000000..e4497d100b
--- /dev/null
+++ b/apps/web/src/app/accounts/trial-initiation/content/cnet-teams-content.component.html
@@ -0,0 +1,17 @@
+<h1 class="tw-text-4xl !tw-text-alt2">Start Your Teams Free Trial Now</h1>
+<div class="tw-pt-24">
+  <h2 class="tw-text-2xl">
+    Millions of individuals, teams, and organizations worldwide trust Bitwarden for secure password
+    storage and sharing.
+  </h2>
+</div>
+<ul class="tw-mt-12 tw-flex tw-flex-col tw-gap-10 tw-text-2xl tw-text-main">
+  <li>Collaborate and share securely</li>
+  <li>Deploy and manage quickly and easily</li>
+  <li>Access anywhere on any device</li>
+  <li>Create your account to get started</li>
+</ul>
+<div class="tw-mt-28 tw-flex tw-flex-col tw-items-center tw-gap-5">
+  <app-logo-cnet></app-logo-cnet>
+  <app-logo-us-news></app-logo-us-news>
+</div>
diff --git a/apps/web/src/app/accounts/trial-initiation/content/cnet-teams-content.component.ts b/apps/web/src/app/accounts/trial-initiation/content/cnet-teams-content.component.ts
new file mode 100644
index 0000000000..ff79a0d37c
--- /dev/null
+++ b/apps/web/src/app/accounts/trial-initiation/content/cnet-teams-content.component.ts
@@ -0,0 +1,7 @@
+import { Component } from "@angular/core";
+
+@Component({
+  selector: "app-cnet-teams-content",
+  templateUrl: "cnet-teams-content.component.html",
+})
+export class CnetTeamsContentComponent {}
diff --git a/apps/web/src/app/accounts/trial-initiation/content/default-content.component.html b/apps/web/src/app/accounts/trial-initiation/content/default-content.component.html
new file mode 100644
index 0000000000..351369fdef
--- /dev/null
+++ b/apps/web/src/app/accounts/trial-initiation/content/default-content.component.html
@@ -0,0 +1,17 @@
+<h1 class="tw-text-4xl !tw-text-alt2">The Bitwarden Password Manager</h1>
+<div class="tw-pt-24">
+  <h2 class="tw-text-2xl">
+    Trusted by millions of individuals, teams, and organizations worldwide for secure password
+    storage and sharing.
+  </h2>
+</div>
+<ul class="tw-mt-12 tw-flex tw-flex-col tw-gap-10 tw-text-2xl tw-text-main">
+  <li>Store logins, secure notes, and more</li>
+  <li>Collaborate and share securely</li>
+  <li>Access anywhere on any device</li>
+  <li>Create your account to get started</li>
+</ul>
+<div class="tw-mt-28 tw-flex tw-flex-col tw-items-center tw-gap-5">
+  <app-logo-forbes></app-logo-forbes>
+  <app-logo-us-news></app-logo-us-news>
+</div>
diff --git a/apps/web/src/app/accounts/trial-initiation/content/default-content.component.ts b/apps/web/src/app/accounts/trial-initiation/content/default-content.component.ts
new file mode 100644
index 0000000000..7ad40b089d
--- /dev/null
+++ b/apps/web/src/app/accounts/trial-initiation/content/default-content.component.ts
@@ -0,0 +1,7 @@
+import { Component } from "@angular/core";
+
+@Component({
+  selector: "app-default-content",
+  templateUrl: "default-content.component.html",
+})
+export class DefaultContentComponent {}
diff --git a/apps/web/src/app/accounts/trial-initiation/content/enterprise-content.component.html b/apps/web/src/app/accounts/trial-initiation/content/enterprise-content.component.html
new file mode 100644
index 0000000000..351369fdef
--- /dev/null
+++ b/apps/web/src/app/accounts/trial-initiation/content/enterprise-content.component.html
@@ -0,0 +1,17 @@
+<h1 class="tw-text-4xl !tw-text-alt2">The Bitwarden Password Manager</h1>
+<div class="tw-pt-24">
+  <h2 class="tw-text-2xl">
+    Trusted by millions of individuals, teams, and organizations worldwide for secure password
+    storage and sharing.
+  </h2>
+</div>
+<ul class="tw-mt-12 tw-flex tw-flex-col tw-gap-10 tw-text-2xl tw-text-main">
+  <li>Store logins, secure notes, and more</li>
+  <li>Collaborate and share securely</li>
+  <li>Access anywhere on any device</li>
+  <li>Create your account to get started</li>
+</ul>
+<div class="tw-mt-28 tw-flex tw-flex-col tw-items-center tw-gap-5">
+  <app-logo-forbes></app-logo-forbes>
+  <app-logo-us-news></app-logo-us-news>
+</div>
diff --git a/apps/web/src/app/accounts/trial-initiation/enterprise-content.component.ts b/apps/web/src/app/accounts/trial-initiation/content/enterprise-content.component.ts
similarity index 100%
rename from apps/web/src/app/accounts/trial-initiation/enterprise-content.component.ts
rename to apps/web/src/app/accounts/trial-initiation/content/enterprise-content.component.ts
diff --git a/apps/web/src/app/accounts/trial-initiation/content/enterprise1-content.component.html b/apps/web/src/app/accounts/trial-initiation/content/enterprise1-content.component.html
new file mode 100644
index 0000000000..351369fdef
--- /dev/null
+++ b/apps/web/src/app/accounts/trial-initiation/content/enterprise1-content.component.html
@@ -0,0 +1,17 @@
+<h1 class="tw-text-4xl !tw-text-alt2">The Bitwarden Password Manager</h1>
+<div class="tw-pt-24">
+  <h2 class="tw-text-2xl">
+    Trusted by millions of individuals, teams, and organizations worldwide for secure password
+    storage and sharing.
+  </h2>
+</div>
+<ul class="tw-mt-12 tw-flex tw-flex-col tw-gap-10 tw-text-2xl tw-text-main">
+  <li>Store logins, secure notes, and more</li>
+  <li>Collaborate and share securely</li>
+  <li>Access anywhere on any device</li>
+  <li>Create your account to get started</li>
+</ul>
+<div class="tw-mt-28 tw-flex tw-flex-col tw-items-center tw-gap-5">
+  <app-logo-forbes></app-logo-forbes>
+  <app-logo-us-news></app-logo-us-news>
+</div>
diff --git a/apps/web/src/app/accounts/trial-initiation/content/enterprise1-content.component.ts b/apps/web/src/app/accounts/trial-initiation/content/enterprise1-content.component.ts
new file mode 100644
index 0000000000..7b1199eb42
--- /dev/null
+++ b/apps/web/src/app/accounts/trial-initiation/content/enterprise1-content.component.ts
@@ -0,0 +1,7 @@
+import { Component } from "@angular/core";
+
+@Component({
+  selector: "app-enterprise1-content",
+  templateUrl: "enterprise1-content.component.html",
+})
+export class Enterprise1ContentComponent {}
diff --git a/apps/web/src/app/accounts/trial-initiation/content/enterprise2-content.component.html b/apps/web/src/app/accounts/trial-initiation/content/enterprise2-content.component.html
new file mode 100644
index 0000000000..092b105a56
--- /dev/null
+++ b/apps/web/src/app/accounts/trial-initiation/content/enterprise2-content.component.html
@@ -0,0 +1,17 @@
+<h1 class="tw-text-4xl !tw-text-alt2">Start Your Enterprise Free Trial Now</h1>
+<div class="tw-pt-24">
+  <h2 class="tw-text-2xl">
+    Millions of individuals, teams, and organizations worldwide trust Bitwarden for secure password
+    storage and sharing.
+  </h2>
+</div>
+<ul class="tw-mt-12 tw-flex tw-flex-col tw-gap-10 tw-text-2xl tw-text-main">
+  <li>Collaborate and share securely</li>
+  <li>Deploy and manage quickly and easily</li>
+  <li>Access anywhere on any device</li>
+  <li>Create your account to get started</li>
+</ul>
+<div class="tw-mt-28 tw-flex tw-flex-col tw-items-center tw-gap-5">
+  <app-logo-forbes></app-logo-forbes>
+  <app-logo-us-news></app-logo-us-news>
+</div>
diff --git a/apps/web/src/app/accounts/trial-initiation/content/enterprise2-content.component.ts b/apps/web/src/app/accounts/trial-initiation/content/enterprise2-content.component.ts
new file mode 100644
index 0000000000..08dec6190c
--- /dev/null
+++ b/apps/web/src/app/accounts/trial-initiation/content/enterprise2-content.component.ts
@@ -0,0 +1,7 @@
+import { Component } from "@angular/core";
+
+@Component({
+  selector: "app-enterprise2-content",
+  templateUrl: "enterprise2-content.component.html",
+})
+export class Enterprise2ContentComponent {}
diff --git a/apps/web/src/app/accounts/trial-initiation/content/logo-cnet.component.html b/apps/web/src/app/accounts/trial-initiation/content/logo-cnet.component.html
new file mode 100644
index 0000000000..4e04cec6da
--- /dev/null
+++ b/apps/web/src/app/accounts/trial-initiation/content/logo-cnet.component.html
@@ -0,0 +1,15 @@
+<figure>
+  <figcaption>
+    <cite>
+      <img
+        src="../../images/register-layout/cnet-logo.svg"
+        class="tw-mx-auto tw-block tw-w-40"
+        alt="CNET Logo"
+      />
+    </cite>
+  </figcaption>
+  <blockquote class="tw-mx-auto tw-mt-2 tw-max-w-xl tw-px-4 tw-text-center">
+    "No more excuses; start using Bitwarden today. The identity you save could be your own. The
+    money definitely will be."
+  </blockquote>
+</figure>
diff --git a/apps/web/src/app/accounts/trial-initiation/content/logo-cnet.component.ts b/apps/web/src/app/accounts/trial-initiation/content/logo-cnet.component.ts
new file mode 100644
index 0000000000..4f755f66a8
--- /dev/null
+++ b/apps/web/src/app/accounts/trial-initiation/content/logo-cnet.component.ts
@@ -0,0 +1,7 @@
+import { Component } from "@angular/core";
+
+@Component({
+  selector: "app-logo-cnet",
+  templateUrl: "logo-cnet.component.html",
+})
+export class LogoCnetComponent {}
diff --git a/apps/web/src/app/accounts/trial-initiation/content/logo-forbes.component.html b/apps/web/src/app/accounts/trial-initiation/content/logo-forbes.component.html
new file mode 100644
index 0000000000..3442616832
--- /dev/null
+++ b/apps/web/src/app/accounts/trial-initiation/content/logo-forbes.component.html
@@ -0,0 +1,15 @@
+<figure>
+  <figcaption>
+    <cite>
+      <img
+        src="../../images/register-layout/forbes-logo.svg"
+        class="tw-mx-auto tw-block tw-w-40"
+        alt="Forbes Logo"
+      />
+    </cite>
+  </figcaption>
+  <blockquote class="tw-mx-auto tw-mt-2 tw-max-w-xl tw-px-4 tw-text-center">
+    “Bitwarden boasts the backing of some of the world's best security experts and an attractive,
+    easy-to-use interface”
+  </blockquote>
+</figure>
diff --git a/apps/web/src/app/accounts/trial-initiation/content/logo-forbes.component.ts b/apps/web/src/app/accounts/trial-initiation/content/logo-forbes.component.ts
new file mode 100644
index 0000000000..818721fd1e
--- /dev/null
+++ b/apps/web/src/app/accounts/trial-initiation/content/logo-forbes.component.ts
@@ -0,0 +1,7 @@
+import { Component } from "@angular/core";
+
+@Component({
+  selector: "app-logo-forbes",
+  templateUrl: "logo-forbes.component.html",
+})
+export class LogoForbesComponent {}
diff --git a/apps/web/src/app/accounts/trial-initiation/content/logo-us-news.component.html b/apps/web/src/app/accounts/trial-initiation/content/logo-us-news.component.html
new file mode 100644
index 0000000000..bd44b56f09
--- /dev/null
+++ b/apps/web/src/app/accounts/trial-initiation/content/logo-us-news.component.html
@@ -0,0 +1,5 @@
+<img
+  src="../../images/register-layout/usnews-360-badge.svg"
+  class="tw-mx-auto tw-block tw-w-48"
+  alt="US News 360 Reviews Best Password Manager"
+/>
diff --git a/apps/web/src/app/accounts/trial-initiation/content/logo-us-news.component.ts b/apps/web/src/app/accounts/trial-initiation/content/logo-us-news.component.ts
new file mode 100644
index 0000000000..fb0b1e0c71
--- /dev/null
+++ b/apps/web/src/app/accounts/trial-initiation/content/logo-us-news.component.ts
@@ -0,0 +1,7 @@
+import { Component } from "@angular/core";
+
+@Component({
+  selector: "app-logo-us-news",
+  templateUrl: "logo-us-news.component.html",
+})
+export class LogoUSNewsComponent {}
diff --git a/apps/web/src/app/accounts/trial-initiation/content/teams-content.component.html b/apps/web/src/app/accounts/trial-initiation/content/teams-content.component.html
new file mode 100644
index 0000000000..351369fdef
--- /dev/null
+++ b/apps/web/src/app/accounts/trial-initiation/content/teams-content.component.html
@@ -0,0 +1,17 @@
+<h1 class="tw-text-4xl !tw-text-alt2">The Bitwarden Password Manager</h1>
+<div class="tw-pt-24">
+  <h2 class="tw-text-2xl">
+    Trusted by millions of individuals, teams, and organizations worldwide for secure password
+    storage and sharing.
+  </h2>
+</div>
+<ul class="tw-mt-12 tw-flex tw-flex-col tw-gap-10 tw-text-2xl tw-text-main">
+  <li>Store logins, secure notes, and more</li>
+  <li>Collaborate and share securely</li>
+  <li>Access anywhere on any device</li>
+  <li>Create your account to get started</li>
+</ul>
+<div class="tw-mt-28 tw-flex tw-flex-col tw-items-center tw-gap-5">
+  <app-logo-forbes></app-logo-forbes>
+  <app-logo-us-news></app-logo-us-news>
+</div>
diff --git a/apps/web/src/app/accounts/trial-initiation/teams-content.component.ts b/apps/web/src/app/accounts/trial-initiation/content/teams-content.component.ts
similarity index 100%
rename from apps/web/src/app/accounts/trial-initiation/teams-content.component.ts
rename to apps/web/src/app/accounts/trial-initiation/content/teams-content.component.ts
diff --git a/apps/web/src/app/accounts/trial-initiation/content/teams1-content.component.html b/apps/web/src/app/accounts/trial-initiation/content/teams1-content.component.html
new file mode 100644
index 0000000000..2b92abcd8b
--- /dev/null
+++ b/apps/web/src/app/accounts/trial-initiation/content/teams1-content.component.html
@@ -0,0 +1,17 @@
+<h1 class="tw-text-4xl !tw-text-alt2">Start Your Teams Free Trial Now</h1>
+<div class="tw-pt-24">
+  <h2 class="tw-text-2xl">
+    Millions of individuals, teams, and organizations worldwide trust Bitwarden for secure password
+    storage and sharing.
+  </h2>
+</div>
+<ul class="tw-mt-12 tw-flex tw-flex-col tw-gap-10 tw-text-2xl tw-text-main">
+  <li>Collaborate and share securely</li>
+  <li>Deploy and manage quickly and easily</li>
+  <li>Access anywhere on any device</li>
+  <li>Create your account to get started</li>
+</ul>
+<div class="tw-mt-28 tw-flex tw-flex-col tw-items-center tw-gap-5">
+  <app-logo-forbes></app-logo-forbes>
+  <app-logo-us-news></app-logo-us-news>
+</div>
diff --git a/apps/web/src/app/accounts/trial-initiation/content/teams1-content.component.ts b/apps/web/src/app/accounts/trial-initiation/content/teams1-content.component.ts
new file mode 100644
index 0000000000..055ec7fda1
--- /dev/null
+++ b/apps/web/src/app/accounts/trial-initiation/content/teams1-content.component.ts
@@ -0,0 +1,7 @@
+import { Component } from "@angular/core";
+
+@Component({
+  selector: "app-teams1-content",
+  templateUrl: "teams1-content.component.html",
+})
+export class Teams1ContentComponent {}
diff --git a/apps/web/src/app/accounts/trial-initiation/content/teams2-content.component.html b/apps/web/src/app/accounts/trial-initiation/content/teams2-content.component.html
new file mode 100644
index 0000000000..b1f720173d
--- /dev/null
+++ b/apps/web/src/app/accounts/trial-initiation/content/teams2-content.component.html
@@ -0,0 +1,17 @@
+<h1 class="tw-text-4xl !tw-text-alt2">Start Your Free Trial Now</h1>
+<div class="tw-pt-24">
+  <h2 class="tw-text-2xl">
+    Millions of individuals, teams, and organizations worldwide trust Bitwarden for secure password
+    storage and sharing.
+  </h2>
+</div>
+<ul class="tw-mt-12 tw-flex tw-flex-col tw-gap-10 tw-text-2xl tw-text-main">
+  <li>Collaborate and share securely</li>
+  <li>Deploy and manage quickly and easily</li>
+  <li>Access anywhere on any device</li>
+  <li>Create your account to get started</li>
+</ul>
+<div class="tw-mt-28 tw-flex tw-flex-col tw-items-center tw-gap-5">
+  <app-logo-forbes></app-logo-forbes>
+  <app-logo-us-news></app-logo-us-news>
+</div>
diff --git a/apps/web/src/app/accounts/trial-initiation/content/teams2-content.component.ts b/apps/web/src/app/accounts/trial-initiation/content/teams2-content.component.ts
new file mode 100644
index 0000000000..394ba90b49
--- /dev/null
+++ b/apps/web/src/app/accounts/trial-initiation/content/teams2-content.component.ts
@@ -0,0 +1,7 @@
+import { Component } from "@angular/core";
+
+@Component({
+  selector: "app-teams2-content",
+  templateUrl: "teams2-content.component.html",
+})
+export class Teams2ContentComponent {}
diff --git a/apps/web/src/app/accounts/trial-initiation/enterprise-content.component.html b/apps/web/src/app/accounts/trial-initiation/enterprise-content.component.html
deleted file mode 100644
index 239c25fdc9..0000000000
--- a/apps/web/src/app/accounts/trial-initiation/enterprise-content.component.html
+++ /dev/null
@@ -1,11 +0,0 @@
-<h1 class="!tw-text-alt2">You've chosen Bitwarden for Enterprise</h1>
-<div class="tw-pt-24">
-  <h2>What you can do with Bitwarden for Enterprise</h2>
-</div>
-
-<div class="tw-mt-12 tw-text-3xl tw-text-main">
-  <p class="tw-mt-2.5 tw-mb-20">Collaborate and share securely</p>
-  <p class="tw-mt-2.5 tw-mb-20">Deploy and manage quickly and easily</p>
-  <p class="tw-mt-2.5 tw-mb-20">Access anywhere on any device</p>
-  <p class="tw-mt-2.5 tw-mb-20">Create your account to get started</p>
-</div>
diff --git a/apps/web/src/app/accounts/trial-initiation/families-content.component.html b/apps/web/src/app/accounts/trial-initiation/families-content.component.html
deleted file mode 100644
index c0c6af0be0..0000000000
--- a/apps/web/src/app/accounts/trial-initiation/families-content.component.html
+++ /dev/null
@@ -1,13 +0,0 @@
-<h1 class="!tw-text-alt2">You've chosen Bitwarden for Families</h1>
-<div class="tw-pt-24">
-  <h2>
-    Trusted by millions of individuals, teams, and organizations worldwide for secure password
-    storage and sharing.
-  </h2>
-</div>
-<div class="tw-mt-12 tw-text-3xl tw-text-main">
-  <p class="tw-mt-2.5 tw-mb-20">Collaborate and share securely</p>
-  <p class="tw-mt-2.5 tw-mb-20">Deploy and manage quickly and easily</p>
-  <p class="tw-mt-2.5 tw-mb-20">Access anywhere on any device</p>
-  <p class="tw-mt-2.5 tw-mb-20">Create your account to get started</p>
-</div>
diff --git a/apps/web/src/app/accounts/trial-initiation/families-content.component.ts b/apps/web/src/app/accounts/trial-initiation/families-content.component.ts
deleted file mode 100644
index 1a13be80e6..0000000000
--- a/apps/web/src/app/accounts/trial-initiation/families-content.component.ts
+++ /dev/null
@@ -1,7 +0,0 @@
-import { Component } from "@angular/core";
-
-@Component({
-  selector: "app-families-content",
-  templateUrl: "families-content.component.html",
-})
-export class FamiliesContentComponent {}
diff --git a/apps/web/src/app/accounts/trial-initiation/teams-content.component.html b/apps/web/src/app/accounts/trial-initiation/teams-content.component.html
deleted file mode 100644
index 20e547fef1..0000000000
--- a/apps/web/src/app/accounts/trial-initiation/teams-content.component.html
+++ /dev/null
@@ -1,10 +0,0 @@
-<h1 class="!tw-text-alt2">You've chosen Bitwarden for Teams</h1>
-<div class="tw-pt-24">
-  <h2>What you can do with Btiwarden for Teams</h2>
-</div>
-<div class="tw-mt-12 tw-text-3xl tw-text-main">
-  <p class="tw-mt-2.5 tw-mb-20">Collaborate and share securely</p>
-  <p class="tw-mt-2.5 tw-mb-20">Deploy and manage quickly and easily</p>
-  <p class="tw-mt-2.5 tw-mb-20">Access anywhere on any device</p>
-  <p class="tw-mt-2.5 tw-mb-20">Create your account to get started</p>
-</div>
diff --git a/apps/web/src/app/accounts/trial-initiation/trial-initiation.component.html b/apps/web/src/app/accounts/trial-initiation/trial-initiation.component.html
index c51a1b0277..9251923c3c 100644
--- a/apps/web/src/app/accounts/trial-initiation/trial-initiation.component.html
+++ b/apps/web/src/app/accounts/trial-initiation/trial-initiation.component.html
@@ -13,7 +13,7 @@
   <div
     class="tw-absolute tw--z-10 tw--mt-48 tw-h-96 tw-w-full tw--skew-y-3 tw-bg-background-alt2"
   ></div>
-  <div class="tw-min-w-4xl tw-mx-auto tw-flex tw-max-w-screen-xl tw-px-4">
+  <div class="tw-min-w-4xl tw-mx-auto tw-flex tw-max-w-screen-xl tw-gap-12 tw-px-4">
     <div class="tw-w-1/2">
       <img
         alt="Bitwarden"
@@ -21,14 +21,23 @@
         class="tw-mt-6"
         src="../../images/register-layout/logo-horizontal-white.svg"
       />
-      <!-- This is to for illustrative purposes and content will be replaced by marketing -->
+
       <div class="tw-pt-12">
-        <!-- Teams Body -->
-        <app-teams-content *ngIf="org === 'teams'"></app-teams-content>
-        <!-- Enterprise Body -->
-        <app-enterprise-content *ngIf="org === 'enterprise'"></app-enterprise-content>
-        <!-- Families Body -->
-        <app-families-content *ngIf="org === 'families'"></app-families-content>
+        <!-- Layout params are used by marketing to determine left-hand content -->
+        <app-default-content *ngIf="layout === 'default'"></app-default-content>
+        <app-teams-content *ngIf="layout === 'teams'"></app-teams-content>
+        <app-teams1-content *ngIf="layout === 'teams1'"></app-teams1-content>
+        <app-teams2-content *ngIf="layout === 'teams2'"></app-teams2-content>
+        <app-enterprise-content *ngIf="layout === 'enterprise'"></app-enterprise-content>
+        <app-enterprise1-content *ngIf="layout === 'enterprise1'"></app-enterprise1-content>
+        <app-enterprise2-content *ngIf="layout === 'enterprise2'"></app-enterprise2-content>
+        <app-cnet-enterprise-content
+          *ngIf="layout === 'cnetcmpgnent'"
+        ></app-cnet-enterprise-content>
+        <app-cnet-individual-content
+          *ngIf="layout === 'cnetcmpgnind'"
+        ></app-cnet-individual-content>
+        <app-cnet-teams-content *ngIf="layout === 'cnetcmpgnteams'"></app-cnet-teams-content>
       </div>
     </div>
     <div class="tw-w-1/2">
diff --git a/apps/web/src/app/accounts/trial-initiation/trial-initiation.component.ts b/apps/web/src/app/accounts/trial-initiation/trial-initiation.component.ts
index 1c452cdf5e..8f20d1c7e9 100644
--- a/apps/web/src/app/accounts/trial-initiation/trial-initiation.component.ts
+++ b/apps/web/src/app/accounts/trial-initiation/trial-initiation.component.ts
@@ -29,6 +29,7 @@ export class TrialInitiationComponent implements OnInit {
   orgId = "";
   orgLabel = "";
   billingSubLabel = "";
+  layout = "default";
   plan: PlanType;
   product: ProductType;
   accountCreateOnly = true;
@@ -64,6 +65,10 @@ export class TrialInitiationComponent implements OnInit {
         return;
       }
 
+      if (qParams.layout) {
+        this.layout = qParams.layout;
+      }
+
       if (this.validOrgs.includes(qParams.org)) {
         this.org = qParams.org;
       } else {
diff --git a/apps/web/src/app/accounts/trial-initiation/trial-initiation.module.ts b/apps/web/src/app/accounts/trial-initiation/trial-initiation.module.ts
index 8d0ebbb1a7..fb02824222 100644
--- a/apps/web/src/app/accounts/trial-initiation/trial-initiation.module.ts
+++ b/apps/web/src/app/accounts/trial-initiation/trial-initiation.module.ts
@@ -10,9 +10,19 @@ import { RegisterFormModule } from "../register-form/register-form.module";
 
 import { BillingComponent } from "./billing.component";
 import { ConfirmationDetailsComponent } from "./confirmation-details.component";
-import { EnterpriseContentComponent } from "./enterprise-content.component";
-import { FamiliesContentComponent } from "./families-content.component";
-import { TeamsContentComponent } from "./teams-content.component";
+import { CnetEnterpriseContentComponent } from "./content/cnet-enterprise-content.component";
+import { CnetIndividualContentComponent } from "./content/cnet-individual-content.component";
+import { CnetTeamsContentComponent } from "./content/cnet-teams-content.component";
+import { DefaultContentComponent } from "./content/default-content.component";
+import { EnterpriseContentComponent } from "./content/enterprise-content.component";
+import { Enterprise1ContentComponent } from "./content/enterprise1-content.component";
+import { Enterprise2ContentComponent } from "./content/enterprise2-content.component";
+import { LogoCnetComponent } from "./content/logo-cnet.component";
+import { LogoForbesComponent } from "./content/logo-forbes.component";
+import { LogoUSNewsComponent } from "./content/logo-us-news.component";
+import { TeamsContentComponent } from "./content/teams-content.component";
+import { Teams1ContentComponent } from "./content/teams1-content.component";
+import { Teams2ContentComponent } from "./content/teams2-content.component";
 import { TrialInitiationComponent } from "./trial-initiation.component";
 import { VerticalStepperModule } from "./vertical-stepper/vertical-stepper.module";
 
@@ -29,10 +39,22 @@ import { VerticalStepperModule } from "./vertical-stepper/vertical-stepper.modul
   declarations: [
     TrialInitiationComponent,
     EnterpriseContentComponent,
-    FamiliesContentComponent,
     TeamsContentComponent,
     ConfirmationDetailsComponent,
     BillingComponent,
+    DefaultContentComponent,
+    EnterpriseContentComponent,
+    Enterprise1ContentComponent,
+    Enterprise2ContentComponent,
+    TeamsContentComponent,
+    Teams1ContentComponent,
+    Teams2ContentComponent,
+    CnetEnterpriseContentComponent,
+    CnetIndividualContentComponent,
+    CnetTeamsContentComponent,
+    LogoCnetComponent,
+    LogoForbesComponent,
+    LogoUSNewsComponent,
   ],
   exports: [TrialInitiationComponent],
   providers: [TitleCasePipe],