diff --git a/src/app/components/shared/comment/comment.component.html b/src/app/components/shared/comment/comment.component.html index cf6321c8368cbf05fd95479fac72e9f25f50a622..f0eb75884f21c2bf939c1563dbbbc144c3f0009d 100644 --- a/src/app/components/shared/comment/comment.component.html +++ b/src/app/components/shared/comment/comment.component.html @@ -5,20 +5,20 @@ <p (click)="openPresentDialog(comment.body)">{{comment.body}}</p> </mat-card-content> <span class="fill-remaining-space"></span> - <button mat-icon-button [disabled]="isCreator" (click)="setCorrect(comment)" [matTooltip]="comment.correct ? 'Unmark as correct' : 'Mark as correct'"> - <mat-icon [ngClass]="{'correct-icon' : comment.correct === true}">check_circle</mat-icon> + <button mat-icon-button *ngIf="comment.correct || !isStudent" [disabled]="isStudent" (click)="setCorrect(comment)" [matTooltip]="comment.correct ? 'Unmark as correct' : 'Mark as correct'"> + <mat-icon [ngClass]="{true : 'correct-icon', false: 'incorrect-icon'}[comment.correct]">check_circle</mat-icon> </button> - <button mat-icon-button [disabled]="isCreator" (click)="setFavorite(comment)" [matTooltip]="comment.favorite ? 'Mark as not favorite' : 'Mark as favorite'"> - <mat-icon [ngClass]="{'favorite-icon' : comment.favorite === true}">star</mat-icon> + <button mat-icon-button *ngIf="comment.favorite || !isStudent" [disabled]="isStudent" (click)="setFavorite(comment)" [matTooltip]="comment.favorite ? 'Mark as not favorite' : 'Mark as favorite'"> + <mat-icon [ngClass]="{true: 'favorite-icon', false: 'not-favorite-icon'}[comment.favorite]">star</mat-icon> </button> - <button mat-icon-button [disabled]="isCreator" (click)="setRead(comment)" [matTooltip]="comment.read ? 'Mark as unread' : 'Mark as read'"> - <mat-icon [ngClass]="{'read-icon' : comment.read === true}">visibility</mat-icon> + <button mat-icon-button [disabled]="isStudent" (click)="setRead(comment)" [matTooltip]="comment.read ? 'Mark as unread' : 'Mark as read'"> + <mat-icon [ngClass]="{true: 'read-icon', false: 'unread-icon'}[comment.read]">visibility</mat-icon> </button> - <button mat-icon-button [disabled]="!isCreator" (click)="voteUp(comment)"> + <button mat-icon-button [disabled]="!isStudent" (click)="voteUp(comment)"> <mat-icon>keyboard_arrow_up</mat-icon> </button> <h4>{{comment.score}}</h4> - <button mat-icon-button [disabled]="!isCreator" (click)="voteDown(comment)"> + <button mat-icon-button [disabled]="!isStudent" (click)="voteDown(comment)"> <mat-icon>keyboard_arrow_down</mat-icon> </button> </div> diff --git a/src/app/components/shared/comment/comment.component.scss b/src/app/components/shared/comment/comment.component.scss index ac4d7beca3ae20f39af8512885a3528aedb6834c..4d340dcc3bd0a370094f011e8d9b57d4c4668153 100644 --- a/src/app/components/shared/comment/comment.component.scss +++ b/src/app/components/shared/comment/comment.component.scss @@ -14,22 +14,30 @@ mat-toolbar { background-color: #bbdefb; } -mat-icon { - color: white; +.incorrect-icon { + color: #c8e6c9; } .correct-icon { - color: green; + color: #66bb6a; } .read-icon { - color: blue; + color: #1e88e5; +} + +.unread-icon { + color: #e3f2fd; } .favorite-icon { color: #fdd835; } +.not-favorite-icon { + color: #fffde7; +} + .proffesor-icon { background-size: cover; margin-right: 10px; diff --git a/src/app/components/shared/comment/comment.component.ts b/src/app/components/shared/comment/comment.component.ts index a689be35d03728a381c5a58c06e2e58cdefab56c..1f680aa07e44bb639ae827b99935143338500afa 100644 --- a/src/app/components/shared/comment/comment.component.ts +++ b/src/app/components/shared/comment/comment.component.ts @@ -18,7 +18,7 @@ import { MatDialog } from '@angular/material'; }) export class CommentComponent implements OnInit { @Input() comment: Comment; - isCreator = false; + isStudent = false; isLoading = true; constructor(protected authenticationService: AuthenticationService, @@ -34,7 +34,7 @@ export class CommentComponent implements OnInit { ngOnInit() { if (this.authenticationService.getRole() === 0) { - this.isCreator = true; + this.isStudent = true; } this.translateService.use(localStorage.getItem('currentLang')); }