feat: make done options in select-task less prominent #3791

johannesjo · Jan 3, 2025 · 0eeb0fa · 0eeb0fa
1 parent 95bc21a
commit 0eeb0fa
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 1 deletion.
diff --git a/src/app/features/tasks/select-task/select-task.component.html b/src/app/features/tasks/select-task/select-task.component.html
@@ -20,7 +20,10 @@
     [displayWith]="displayWith"
   >
     @for (task of filteredTasks; track trackById($index, task)) {
-    <mat-option [value]="task">
+    <mat-option
+      [value]="task"
+      [class.isDone]="task.isDone"
+    >
       @if (task.issueType) {
       <mat-icon [svgIcon]="task.issueType|issueIcon"></mat-icon>
       }

diff --git a/src/styles/components/_overwrite-material.scss b/src/styles/components/_overwrite-material.scss
@@ -83,6 +83,15 @@ body .mat-mdc-dialog-surface {
   margin-bottom: $s * 2;
 }
 
+// needs to be global cause of cdk overlay
+// is used for select-task
+mat-option.isDone {
+  .mdc-list-item__primary-text {
+    text-decoration: line-through !important;
+    opacity: 0.4 !important;
+  }
+}
+
 // BUTTONS
 // -----------
 .mat-mdc-menu-item-text {