Feature/setup black friday 2022 deal (#1452)
* Setup Black Friday 2022 deal * Update changelog
This commit is contained in:
parent
c9bdf46b2b
commit
3b4f8c69bb
@ -10,6 +10,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
|
||||
### Added
|
||||
|
||||
- Added an indicator for excluded accounts in the accounts table
|
||||
- Added a blog post: _Black Friday 2022_
|
||||
|
||||
## 1.212.0 - 11.11.2022
|
||||
|
||||
|
@ -53,16 +53,12 @@ export class FrontendMiddleware implements NestMiddleware {
|
||||
public use(req: Request, res: Response, next: NextFunction) {
|
||||
let featureGraphicPath = 'assets/cover.png';
|
||||
|
||||
if (
|
||||
req.path === '/en/blog/2022/08/500-stars-on-github' ||
|
||||
req.path === '/en/blog/2022/08/500-stars-on-github/'
|
||||
) {
|
||||
if (req.path.startsWith('/en/blog/2022/08/500-stars-on-github')) {
|
||||
featureGraphicPath = 'assets/images/blog/500-stars-on-github.jpg';
|
||||
} else if (
|
||||
req.path === '/en/blog/2022/10/hacktoberfest-2022' ||
|
||||
req.path === '/en/blog/2022/10/hacktoberfest-2022/'
|
||||
) {
|
||||
} else if (req.path.startsWith('/en/blog/2022/10/hacktoberfest-2022')) {
|
||||
featureGraphicPath = 'assets/images/blog/hacktoberfest-2022.png';
|
||||
} else if (req.path.startsWith('/en/blog/2022/11/black-friday-2022')) {
|
||||
featureGraphicPath = 'assets/images/blog/black-friday-2022.jpg';
|
||||
}
|
||||
|
||||
if (
|
||||
|
@ -102,6 +102,13 @@ const routes: Routes = [
|
||||
'./pages/blog/2022/10/hacktoberfest-2022/hacktoberfest-2022-page.module'
|
||||
).then((m) => m.Hacktoberfest2022PageModule)
|
||||
},
|
||||
{
|
||||
path: 'blog/2022/11/black-friday-2022',
|
||||
loadChildren: () =>
|
||||
import(
|
||||
'./pages/blog/2022/11/black-friday-2022/black-friday-2022-page.module'
|
||||
).then((m) => m.BlackFriday2022PageModule)
|
||||
},
|
||||
{
|
||||
path: 'demo',
|
||||
loadChildren: () =>
|
||||
|
@ -0,0 +1,20 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { RouterModule, Routes } from '@angular/router';
|
||||
import { AuthGuard } from '@ghostfolio/client/core/auth.guard';
|
||||
|
||||
import { BlackFriday2022PageComponent } from './black-friday-2022-page.component';
|
||||
|
||||
const routes: Routes = [
|
||||
{
|
||||
canActivate: [AuthGuard],
|
||||
component: BlackFriday2022PageComponent,
|
||||
path: '',
|
||||
title: 'Black Friday 2022'
|
||||
}
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [RouterModule.forChild(routes)],
|
||||
exports: [RouterModule]
|
||||
})
|
||||
export class BlackFriday2022RoutingModule {}
|
@ -0,0 +1,21 @@
|
||||
import { Component } from '@angular/core';
|
||||
import { DataService } from '@ghostfolio/client/services/data.service';
|
||||
|
||||
@Component({
|
||||
host: { class: 'page' },
|
||||
selector: 'gf-black-friday-2022-page',
|
||||
styleUrls: ['./black-friday-2022-page.scss'],
|
||||
templateUrl: './black-friday-2022-page.html'
|
||||
})
|
||||
export class BlackFriday2022PageComponent {
|
||||
public discount: number;
|
||||
|
||||
public constructor(private dataService: DataService) {
|
||||
const { subscriptions } = this.dataService.fetchInfo();
|
||||
|
||||
const coupon = subscriptions?.[0]?.coupon ?? 0;
|
||||
const price = subscriptions?.[0]?.price ?? 1;
|
||||
|
||||
this.discount = Math.floor((coupon / price) * 100) / 100;
|
||||
}
|
||||
}
|
@ -0,0 +1,138 @@
|
||||
<div class="blog container">
|
||||
<div class="row">
|
||||
<div class="col-md-8 offset-md-2">
|
||||
<article>
|
||||
<div class="mb-4 text-center">
|
||||
<h1 class="mb-1">Black Friday 2022</h1>
|
||||
<div class="mb-3 text-muted"><small>2022-11-13</small></div>
|
||||
<img
|
||||
alt="Black Friday 2022 Teaser"
|
||||
class="rounded w-100"
|
||||
src="../assets/images/blog/black-friday-2022.jpg"
|
||||
title="Black Friday 2022"
|
||||
/>
|
||||
</div>
|
||||
<section class="mb-4">
|
||||
<p>
|
||||
Get {{ discount | percent }} off on our
|
||||
<strong>Ghostfolio Premium</strong>
|
||||
<gf-premium-indicator
|
||||
class="d-inline-block ml-1"
|
||||
[enableLink]="false"
|
||||
></gf-premium-indicator>
|
||||
annual plan for ambitious investors who need the full picture of
|
||||
their financial assets.
|
||||
</p>
|
||||
</section>
|
||||
<section class="mb-4">
|
||||
<p>
|
||||
<a
|
||||
href="https://ghostfol.io"
|
||||
title="Open Source Wealth Management Software"
|
||||
>Ghostfolio</a
|
||||
>
|
||||
is a modern web application to manage your personal finance. The
|
||||
software presents the current assets (stocks, ETFs,
|
||||
cryptocurrencies, commodities etc.) in real time to make solid,
|
||||
data-driven investment decisions. Check out the numerous
|
||||
<a [routerLink]="['/features']">features</a> to manage your wealth.
|
||||
</p>
|
||||
</section>
|
||||
<section class="mb-4">
|
||||
<p>
|
||||
Snap the limited Black Friday 2022 deal before it’s gone. For
|
||||
detailed information on plans and pricing, please visit our
|
||||
<a [routerLink]="['/pricing']">pricing page</a>.
|
||||
</p>
|
||||
<p class="text-center">
|
||||
<a color="primary" mat-flat-button [routerLink]="['/pricing']"
|
||||
>Get the Deal</a
|
||||
>
|
||||
</p>
|
||||
</section>
|
||||
<section class="mb-4">
|
||||
<ul class="list-inline">
|
||||
<li class="list-inline-item">
|
||||
<span class="badge badge-light">2022</span>
|
||||
</li>
|
||||
<li class="list-inline-item">
|
||||
<span class="badge badge-light">Black Friday</span>
|
||||
</li>
|
||||
<li class="list-inline-item">
|
||||
<span class="badge badge-light">Cloud</span>
|
||||
</li>
|
||||
<li class="list-inline-item">
|
||||
<span class="badge badge-light">Cryptocurrency</span>
|
||||
</li>
|
||||
<li class="list-inline-item">
|
||||
<span class="badge badge-light">Deal</span>
|
||||
</li>
|
||||
<li class="list-inline-item">
|
||||
<span class="badge badge-light">ETF</span>
|
||||
</li>
|
||||
<li class="list-inline-item">
|
||||
<span class="badge badge-light">Finance</span>
|
||||
</li>
|
||||
<li class="list-inline-item">
|
||||
<span class="badge badge-light">Fintech</span>
|
||||
</li>
|
||||
<li class="list-inline-item">
|
||||
<span class="badge badge-light">Ghostfolio</span>
|
||||
</li>
|
||||
<li class="list-inline-item">
|
||||
<span class="badge badge-light">Ghostfolio Premium</span>
|
||||
</li>
|
||||
<li class="list-inline-item">
|
||||
<span class="badge badge-light">Hosting</span>
|
||||
</li>
|
||||
<li class="list-inline-item">
|
||||
<span class="badge badge-light">Investment</span>
|
||||
</li>
|
||||
<li class="list-inline-item">
|
||||
<span class="badge badge-light">Open Source</span>
|
||||
</li>
|
||||
<li class="list-inline-item">
|
||||
<span class="badge badge-light">OSS</span>
|
||||
</li>
|
||||
<li class="list-inline-item">
|
||||
<span class="badge badge-light">Personal Finance</span>
|
||||
</li>
|
||||
<li class="list-inline-item">
|
||||
<span class="badge badge-light">Portfolio</span>
|
||||
</li>
|
||||
<li class="list-inline-item">
|
||||
<span class="badge badge-light">Portfolio Tracker</span>
|
||||
</li>
|
||||
<li class="list-inline-item">
|
||||
<span class="badge badge-light">Pricing</span>
|
||||
</li>
|
||||
<li class="list-inline-item">
|
||||
<span class="badge badge-light">SaaS</span>
|
||||
</li>
|
||||
<li class="list-inline-item">
|
||||
<span class="badge badge-light">Software</span>
|
||||
</li>
|
||||
<li class="list-inline-item">
|
||||
<span class="badge badge-light">Stock</span>
|
||||
</li>
|
||||
<li class="list-inline-item">
|
||||
<span class="badge badge-light">Subscription</span>
|
||||
</li>
|
||||
<li class="list-inline-item">
|
||||
<span class="badge badge-light">Wealth</span>
|
||||
</li>
|
||||
<li class="list-inline-item">
|
||||
<span class="badge badge-light">Wealth Management</span>
|
||||
</li>
|
||||
<li class="list-inline-item">
|
||||
<span class="badge badge-light">Web3</span>
|
||||
</li>
|
||||
<li class="list-inline-item">
|
||||
<span class="badge badge-light">Web 3.0</span>
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
</article>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
@ -0,0 +1,21 @@
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { CUSTOM_ELEMENTS_SCHEMA, NgModule } from '@angular/core';
|
||||
import { MatButtonModule } from '@angular/material/button';
|
||||
import { RouterModule } from '@angular/router';
|
||||
import { GfPremiumIndicatorModule } from '@ghostfolio/ui/premium-indicator';
|
||||
|
||||
import { BlackFriday2022RoutingModule } from './black-friday-2022-page-routing.module';
|
||||
import { BlackFriday2022PageComponent } from './black-friday-2022-page.component';
|
||||
|
||||
@NgModule({
|
||||
declarations: [BlackFriday2022PageComponent],
|
||||
imports: [
|
||||
BlackFriday2022RoutingModule,
|
||||
CommonModule,
|
||||
GfPremiumIndicatorModule,
|
||||
MatButtonModule,
|
||||
RouterModule
|
||||
],
|
||||
schemas: [CUSTOM_ELEMENTS_SCHEMA]
|
||||
})
|
||||
export class BlackFriday2022PageModule {}
|
@ -0,0 +1,3 @@
|
||||
:host {
|
||||
display: block;
|
||||
}
|
@ -1,4 +1,6 @@
|
||||
import { Component, OnDestroy } from '@angular/core';
|
||||
import { DataService } from '@ghostfolio/client/services/data.service';
|
||||
import { hasPermission, permissions } from '@ghostfolio/common/permissions';
|
||||
import { Subject } from 'rxjs';
|
||||
|
||||
@Component({
|
||||
@ -8,9 +10,18 @@ import { Subject } from 'rxjs';
|
||||
templateUrl: './blog-page.html'
|
||||
})
|
||||
export class BlogPageComponent implements OnDestroy {
|
||||
public hasPermissionForSubscription: boolean;
|
||||
|
||||
private unsubscribeSubject = new Subject<void>();
|
||||
|
||||
public constructor() {}
|
||||
public constructor(private dataService: DataService) {
|
||||
const info = this.dataService.fetchInfo();
|
||||
|
||||
this.hasPermissionForSubscription = hasPermission(
|
||||
info?.globalPermissions,
|
||||
permissions.enableSubscription
|
||||
);
|
||||
}
|
||||
|
||||
public ngOnDestroy() {
|
||||
this.unsubscribeSubject.next();
|
||||
|
@ -2,6 +2,30 @@
|
||||
<div class="mb-5 row">
|
||||
<div class="col">
|
||||
<h3 class="mb-3 text-center" i18n>Blog</h3>
|
||||
<mat-card *ngIf="hasPermissionForSubscription" class="mb-3">
|
||||
<mat-card-content>
|
||||
<div class="container p-0">
|
||||
<div class="flex-nowrap no-gutters row">
|
||||
<a
|
||||
class="d-flex w-100"
|
||||
href="../en/blog/2022/11/black-friday-2022"
|
||||
>
|
||||
<div class="flex-grow-1">
|
||||
<div class="h6 m-0 text-truncate">Black Friday 2022</div>
|
||||
<div class="d-flex text-muted">2022-11-13</div>
|
||||
</div>
|
||||
<div class="align-items-center d-flex">
|
||||
<ion-icon
|
||||
class="chevron text-muted"
|
||||
name="chevron-forward-outline"
|
||||
size="small"
|
||||
></ion-icon>
|
||||
</div>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
<mat-card class="mb-3">
|
||||
<mat-card-content>
|
||||
<div class="container p-0">
|
||||
|
@ -28,7 +28,7 @@ export class PricingPageComponent implements OnDestroy, OnInit {
|
||||
const { baseCurrency, subscriptions } = this.dataService.fetchInfo();
|
||||
|
||||
this.baseCurrency = baseCurrency;
|
||||
this.coupon = this.price = subscriptions?.[0]?.coupon;
|
||||
this.coupon = subscriptions?.[0]?.coupon;
|
||||
this.price = subscriptions?.[0]?.price;
|
||||
}
|
||||
|
||||
|
@ -1,3 +1,16 @@
|
||||
<div
|
||||
*ngIf="!user || user?.subscription?.type === 'Basic'"
|
||||
class="intro mb-5 py-5"
|
||||
>
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
<h1 class="font-weight-bold m-0 text-center">Black Friday Deal</h1>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col">
|
||||
|
@ -11,6 +11,20 @@
|
||||
}
|
||||
}
|
||||
|
||||
.intro {
|
||||
background-color: rgb(var(--dark-primary-text));
|
||||
color: rgba(var(--palette-primary-500), 1);
|
||||
|
||||
h1 {
|
||||
font-size: 4vw;
|
||||
line-height: 1;
|
||||
|
||||
@media (max-width: 575.98px) {
|
||||
font-size: 10vw;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.mat-card {
|
||||
&:hover,
|
||||
&.active {
|
||||
@ -22,4 +36,8 @@
|
||||
|
||||
:host-context(.is-dark-theme) {
|
||||
color: rgb(var(--light-primary-text));
|
||||
|
||||
.intro {
|
||||
background-color: rgba(var(--light-dividers));
|
||||
}
|
||||
}
|
||||
|
BIN
apps/client/src/assets/images/blog/black-friday-2022.jpg
Normal file
BIN
apps/client/src/assets/images/blog/black-friday-2022.jpg
Normal file
Binary file not shown.
After Width: | Height: | Size: 188 KiB |
@ -6,74 +6,78 @@
|
||||
http://www.sitemaps.org/schemas/sitemap/0.9/sitemap.xsd">
|
||||
<url>
|
||||
<loc>https://ghostfol.io</loc>
|
||||
<lastmod>2022-10-16T00:00:00+00:00</lastmod>
|
||||
<lastmod>2022-11-10T00:00:00+00:00</lastmod>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://ghostfol.io/de/blog/2021/07/hallo-ghostfolio</loc>
|
||||
<lastmod>2022-10-16T00:00:00+00:00</lastmod>
|
||||
<lastmod>2022-11-10T00:00:00+00:00</lastmod>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://ghostfol.io/en/about</loc>
|
||||
<lastmod>2022-10-16T00:00:00+00:00</lastmod>
|
||||
<lastmod>2022-11-10T00:00:00+00:00</lastmod>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://ghostfol.io/en/about/changelog</loc>
|
||||
<lastmod>2022-10-16T00:00:00+00:00</lastmod>
|
||||
<lastmod>2022-11-10T00:00:00+00:00</lastmod>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://ghostfol.io/en/blog</loc>
|
||||
<lastmod>2022-10-16T00:00:00+00:00</lastmod>
|
||||
<lastmod>2022-11-10T00:00:00+00:00</lastmod>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://ghostfol.io/en/blog/2021/07/hello-ghostfolio</loc>
|
||||
<lastmod>2022-10-16T00:00:00+00:00</lastmod>
|
||||
<lastmod>2022-11-10T00:00:00+00:00</lastmod>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://ghostfol.io/en/blog/2022/01/ghostfolio-first-months-in-open-source</loc>
|
||||
<lastmod>2022-10-16T00:00:00+00:00</lastmod>
|
||||
<lastmod>2022-11-10T00:00:00+00:00</lastmod>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://ghostfol.io/en/blog/2022/07/ghostfolio-meets-internet-identity</loc>
|
||||
<lastmod>2022-10-16T00:00:00+00:00</lastmod>
|
||||
<lastmod>2022-11-10T00:00:00+00:00</lastmod>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://ghostfol.io/en/blog/2022/07/how-do-i-get-my-finances-in-order</loc>
|
||||
<lastmod>2022-10-16T00:00:00+00:00</lastmod>
|
||||
<lastmod>2022-11-10T00:00:00+00:00</lastmod>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://ghostfol.io/en/blog/2022/08/500-stars-on-github</loc>
|
||||
<lastmod>2022-10-16T00:00:00+00:00</lastmod>
|
||||
<lastmod>2022-11-10T00:00:00+00:00</lastmod>
|
||||
</url>
|
||||
<url>
|
||||
<url>
|
||||
<loc>https://ghostfol.io/en/blog/2022/10/hacktoberfest-2022</loc>
|
||||
<lastmod>2022-10-16T00:00:00+00:00</lastmod>
|
||||
<lastmod>2022-11-10T00:00:00+00:00</lastmod>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://ghostfol.io/en/blog/2022/11/black-friday-2022</loc>
|
||||
<lastmod>2022-11-10T00:00:00+00:00</lastmod>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://ghostfol.io/en/demo</loc>
|
||||
<lastmod>2022-10-16T00:00:00+00:00</lastmod>
|
||||
<lastmod>2022-11-10T00:00:00+00:00</lastmod>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://ghostfol.io/en/faq</loc>
|
||||
<lastmod>2022-10-16T00:00:00+00:00</lastmod>
|
||||
<lastmod>2022-11-10T00:00:00+00:00</lastmod>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://ghostfol.io/en/features</loc>
|
||||
<lastmod>2022-10-16T00:00:00+00:00</lastmod>
|
||||
<lastmod>2022-11-10T00:00:00+00:00</lastmod>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://ghostfol.io/en/markets</loc>
|
||||
<lastmod>2022-10-16T00:00:00+00:00</lastmod>
|
||||
<lastmod>2022-11-10T00:00:00+00:00</lastmod>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://ghostfol.io/en/pricing</loc>
|
||||
<lastmod>2022-10-16T00:00:00+00:00</lastmod>
|
||||
<lastmod>2022-11-10T00:00:00+00:00</lastmod>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://ghostfol.io/en/register</loc>
|
||||
<lastmod>2022-10-16T00:00:00+00:00</lastmod>
|
||||
<lastmod>2022-11-10T00:00:00+00:00</lastmod>
|
||||
</url>
|
||||
<url>
|
||||
<loc>https://ghostfol.io/en/resources</loc>
|
||||
<lastmod>2022-10-16T00:00:00+00:00</lastmod>
|
||||
<lastmod>2022-11-10T00:00:00+00:00</lastmod>
|
||||
</url>
|
||||
</urlset>
|
||||
|
@ -38,11 +38,13 @@ body {
|
||||
|
||||
.blog {
|
||||
a {
|
||||
color: rgba(var(--palette-primary-500), 1) !important;
|
||||
font-weight: 500;
|
||||
&:not(.mat-flat-button) {
|
||||
color: rgba(var(--palette-primary-500), 1) !important;
|
||||
font-weight: 500;
|
||||
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
&:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
Loading…
x
Reference in New Issue
Block a user