feat(list-editor): delete list root node (DSP-1356) (#386)

* feat: adds support for deleting a root node if not in use * feat: switches the buttons from using text to using mat-icons. Also adds some super fancy CSS. * test: starting point for unit tests * test: adds unit tests for list component
dasch-swiss · Feb 17, 2021 · 5d5eabf · 5d5eabf
1 parent 97230d1
commit 5d5eabf
Show file tree

Hide file tree

Showing 4 changed files with 345 additions and 57 deletions.
diff --git a/src/app/project/list/list.component.html b/src/app/project/list/list.component.html
@@ -66,9 +66,15 @@ <h2 class="mat-title">
                 <p class="mat-body" [matTooltip]="list.comments | dspStringifyStringLiteral" matTooltipPosition="above">
                     {{list.comments | dspStringifyStringLiteral | dspTruncate:64}}</p>
                 <span class="fill-remaining-space"></span>
-                <button mat-stroked-button
-                    (click)="$event.stopPropagation(); openDialog('editListInfo', list.labels[0].value, list.id)">
-                    Edit info
+                <button mat-button
+                    (click)="$event.stopPropagation(); openDialog('editListInfo', list.labels[0].value, list.id)"
+                    matTooltip="Edit info">
+                    <mat-icon>edit</mat-icon>
+                </button>
+                <button mat-button class="delete"
+                    (click)="$event.stopPropagation(); openDialog('deleteList', list.labels[0].value, list.id)"
+                    matTooltip="Delete list">
+                    <mat-icon>delete</mat-icon>
                 </button>
             </mat-toolbar-row>
         </mat-toolbar>

diff --git a/src/app/project/list/list.component.scss b/src/app/project/list/list.component.scss
@@ -16,3 +16,17 @@
     min-width: 140px;
   }
 }
+
+.list-editor {
+  mat-toolbar-row {
+    button {
+      margin: 0% 0.5%;
+      padding: 1%;
+      min-width: 6%;
+      border-radius: 40px;
+    }
+    button:hover {
+      background-color: #ebebeb;
+    }
+  }
+}