mirror of https://github.com/ghostfolio/ghostfolio
You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
198 lines
6.4 KiB
198 lines
6.4 KiB
@switch (variantIndex) {
|
|
@case (0) {
|
|
<div class="flex-grow-1 pt-0" mat-dialog-content>
|
|
<div class="intro-container">
|
|
<div class="intro-inner-container mx-auto">
|
|
<div class="h-100 intro w-100"></div>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<h5 class="align-items-center d-flex justify-content-center mb-3">
|
|
<span>Ghostfolio Premium</span>
|
|
<gf-premium-indicator class="ml-1" [enableLink]="false" />
|
|
</h5>
|
|
<div class="font-weight-normal h5 mb-3 text-center" i18n>
|
|
Are you an ambitious investor who needs the full picture?
|
|
</div>
|
|
<p i18n>
|
|
Upgrade to Ghostfolio Premium today and gain access to exclusive
|
|
features to enhance your investment experience:
|
|
</p>
|
|
<ul class="list-unstyled mb-3 pl-3">
|
|
<li class="align-items-center d-flex mb-1">
|
|
<ion-icon class="mr-1" name="checkmark-circle-outline" />
|
|
<span i18n>Portfolio Summary</span>
|
|
</li>
|
|
<li class="align-items-center d-flex mb-1">
|
|
<ion-icon class="mr-1" name="checkmark-circle-outline" />
|
|
<span i18n>Portfolio Allocations</span>
|
|
</li>
|
|
<li class="align-items-center d-flex mb-1">
|
|
<ion-icon class="mr-1" name="checkmark-circle-outline" />
|
|
<span i18n>Performance Benchmarks</span>
|
|
</li>
|
|
<li class="align-items-center d-flex mb-1">
|
|
<ion-icon class="mr-1" name="checkmark-circle-outline" />
|
|
<span i18n>FIRE Calculator</span>
|
|
</li>
|
|
<li class="align-items-center d-flex mb-1">
|
|
<ion-icon class="mr-1" name="checkmark-circle-outline" />
|
|
<span i18n>Professional Data Provider</span>
|
|
</li>
|
|
<li class="align-items-center d-flex mb-1">
|
|
<ion-icon class="mr-1" name="checkmark-circle-outline" />
|
|
<span i18n>and more Features...</span>
|
|
</li>
|
|
</ul>
|
|
<p class="m-0" i18n>
|
|
Get the tools to effectively manage your finances and refine your
|
|
personal investment strategy.
|
|
</p>
|
|
</div>
|
|
</div>
|
|
<div class="justify-content-end" mat-dialog-actions>
|
|
<button
|
|
mat-button
|
|
[disabled]="remainingSkipButtonDelay > 0"
|
|
(click)="closeDialog()"
|
|
>
|
|
<ng-container i18n>Skip</ng-container>
|
|
@if (remainingSkipButtonDelay > 0) {
|
|
({{ remainingSkipButtonDelay }})
|
|
}
|
|
</button>
|
|
<a
|
|
color="primary"
|
|
mat-flat-button
|
|
[routerLink]="routerLinkPricing"
|
|
(click)="closeDialog()"
|
|
>
|
|
<span i18n>Upgrade Plan</span>
|
|
<ion-icon class="ml-1" name="arrow-forward-outline" />
|
|
</a>
|
|
</div>
|
|
}
|
|
@case (1) {
|
|
<div class="flex-grow-1 pt-0" mat-dialog-content>
|
|
<div class="intro-container">
|
|
<div class="intro-inner-container mx-auto">
|
|
<div class="h-100 intro w-100"></div>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<div class="font-weight-normal h5 text-center" i18n>
|
|
Get access to 80’000+ tickers from over 50 exchanges
|
|
</div>
|
|
<p class="my-2 text-center" i18n>with</p>
|
|
<h5 class="align-items-center d-flex justify-content-center">
|
|
<span>Ghostfolio Premium</span>
|
|
<gf-premium-indicator class="ml-1" [enableLink]="false" />
|
|
</h5>
|
|
</div>
|
|
</div>
|
|
<div class="justify-content-end" mat-dialog-actions>
|
|
<button
|
|
mat-button
|
|
[disabled]="remainingSkipButtonDelay > 0"
|
|
(click)="closeDialog()"
|
|
>
|
|
<ng-container i18n>Skip</ng-container>
|
|
@if (remainingSkipButtonDelay > 0) {
|
|
({{ remainingSkipButtonDelay }})
|
|
}
|
|
</button>
|
|
<a
|
|
color="primary"
|
|
mat-flat-button
|
|
[routerLink]="routerLinkPricing"
|
|
(click)="closeDialog()"
|
|
>
|
|
<span i18n>Upgrade Plan</span>
|
|
<ion-icon class="ml-1" name="arrow-forward-outline" />
|
|
</a>
|
|
</div>
|
|
}
|
|
@case (2) {
|
|
<div class="flex-grow-1 pt-0" mat-dialog-content>
|
|
<div class="intro-container">
|
|
<div class="intro-inner-container mx-auto">
|
|
<div class="h-100 intro w-100"></div>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<h5 class="align-items-center d-flex justify-content-center">
|
|
<span>Ghostfolio Premium</span>
|
|
<gf-premium-indicator class="ml-1" [enableLink]="false" />
|
|
</h5>
|
|
<p class="my-2 text-center" i18n>for</p>
|
|
<div class="font-weight-normal h5 text-center">
|
|
<ng-container i18n>less than</ng-container> $1
|
|
<ng-container i18n>per week</ng-container>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="flex-column" mat-dialog-actions>
|
|
<button
|
|
class="mb-2 py-4 w-100"
|
|
mat-button
|
|
[disabled]="remainingSkipButtonDelay > 0"
|
|
(click)="closeDialog()"
|
|
>
|
|
<ng-container i18n>Skip</ng-container>
|
|
@if (remainingSkipButtonDelay > 0) {
|
|
({{ remainingSkipButtonDelay }})
|
|
}
|
|
</button>
|
|
<a
|
|
class="m-0 py-4 w-100"
|
|
color="primary"
|
|
mat-flat-button
|
|
[routerLink]="routerLinkPricing"
|
|
(click)="closeDialog()"
|
|
>
|
|
<span i18n>Upgrade Plan</span>
|
|
<ion-icon class="ml-1" name="arrow-forward-outline" />
|
|
</a>
|
|
</div>
|
|
}
|
|
@case (3) {
|
|
<h1
|
|
class="align-items-center d-flex justify-content-center"
|
|
mat-dialog-title
|
|
>
|
|
<span>Ghostfolio Premium</span>
|
|
<gf-premium-indicator class="ml-1" [enableLink]="false" />
|
|
</h1>
|
|
<div class="flex-grow-1 pt-0" mat-dialog-content>
|
|
<div class="align-items-center d-flex h-100 justify-content-center">
|
|
<gf-membership-card
|
|
class="gf-pointer-events-none"
|
|
[name]="data?.user?.subscription?.type"
|
|
/>
|
|
</div>
|
|
</div>
|
|
<div class="flex-column" mat-dialog-actions>
|
|
<button
|
|
class="mb-2 py-4 w-100"
|
|
mat-button
|
|
[disabled]="remainingSkipButtonDelay > 0"
|
|
(click)="closeDialog()"
|
|
>
|
|
<ng-container i18n>Skip</ng-container>
|
|
@if (remainingSkipButtonDelay > 0) {
|
|
({{ remainingSkipButtonDelay }})
|
|
}
|
|
</button>
|
|
<a
|
|
class="m-0 py-4 w-100"
|
|
color="primary"
|
|
mat-flat-button
|
|
[routerLink]="routerLinkPricing"
|
|
(click)="closeDialog()"
|
|
>
|
|
<span i18n>Join now</span>
|
|
<ion-icon class="ml-1" name="arrow-forward-outline" />
|
|
</a>
|
|
</div>
|
|
}
|
|
}
|
|
|