Merge branch 'comments-list-view' into 'master'

Comments list view

See merge request swtp-2019/arsnova-lite!9

src/app/components/shared/comment-list/comment-list.component.html

-<mat-card *ngFor="let comment of comments">
-  <mat-card-header>
+<mat-toolbar >List of Questions</mat-toolbar>
+<mat-card class="outer-card">
+  <mat-card class="card-container" *ngFor="let comment of comments">
     <mat-card-title>{{comment.subject}}</mat-card-title>
-    <mat-card-subtitle>
-      <span class="mat-caption">Submitted on {{ comment.creationTimestamp | date:'dd-MM-yyyy HH:mm:ss' }}</span>
-    </mat-card-subtitle>
-  </mat-card-header>
-  <mat-divider></mat-divider>
-  <mat-card-content>
-    <p>{{comment.body}}</p>
-  </mat-card-content>
-  <mat-divider></mat-divider>
-  <mat-card-actions *ngIf="userRole === userRoleTemp">
-    <button mat-icon-button *ngIf="comment.read" color="primary" matTooltip="Mark as read"
-            (click)="setRead(comment)">
-      <mat-icon>speaker_notes</mat-icon>
-    </button>
-    <button mat-icon-button *ngIf="!comment.read" color="warn" matTooltip="Mark as unread"
-            (click)="setRead(comment)">
-      <mat-icon>speaker_notes_off</mat-icon>
-    </button>
-    <button mat-icon-button color="warn" matTooltip="Delete comment"
-            (click)="delete(comment)">
-      <mat-icon>delete</mat-icon>
-    </button>
-  </mat-card-actions>
-  <mat-card-actions *ngIf="userRole !== userRoleTemp">
-    <button mat-icon-button *ngIf="comment.read" color="primary" matTooltip="Mark as read"
-            (click)="setRead(comment)" disabled>
-      <mat-icon>speaker_notes</mat-icon>
-    </button>
-    <button mat-icon-button *ngIf="!comment.read" color="warn" matTooltip="Mark as unread"
-            (click)="setRead(comment)" disabled>
-      <mat-icon>speaker_notes_off</mat-icon>
-    </button>
-  </mat-card-actions>
+    <mat-divider></mat-divider>
+    <mat-card-content>
+      <p>{{comment.body}}</p>
+    </mat-card-content>
+  </mat-card>
 </mat-card>

src/app/components/shared/comment-list/comment-list.component.scss

 mat-card {
   margin-bottom: 20px;
+  background-color: #b2ebf2;
 }
 
 mat-card-content>:first-child {
   margin-top: 20px;
 }
+
+mat-toolbar {
+  border-radius: 10px;
+  margin-bottom: 20px;
+  background-color: #bbdefb;
+}
+
+.card-container {
+  background-color: #4dd0e1;
+  opacity: 0.7;
+  border-radius: 2px;
+}
+
+.outer-card {
+  border-radius: 8px;
+}