feat(task-item): make card clickable

2026-09-15 21:10:41 +03:00
parent ba6b7e4850
commit aa7959e7ac
1 changed files with 23 additions and 4 deletions
@@ -6,11 +6,30 @@ import { RouterLink } from '@angular/router';
  selector: 'ksk-crm-task-item',
  imports: [RouterLink],
  template: `
-    <p>{{ task().name }}</p>
-    <p>{{ task().city }}, {{ task().streetAddress }}</p>
-    <p><a [routerLink]="['/details', task().id]">Подробнее...</a></p>
+    <a [routerLink]="['/details', task().id]">
+      <p>{{ task().name }}</p>
+      <p>{{ task().city }}, {{ task().streetAddress }}</p>
+    </a>
+  `,
+  styles: `
+    :host {
+      display: block;
+      padding: 1rem;
+      cursor: pointer;
+      transition: all 0.2s;
+
+      &:hover {
+        background: color-mix(in oklch, var(--color-primary) 25%, transparent);
+      }
+      &:active {
+        background: color-mix(in oklch, var(--color-primary) 25%, transparent);
+      }
+    }
+
+    a {
+      color: var(--color-gray);
+    }
  `,
-  styles: ``,
 })
 export class TaskItem {
  task = input.required<Task>();