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

<div class="container">
  <div class="mb-5 row">
    <div class="col">
      <h3 class="d-flex justify-content-center mb-3" i18n>About Ghostfolio</h3>
      <mat-card>
        <mat-card-content>
          <p>
            <strong>Ghostfolio</strong> is open source software which empowers
            busy folks to have a sharp look of their financial assets and to
            make solid, data-driven investment decisions by evaluating automated
            static portfolio analysis rules. The project has been initiated by
            <a href="https://dotsilver.ch">Thomas Kaul</a>.
            <ng-container *ngIf="lastPublish">
              This instance is running Ghostfolio {{ version }} and has been
              last published on {{ lastPublish }}.</ng-container
            >
          </p>
          <p>
            If you encounter a bug or would like to suggest an improvement or a
            new feature, please tweet to
            <a href="https://twitter.com/ghostfolio_">@ghostfolio_</a>, send an
            e-mail to <a href="mailto:hi@ghostfol.io">hi@ghostfol.io</a> or open
            an issue at
            <a href="https://github.com/ghostfolio/ghostfolio">GitHub</a>.
          </p>
          <p class="text-center">
            <a
              class="mx-2"
              href="https://twitter.com/ghostfolio_"
              mat-icon-button
              title="Follow Ghostfolio on Twitter"
            >
              <ion-icon name="logo-twitter" size="large"></ion-icon>
            </a>
            <a
              class="mx-2"
              href="mailto:hi@ghostfol.io"
              mat-icon-button
              title="Send an e-mail"
            >
              <ion-icon name="mail" size="large"></ion-icon>
            </a>
            <a
              class="mx-2"
              href="https://github.com/ghostfolio/ghostfolio"
              mat-icon-button
              title="Find Ghostfolio on GitHub"
            >
              <ion-icon name="logo-github" size="large"></ion-icon>
            </a>
          </p>
          <div class="d-flex justify-content-center">
            <div
              class="independent-and-bootstrapped-logo mb-2"
              title="Ghostfolio is an independent & bootstrapped business"
            ></div>
          </div>
        </mat-card-content>
      </mat-card>
    </div>
  </div>

  <div *ngIf="hasPermissionForStatistics" class="mb-5 row">
    <div class="col">
      <h3 class="mb-3 text-center" i18n>Ghostfolio in Numbers</h3>
      <mat-card>
        <mat-card-content>
          <div class="row">
            <div class="col-xs-12 col-md-4 my-2">
              <h3 class="mb-0" [hidden]="!statistics?.activeUsers1d">
                {{ statistics?.activeUsers1d ?? '-' }}
              </h3>
              <div class="h6 mb-0">
                Active Users <small class="text-muted">(Last 24 hours)</small>
              </div>
            </div>
            <div class="col-xs-12 col-md-4 my-2">
              <h3 class="mb-0" [hidden]="!statistics?.activeUsers30d">
                {{ statistics?.activeUsers30d ?? '-' }}
              </h3>
              <div class="h6 mb-0">
                Active Users <small class="text-muted">(Last 30 days)</small>
              </div>
            </div>
            <div class="col-xs-12 col-md-4 my-2">
              <h3 class="mb-0" [hidden]="!statistics?.gitHubStargazers">
                {{ statistics?.gitHubStargazers ?? '-' }}
              </h3>
              <div class="h6 mb-0">Stars on GitHub</div>
            </div>
          </div>
        </mat-card-content>
      </mat-card>
    </div>
  </div>

  <div class="mb-5 row">
    <div class="col">
      <h3 class="mb-3 text-center" i18n>Changelog</h3>
      <mat-card class="changelog">
        <mat-card-content>
          <markdown [src]="'CHANGELOG.md'"></markdown>
        </mat-card-content>
      </mat-card>
    </div>
  </div>

  <div class="row">
    <div class="col">
      <h3 class="mb-3 text-center" i18n>License</h3>
      <mat-card>
        <mat-card-content>
          <markdown [src]="'LICENSE'"></markdown>
        </mat-card-content>
      </mat-card>
    </div>
  </div>
</div>