Browse Source

Simplify about page

pull/892/head
Thomas 3 years ago
parent
commit
eb85c57eef
  1. 1
      apps/client/src/app/pages/about/about-page.component.ts
  2. 22
      apps/client/src/app/pages/about/about-page.html
  3. 6
      apps/client/src/app/pages/about/about-page.scss

1
apps/client/src/app/pages/about/about-page.component.ts

@ -22,7 +22,6 @@ export class AboutPageComponent implements OnDestroy, OnInit {
public hasPermissionForStatistics: boolean; public hasPermissionForStatistics: boolean;
public hasPermissionForSubscription: boolean; public hasPermissionForSubscription: boolean;
public isLoggedIn: boolean; public isLoggedIn: boolean;
public lastPublish = environment.lastPublish;
public statistics: Statistics; public statistics: Statistics;
public user: User; public user: User;
public version = environment.version; public version = environment.version;

22
apps/client/src/app/pages/about/about-page.html

@ -2,14 +2,13 @@
<div class="mb-5 row"> <div class="mb-5 row">
<div class="col"> <div class="col">
<h3 class="d-flex justify-content-center mb-3" i18n>About Ghostfolio</h3> <h3 class="d-flex justify-content-center mb-3" i18n>About Ghostfolio</h3>
<mat-card class="about-container"> <div class="about-container">
<mat-card-content>
<p> <p>
<strong>Ghostfolio</strong> is a lightweight wealth management <strong>Ghostfolio</strong> is a lightweight wealth management
application for individuals to keep track of their wealth like application for individuals to keep track of stocks, ETFs or
stocks, ETFs or cryptocurrencies and make solid, data-driven cryptocurrencies and make solid, data-driven investment decisions. The
investment decisions. The source code is fully available as open source code is fully available as open source software (OSS). The
source software (OSS). The project has been initiated by project has been initiated by
<a href="https://dotsilver.ch" title="Website of Thomas Kaul" <a href="https://dotsilver.ch" title="Website of Thomas Kaul"
>Thomas Kaul</a >Thomas Kaul</a
> >
@ -19,9 +18,8 @@
title="Contributors to Ghostfolio" title="Contributors to Ghostfolio"
>contributors</a >contributors</a
>. >.
<ng-container *ngIf="lastPublish"> <ng-container *ngIf="version">
This instance is running Ghostfolio {{ version }} and has been This instance is running Ghostfolio {{ version }}.
last published on {{ lastPublish }}.
</ng-container> </ng-container>
<ng-container *ngIf="hasPermissionForStatistics" i18n <ng-container *ngIf="hasPermissionForStatistics" i18n
>Check the system status at >Check the system status at
@ -32,7 +30,8 @@
</p> </p>
<p> <p>
If you encounter a bug or would like to suggest an improvement or a If you encounter a bug or would like to suggest an improvement or a
new <a [routerLink]="['/features']">feature</a>, please join the new
<a [routerLink]="['/features']">feature</a>, please join the
Ghostfolio Ghostfolio
<a <a
href="https://join.slack.com/t/ghostfolio/shared_invite/zt-vsaan64h-F_I0fEo5M0P88lP9ibCxFg" href="https://join.slack.com/t/ghostfolio/shared_invite/zt-vsaan64h-F_I0fEo5M0P88lP9ibCxFg"
@ -97,8 +96,7 @@
title="Ghostfolio is an independent & bootstrapped business" title="Ghostfolio is an independent & bootstrapped business"
></div> ></div>
</div> </div>
</mat-card-content> </div>
</mat-card>
</div> </div>
</div> </div>

6
apps/client/src/app/pages/about/about-page.scss

@ -2,8 +2,7 @@
color: rgb(var(--dark-primary-text)); color: rgb(var(--dark-primary-text));
display: block; display: block;
.mat-card { .about-container {
&.about-container {
a { a {
color: rgba(var(--palette-primary-500), 1); color: rgba(var(--palette-primary-500), 1);
font-weight: 500; font-weight: 500;
@ -12,7 +11,6 @@
color: rgba(var(--palette-primary-300), 1); color: rgba(var(--palette-primary-300), 1);
} }
} }
}
.independent-and-bootstrapped-logo { .independent-and-bootstrapped-logo {
background-image: url('/assets/bootstrapped-dark.svg'); background-image: url('/assets/bootstrapped-dark.svg');
@ -29,7 +27,7 @@
:host-context(.is-dark-theme) { :host-context(.is-dark-theme) {
color: rgb(var(--light-primary-text)); color: rgb(var(--light-primary-text));
.mat-card { .about-container {
.independent-and-bootstrapped-logo { .independent-and-bootstrapped-logo {
background-image: url('/assets/bootstrapped-light.svg'); background-image: url('/assets/bootstrapped-light.svg');
opacity: 1; opacity: 1;

Loading…
Cancel
Save