mirror of
https://github.com/bitwarden/browser
synced 2026-01-06 18:43:25 +00:00
f07e071f09
* billing folder added * initial commit * [SG-74] Trial Initiation Component with Vertical Stepper (#2913) * Vertical stepper PoC * Convert stepper css to tailwind * trial component start * trial component params * tailwind-ify header * Support teams, enterprise, and families layout param and more layout ui work * Some more theming fixes * Rename TrialModule to TrialInitiationModule * Stepper fixes, plus more functionality demo * Cleanup * layout params and placeholders * Only allow trial route to be hit if not logged in * fix typo * Use background-alt2 color for header * Move vertical stepper out of trial-initiation * Create components for the different plan types * Remove width on steps * Remove content projection for label * Tailwind style fixes * Extract step content into a component * Remove layout param for now * Remove step tags * remove pointer classes from step button * Remove most tailwind important designations * Update apps/web/src/app/modules/vertical-stepper/vertical-step.component.ts Co-authored-by: Oscar Hinton <Hinton@users.noreply.github.com> * Tailwind and layout fixes * Remove container * lint & prettier fixes * Remove extra CdkStep declaration * Styles fixes * Style logo directly * Remove 0 margin on image * Fix tiling and responsiveness * Minor padding fixes for org pages * Update apps/web/src/app/modules/trial-initiation/trial-initiation.component.html Co-authored-by: Oscar Hinton <Hinton@users.noreply.github.com> * prettier fix Co-authored-by: Oscar Hinton <Hinton@users.noreply.github.com> * [SG-65] Reusable Registration Form (#2946) * created reusable registration form * fixed conflicts * replicated reactive form changes in other clients * removed comments * client template cleanup * client template cleanup * removed comments in template file * changed to component suffix * switched show password to use component * comments resolution * comments resolution * added toast disable functionality * removed unused locale * mode custom input validator generic * fixed button * fixed linter * removed horizontal rule * switched to button component * Added billng step * Added keys to locale * billing trial initiation step * billing trial initiation step * Dont load billing content until the step is selected * billing trial initiation step * billing trial initiation step * billing trial initiation step * made the get plans endpoint anonymous * merged with master and extra changes * major changes on billing step * billing step sub label * Made changes to billing step sub label * removed unused variable * removed unused logic * cleanup * fixed suggestions * removed unused reference * added billing sub label Co-authored-by: Robyn MacCallum <robyntmaccallum@gmail.com> Co-authored-by: Oscar Hinton <Hinton@users.noreply.github.com> Co-authored-by: addison <addisonbeck1@gmail.com>
81 lines
3.4 KiB
HTML
81 lines
3.4 KiB
HTML
<div *ngIf="accountCreateOnly" class="">
|
|
<h1 class="tw-text-xl tw-text-center tw-mt-12" *ngIf="!layout">{{ "createAccount" | i18n }}</h1>
|
|
<div
|
|
class="tw-m-auto tw-rounded tw-border tw-border-solid tw-bg-background tw-border-secondary-300 tw-min-w-xl tw-max-w-xl tw-p-8"
|
|
>
|
|
<app-register-form
|
|
[queryParamEmail]="email"
|
|
[enforcedPolicyOptions]="enforcedPolicyOptions"
|
|
></app-register-form>
|
|
</div>
|
|
</div>
|
|
<div *ngIf="!accountCreateOnly">
|
|
<div
|
|
class="tw-bg-background-alt2 tw-h-96 tw--mt-48 tw-absolute tw--skew-y-3 tw-w-full tw--z-10"
|
|
></div>
|
|
<div class="tw-flex tw-max-w-screen-xl tw-min-w-4xl tw-mx-auto tw-px-4">
|
|
<div class="tw-w-1/2">
|
|
<img
|
|
alt="Bitwarden"
|
|
style="height: 50px; width: 335px"
|
|
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>
|
|
</div>
|
|
</div>
|
|
<div class="tw-w-1/2">
|
|
<div class="tw-pt-56">
|
|
<div class="tw-rounded tw-border tw-border-solid tw-bg-background tw-border-secondary-300">
|
|
<div class="tw-h-12 tw-flex tw-items-center tw-rounded-t tw-bg-secondary-100 tw-w-full">
|
|
<h2 class="tw-uppercase tw-pl-4 tw-text-base tw-mb-0 tw-font-bold">
|
|
Start your 7-Day free trial of Bitwarden for {{ org }}
|
|
</h2>
|
|
</div>
|
|
<app-vertical-stepper #stepper linear (selectionChange)="stepSelectionChange($event)">
|
|
<app-vertical-step label="Create Account" [editable]="false" [subLabel]="email">
|
|
<app-register-form
|
|
[isInTrialFlow]="true"
|
|
(createdAccount)="createdAccount($event)"
|
|
></app-register-form>
|
|
</app-vertical-step>
|
|
<app-vertical-step label="Organization Information" [subLabel]="orgInfoSubLabel">
|
|
<app-org-info [nameOnly]="true" [formGroup]="orgInfoFormGroup"></app-org-info>
|
|
<button
|
|
bitButton
|
|
buttonType="primary"
|
|
[disabled]="orgInfoFormGroup.get('name').hasError('required')"
|
|
cdkStepperNext
|
|
>
|
|
Next
|
|
</button>
|
|
</app-vertical-step>
|
|
<app-vertical-step label="Billing" [subLabel]="billingSubLabel">
|
|
<app-billing
|
|
*ngIf="stepper.selectedIndex === 2"
|
|
[plan]="plan"
|
|
[product]="product"
|
|
[orgInfoForm]="orgInfoFormGroup"
|
|
(previousStep)="previousStep()"
|
|
(onTrialBillingSuccess)="billingSuccess($event)"
|
|
></app-billing>
|
|
</app-vertical-step>
|
|
<app-vertical-step label="Confirmation Details" subLabel="Fancy sub label">
|
|
<!-- Replace with Confirmation details step -->
|
|
<p>This is any content of "Step 4"</p>
|
|
<button bitButton buttonType="primary" cdkStepperNext>Complete</button>
|
|
</app-vertical-step>
|
|
</app-vertical-stepper>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|