Feature/harmonize page layouts (#417)

* Harmonize page layouts * Update changelog
2021-10-13 11:51:33 +02:00 · 2021-10-13 11:51:33 +02:00 · 4ab6a1a071
commit 4ab6a1a071
parent 93dcbeb6c7
24 changed files with 67 additions and 33 deletions
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@ -14,6 +14,10 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
  - Maximum number of orders
  - Data provider service returns data for the `dataSource` / `symbol` pair

+### Changed
+
+- Harmonized the page layouts
+
 ### Fixed

 - Fixed the broken line charts showing value labels
--- a/apps/client/src/app/app.component.html
+++ b/apps/client/src/app/app.component.html
@ -28,7 +28,10 @@
  <router-outlet></router-outlet>
 </main>

-<footer *ngIf="!user" class="footer d-flex justify-content-center w-100">
+<footer
+  *ngIf="currentRoute === 'start'"
+  class="footer d-flex justify-content-center w-100"
+>
  <div class="container text-center">
    <div>
      © {{ currentYear }} <a href="https://ghostfol.io">Ghostfolio</a>
--- a/apps/client/src/app/pages/about/about-page.component.ts
+++ b/apps/client/src/app/pages/about/about-page.component.ts
@ -11,9 +11,10 @@ import { takeUntil } from 'rxjs/operators';
 import { environment } from '../../../environments/environment';

@Component({
+  host: { class: 'mb-5' },
  selector: 'gf-about-page',
-  templateUrl: './about-page.html',
-  styleUrls: ['./about-page.scss']
+  styleUrls: ['./about-page.scss'],
+  templateUrl: './about-page.html'
 })
 export class AboutPageComponent implements OnDestroy, OnInit {
  public baseCurrency = baseCurrency;
--- a/apps/client/src/app/pages/account/account-page.component.ts
+++ b/apps/client/src/app/pages/account/account-page.component.ts
@ -20,9 +20,10 @@ import { EMPTY, Subject } from 'rxjs';
 import { catchError, switchMap, takeUntil } from 'rxjs/operators';

@Component({
+  host: { class: 'mb-5' },
  selector: 'gf-account-page',
-  templateUrl: './account-page.html',
-  styleUrls: ['./account-page.scss']
+  styleUrls: ['./account-page.scss'],
+  templateUrl: './account-page.html'
 })
 export class AccountPageComponent implements OnDestroy, OnInit {
  @ViewChild('toggleSignInWithFingerprintEnabledElement')
--- a/apps/client/src/app/pages/accounts/accounts-page.component.ts
+++ b/apps/client/src/app/pages/accounts/accounts-page.component.ts
@ -16,9 +16,10 @@ import { takeUntil } from 'rxjs/operators';
 import { CreateOrUpdateAccountDialog } from './create-or-update-account-dialog/create-or-update-account-dialog.component';

@Component({
+  host: { class: 'mb-5' },
  selector: 'gf-accounts-page',
-  templateUrl: './accounts-page.html',
-  styleUrls: ['./accounts-page.scss']
+  styleUrls: ['./accounts-page.scss'],
+  templateUrl: './accounts-page.html'
 })
 export class AccountsPageComponent implements OnDestroy, OnInit {
  public accounts: AccountModel[];
--- a/apps/client/src/app/pages/admin/admin-page.component.ts
+++ b/apps/client/src/app/pages/admin/admin-page.component.ts
@ -15,9 +15,10 @@ import { Subject } from 'rxjs';
 import { takeUntil } from 'rxjs/operators';

@Component({
+  host: { class: 'mb-5' },
  selector: 'gf-admin-page',
-  templateUrl: './admin-page.html',
-  styleUrls: ['./admin-page.scss']
+  styleUrls: ['./admin-page.scss'],
+  templateUrl: './admin-page.html'
 })
 export class AdminPageComponent implements OnDestroy, OnInit {
  public dataGatheringInProgress: boolean;
--- a/apps/client/src/app/pages/blog/2021/07/hallo-ghostfolio/hallo-ghostfolio-page.component.ts
+++ b/apps/client/src/app/pages/blog/2021/07/hallo-ghostfolio/hallo-ghostfolio-page.component.ts
@ -1,7 +1,9 @@
 import { Component } from '@angular/core';

@Component({
+  host: { class: 'mb-5' },
  selector: 'gf-hallo-ghostfolio-page',
+  styleUrls: ['./hallo-ghostfolio-page.scss'],
  templateUrl: './hallo-ghostfolio-page.html'
 })
 export class HalloGhostfolioPageComponent {}
--- a/apps/client/src/app/pages/blog/2021/07/hallo-ghostfolio/hallo-ghostfolio-page.html
+++ b/apps/client/src/app/pages/blog/2021/07/hallo-ghostfolio/hallo-ghostfolio-page.html
@ -139,7 +139,7 @@
            Thomas von Ghostfolio
          </p>
        </section>
-        <section class="my-5">
+        <section class="mb-4">
          <ul class="list-inline">
            <li class="h5">
              <span class="badge badge-light font-weight-normal mr-2"
--- a/apps/client/src/app/pages/blog/2021/07/hallo-ghostfolio/hallo-ghostfolio-page.scss
+++ b/apps/client/src/app/pages/blog/2021/07/hallo-ghostfolio/hallo-ghostfolio-page.scss
@ -0,0 +1,3 @@
+:host {
+  display: block;
+}
--- a/apps/client/src/app/pages/blog/2021/07/hello-ghostfolio/hello-ghostfolio-page.component.ts
+++ b/apps/client/src/app/pages/blog/2021/07/hello-ghostfolio/hello-ghostfolio-page.component.ts
@ -1,7 +1,9 @@
 import { Component } from '@angular/core';

@Component({
+  host: { class: 'mb-5' },
  selector: 'gf-hello-ghostfolio-page',
+  styleUrls: ['./hello-ghostfolio-page.scss'],
  templateUrl: './hello-ghostfolio-page.html'
 })
 export class HelloGhostfolioPageComponent {}
--- a/apps/client/src/app/pages/blog/2021/07/hello-ghostfolio/hello-ghostfolio-page.html
+++ b/apps/client/src/app/pages/blog/2021/07/hello-ghostfolio/hello-ghostfolio-page.html
@ -134,7 +134,7 @@
            Thomas from Ghostfolio
          </p>
        </section>
-        <section class="my-5">
+        <section class="mb-4">
          <ul class="list-inline">
            <li class="h5">
              <span class="badge badge-light font-weight-normal mr-2"
--- a/apps/client/src/app/pages/blog/2021/07/hello-ghostfolio/hello-ghostfolio-page.scss
+++ b/apps/client/src/app/pages/blog/2021/07/hello-ghostfolio/hello-ghostfolio-page.scss
@ -0,0 +1,3 @@
+:host {
+  display: block;
+}
--- a/apps/client/src/app/pages/home/home-page.component.ts
+++ b/apps/client/src/app/pages/home/home-page.component.ts
@ -36,8 +36,8 @@ import { takeUntil } from 'rxjs/operators';

@Component({
  selector: 'gf-home-page',
-  templateUrl: './home-page.html',
-  styleUrls: ['./home-page.scss']
+  styleUrls: ['./home-page.scss'],
+  templateUrl: './home-page.html'
 })
 export class HomePageComponent implements OnDestroy, OnInit {
  @HostBinding('class.with-create-account-container') get isDemo() {
--- a/apps/client/src/app/pages/landing/landing-page.component.ts
+++ b/apps/client/src/app/pages/landing/landing-page.component.ts
@ -7,9 +7,10 @@ import { format } from 'date-fns';
 import { Subject } from 'rxjs';

@Component({
+  host: { class: 'mb-5' },
  selector: 'gf-landing-page',
-  templateUrl: './landing-page.html',
-  styleUrls: ['./landing-page.scss']
+  styleUrls: ['./landing-page.scss'],
+  templateUrl: './landing-page.html'
 })
 export class LandingPageComponent implements OnDestroy, OnInit {
  public currentYear = format(new Date(), 'yyyy');
--- a/apps/client/src/app/pages/portfolio/allocations/allocations-page.component.ts
+++ b/apps/client/src/app/pages/portfolio/allocations/allocations-page.component.ts
@ -15,9 +15,10 @@ import { Subject } from 'rxjs';
 import { takeUntil } from 'rxjs/operators';

@Component({
+  host: { class: 'mb-5' },
  selector: 'gf-allocations-page',
-  templateUrl: './allocations-page.html',
-  styleUrls: ['./allocations-page.scss']
+  styleUrls: ['./allocations-page.scss'],
+  templateUrl: './allocations-page.html'
 })
 export class AllocationsPageComponent implements OnDestroy, OnInit {
  public accounts: {
--- a/apps/client/src/app/pages/portfolio/analysis/analysis-page.component.ts
+++ b/apps/client/src/app/pages/portfolio/analysis/analysis-page.component.ts
@ -10,9 +10,10 @@ import { Subject } from 'rxjs';
 import { takeUntil } from 'rxjs/operators';

@Component({
+  host: { class: 'mb-5' },
  selector: 'gf-analysis-page',
-  templateUrl: './analysis-page.html',
-  styleUrls: ['./analysis-page.scss']
+  styleUrls: ['./analysis-page.scss'],
+  templateUrl: './analysis-page.html'
 })
 export class AnalysisPageComponent implements OnDestroy, OnInit {
  public accounts: {
--- a/apps/client/src/app/pages/portfolio/portfolio-page.component.ts
+++ b/apps/client/src/app/pages/portfolio/portfolio-page.component.ts
@ -7,9 +7,10 @@ import { Subject } from 'rxjs';
 import { takeUntil } from 'rxjs/operators';

@Component({
+  host: { class: 'mb-5' },
  selector: 'gf-portfolio-page',
-  templateUrl: './portfolio-page.html',
-  styleUrls: ['./portfolio-page.scss']
+  styleUrls: ['./portfolio-page.scss'],
+  templateUrl: './portfolio-page.html'
 })
 export class PortfolioPageComponent implements OnDestroy, OnInit {
  public hasPermissionForSubscription: boolean;
--- a/apps/client/src/app/pages/portfolio/report/report-page.component.ts
+++ b/apps/client/src/app/pages/portfolio/report/report-page.component.ts
@ -5,9 +5,10 @@ import { Subject } from 'rxjs';
 import { takeUntil } from 'rxjs/operators';

@Component({
+  host: { class: 'mb-5' },
  selector: 'gf-report-page',
-  templateUrl: './report-page.html',
-  styleUrls: ['./report-page.scss']
+  styleUrls: ['./report-page.scss'],
+  templateUrl: './report-page.html'
 })
 export class ReportPageComponent implements OnDestroy, OnInit {
  public accountClusterRiskRules: PortfolioReportRule[];
--- a/apps/client/src/app/pages/portfolio/transactions/transactions-page.component.ts
+++ b/apps/client/src/app/pages/portfolio/transactions/transactions-page.component.ts
@ -19,9 +19,10 @@ import { CreateOrUpdateTransactionDialog } from './create-or-update-transaction-
 import { ImportTransactionDialog } from './import-transaction-dialog/import-transaction-dialog.component';

@Component({
+  host: { class: 'mb-5' },
  selector: 'gf-transactions-page',
-  templateUrl: './transactions-page.html',
-  styleUrls: ['./transactions-page.scss']
+  styleUrls: ['./transactions-page.scss'],
+  templateUrl: './transactions-page.html'
 })
 export class TransactionsPageComponent implements OnDestroy, OnInit {
  public defaultAccountId: string;
--- a/apps/client/src/app/pages/pricing/pricing-page.component.ts
+++ b/apps/client/src/app/pages/pricing/pricing-page.component.ts
@ -7,9 +7,10 @@ import { Subject } from 'rxjs';
 import { takeUntil } from 'rxjs/operators';

@Component({
+  host: { class: 'mb-5' },
  selector: 'gf-pricing-page',
-  templateUrl: './pricing-page.html',
-  styleUrls: ['./pricing-page.scss']
+  styleUrls: ['./pricing-page.scss'],
+  templateUrl: './pricing-page.html'
 })
 export class PricingPageComponent implements OnDestroy, OnInit {
  public baseCurrency = baseCurrency;
--- a/apps/client/src/app/pages/register/register-page.component.ts
+++ b/apps/client/src/app/pages/register/register-page.component.ts
@ -12,9 +12,10 @@ import { takeUntil } from 'rxjs/operators';
 import { ShowAccessTokenDialog } from './show-access-token-dialog/show-access-token-dialog.component';

@Component({
+  host: { class: 'mb-5' },
  selector: 'gf-register-page',
-  templateUrl: './register-page.html',
-  styleUrls: ['./register-page.scss']
+  styleUrls: ['./register-page.scss'],
+  templateUrl: './register-page.html'
 })
 export class RegisterPageComponent implements OnDestroy, OnInit {
  public currentYear = format(new Date(), 'yyyy');
--- a/apps/client/src/app/pages/resources/resources-page.component.ts
+++ b/apps/client/src/app/pages/resources/resources-page.component.ts
@ -2,9 +2,10 @@ import { Component, OnInit } from '@angular/core';
 import { Subject } from 'rxjs';

@Component({
+  host: { class: 'mb-5' },
  selector: 'gf-resources-page',
-  templateUrl: './resources-page.html',
-  styleUrls: ['./resources-page.scss']
+  styleUrls: ['./resources-page.scss'],
+  templateUrl: './resources-page.html'
 })
 export class ResourcesPageComponent implements OnInit {
  private unsubscribeSubject = new Subject<void>();
--- a/apps/client/src/app/pages/webauthn/webauthn-page.component.ts
+++ b/apps/client/src/app/pages/webauthn/webauthn-page.component.ts
@ -6,9 +6,10 @@ import { Subject } from 'rxjs';
 import { takeUntil } from 'rxjs/operators';

@Component({
+  host: { class: 'mb-5' },
  selector: 'gf-webauthn-page',
-  templateUrl: './webauthn-page.html',
-  styleUrls: ['./webauthn-page.scss']
+  styleUrls: ['./webauthn-page.scss'],
+  templateUrl: './webauthn-page.html'
 })
 export class WebauthnPageComponent implements OnDestroy, OnInit {
  public hasError = false;
--- a/apps/client/src/app/pages/webauthn/webauthn-page.scss
+++ b/apps/client/src/app/pages/webauthn/webauthn-page.scss
@ -0,0 +1,3 @@
+:host {
+  display: block;
+}