Merge remote-tracking branch 'origin/master'

# Conflicts:
#	angular.json
#	package.json
#	pnpm-lock.yaml
#	tsconfig.json

Author: Clashsoft

.github/workflows/ci.yml

@@ -11,25 +11,34 @@ jobs:
       - name: Checkout
         uses: actions/checkout@v2
       - name: Set up Node 16
-        uses: actions/setup-node@v1
+        uses: actions/setup-node@v3
         with:
           node-version: '16'
-      - name: Install PNPM
-        run: npm install -g pnpm
-      - name: Cache PNPM Store
-        uses: actions/cache@v2
+      - uses: pnpm/[email protected]
+        name: Install pnpm
+        id: pnpm-install
         with:
-          path: |
-            ~/.pnpm-store
-            /.pnpm-store
-          key: ${{ runner.os }}-pnpm-${{ hashFiles('**/pnpm-lock.yaml') }}
-          restore-keys: ${{ runner.os }}-pnpm
+          version: 7
+          run_install: false
+      - name: Get pnpm store directory
+        id: pnpm-cache
+        run: |
+          echo "::set-output name=pnpm_cache_dir::$(pnpm store path)"
+      - uses: actions/cache@v3
+        name: Setup pnpm cache
+        with:
+          path: ${{ steps.pnpm-cache.outputs.pnpm_cache_dir }}
+          key: ${{ runner.os }}-pnpm-store-${{ hashFiles('**/pnpm-lock.yaml') }}
+          restore-keys: |
+            ${{ runner.os }}-pnpm-store-
       - name: Install
         run: pnpm install
       - name: Build
         run: pnpm build
-      - name: Deploy
+      - name: Deploy to Pages
         if: github.ref == 'refs/heads/master'
-        env:
-          GH_TOKEN: ${{ secrets.GH_TOKEN }}
-        run: pnpm run -- ng deploy --no-build --cname=app.clashsoft.de --name=Clashsoft --email=${{ secrets.EMAIL }}
+        uses: peaceiris/actions-gh-pages@v3
+        with:
+          github_token: ${{ secrets.GITHUB_TOKEN }}
+          publish_dir: dist/clashsoft-apps/
+          cname: app.clashsoft.de

src/app/app-card/app-card.component.html

@@ -1,17 +1,19 @@
-<div class="card-header">
-  <ng-content select="[header]"></ng-content>
-</div>
-<div class="card-body">
-  <h5 class="card-title">
-    {{title}}
-    <span class="badge bg-secondary" *ngIf="wip">WIP</span>
-  </h5>
-  <p class="card-text">
-    <ng-content select="[description]"></ng-content>
-  </p>
-</div>
-<div class="card-footer">
-  <a [routerLink]="id" role="button" class="btn btn-{{color}} btn-lg">
-    Open
-  </a>
+<div class="card h-100 shadow">
+  <div class="card-header">
+    <ng-content select="[header]"></ng-content>
+  </div>
+  <div class="card-body">
+    <h5 class="card-title">
+      {{title}}
+      <span class="badge bg-secondary" *ngIf="wip">WIP</span>
+    </h5>
+    <p class="card-text">
+      <ng-content select="[description]"></ng-content>
+    </p>
+  </div>
+  <div class="card-footer">
+    <a [routerLink]="id" role="button" class="btn btn-{{color}} btn-lg">
+      Open
+    </a>
+  </div>
 </div>

src/app/app-card/app-card.component.scss

@@ -0,0 +1,8 @@
+.card {
+  transition: all .5s;
+}
+
+.card:hover {
+  z-index: 1;
+  transform: scale(1.05);
+}

src/app/app-card/app-card.component.ts

@@ -1,4 +1,4 @@
-import {Component, HostBinding, Input} from '@angular/core';
+import {Component, Input} from '@angular/core';
 
 @Component({
   selector: 'app-app-card',
@@ -10,6 +10,4 @@ export class AppCardComponent {
   @Input() title!: string;
   @Input() wip?: boolean;
   @Input() color!: string;
-
-  @HostBinding('class') hostClass = 'card h-100';
 }