diff options
5 files changed, 25 insertions, 9 deletions
diff --git a/src/DevHive.Angular/src/app/components/post-page/post-page.component.css b/src/DevHive.Angular/src/app/components/post-page/post-page.component.css index 50adee5..b1814fb 100644 --- a/src/DevHive.Angular/src/app/components/post-page/post-page.component.css +++ b/src/DevHive.Angular/src/app/components/post-page/post-page.component.css @@ -6,13 +6,21 @@ width: 100%; } -#back-btns { +.many-buttons { width: 100%; display: flex; } -.submit-btn { +.many-buttons > * { flex: 1; + margin-right: .3em; +} + +.many-buttons:last-of-type { + margin-right: 0; +} + +.submit-btn { max-width: 98%; margin: 0 auto; margin-bottom: .5em; diff --git a/src/DevHive.Angular/src/app/components/post-page/post-page.component.html b/src/DevHive.Angular/src/app/components/post-page/post-page.component.html index 4f6f33d..40a2aba 100644 --- a/src/DevHive.Angular/src/app/components/post-page/post-page.component.html +++ b/src/DevHive.Angular/src/app/components/post-page/post-page.component.html @@ -1,6 +1,14 @@ <div id="content"> - <div id="back-btns"> + <div class="many-buttons"> <button class="submit-btn" type="submit" (click)="backToFeed()">ᐊ Back to feed</button> </div> <app-post [paramId]="postId.toString()"></app-post> + <div class="many-buttons" *ngIf="editable"> + <button class="submit-btn" (click)="editPost()">Edit post</button> + <button class="submit-btn delete-btn" (click)="deletePost()">Delete post</button> + </div> + <form *ngIf="editingPost" [formGroup]="editPostFormGroup" (ngSubmit)="editPost()"> + <input type="text" placeholder="New post message" class="input-field" formControlName="newPostMessage"> + <input type="submit" style="display: none" /> + </form> <div> diff --git a/src/DevHive.Angular/src/app/components/profile-settings/profile-settings.component.css b/src/DevHive.Angular/src/app/components/profile-settings/profile-settings.component.css index 83f66f1..716ffc9 100644 --- a/src/DevHive.Angular/src/app/components/profile-settings/profile-settings.component.css +++ b/src/DevHive.Angular/src/app/components/profile-settings/profile-settings.component.css @@ -78,11 +78,6 @@ hr { margin-top: 1em; } -#delete-account:hover { - color: indianred; - border-color: indianred !important; -} - #confirm-delete { box-sizing: border-box; width: 100%; diff --git a/src/DevHive.Angular/src/app/components/profile-settings/profile-settings.component.html b/src/DevHive.Angular/src/app/components/profile-settings/profile-settings.component.html index c38a6d7..ef5e8fe 100644 --- a/src/DevHive.Angular/src/app/components/profile-settings/profile-settings.component.html +++ b/src/DevHive.Angular/src/app/components/profile-settings/profile-settings.component.html @@ -101,6 +101,6 @@ <div id="confirm-delete" *ngIf="deleteAccountConfirm"> Are you sure you want to delete your account?<br>This is permanent! </div> - <button id="delete-account" class="submit-btn" (click)="deleteAccount()">Delete account</button> + <button class="submit-btn delete-btn" (click)="deleteAccount()">Delete account</button> </div> </div> diff --git a/src/DevHive.Angular/src/styles.css b/src/DevHive.Angular/src/styles.css index 2af47c6..6849190 100644 --- a/src/DevHive.Angular/src/styles.css +++ b/src/DevHive.Angular/src/styles.css @@ -215,3 +215,8 @@ input:focus, button:focus { transition: 0s; transform: scale(.9); } + +.delete-btn:hover { + color: indianred; + border-color: indianred !important; +} |