diff options
Diffstat (limited to 'src/app/components/comment/comment.component.html')
| -rw-r--r-- | src/app/components/comment/comment.component.html | 16 |
1 files changed, 14 insertions, 2 deletions
diff --git a/src/app/components/comment/comment.component.html b/src/app/components/comment/comment.component.html index 03ba649..65ebf56 100644 --- a/src/app/components/comment/comment.component.html +++ b/src/app/components/comment/comment.component.html @@ -13,7 +13,13 @@ @{{ user.userName }} </span> </summary> - <article class="message margin-top-bot-small"> + <form [formGroup]="editCommentFormGroup" *ngIf="editingComment" (ngSubmit)="editComment()"> + <textarea class="textarea-new-msg full-width faded-slim-border border-bottom-only padding-small" rows="1" formControlName="newCommentMessage" placeholder="What's on your mind?"></textarea> + <button type="submit" class="faded-slim-border full-width padding-small lighter-hover click-effect border-radius-smaller margin-bot-bigger"> + Update Comment + </button> + </form> + <article class="message margin-top-bot-small" *ngIf="!editingComment"> {{ comment.message }} </article> <section class="comment-details flex-row flex-justify-end font-size-dot7 faded-slim-border border-bottom-only"> @@ -25,10 +31,16 @@ </time> </section> <section class="flex-row justify-children-center flex-center-align-children"> - <button class="flexible padding-small lighter-hover click-effect border-radius-smaller"> + <button class="padding-small lighter-hover click-effect border-radius-smaller" *ngIf="loggedInAuthor" (click)="toggleEditing()"> + <img src="/assets/icons/tabler-icon-edit.svg"> + </button> + <button class="flexible padding-small lighter-hover click-effect border-radius-smaller"> <img src="/assets/icons/tabler-icon-link.svg"> Share </button> + <button class="padding-small lighter-hover click-effect border-radius-smaller" *ngIf="loggedInAuthor" (click)="deleteComment()"> + <img src="/assets/icons/tabler-icon-trash.svg"> + </button> </section> </main> </section> |