Implements Initial Stack Slider

src/app/home/stack-slider/stack-card/stack-card.component.ts

@@ -0,0 +1,35 @@
+import {Component, Input} from '@angular/core';
+import {Stack} from "../../../shared/model/stack/stack.model";
+import {animate, state, style, transition, trigger} from "@angular/animations";
+
+@Component({
+    selector: 'app-stack-card',
+    templateUrl: './stack-card.component.html',
+    styleUrls: ['./stack-card.component.css'],
+    animations: [
+        trigger('cardAnimation', [
+            state('active', style({
+                opacity: 1,
+                width: '300px',
+            })),
+            state('inactive', style({
+                opacity: 0.85,
+                width: '275px',
+            })),
+            transition('* => *', [
+                animate('0.1s')
+            ]),
+        ])
+    ],
+})
+export class StackCardComponent {
+    @Input()
+        stack!: Stack;
+
+    @Input()
+        inFocus: boolean = false;
+
+    get cardState(): 'active'|'inactive' {
+        return this.inFocus ? 'active' : 'inactive';
+    }
+}