Fixed height of pages that were the whole window height but were also below the navbar

8 files changed, 12 insertions, 6 deletions

diff --git a/src/app/components/comment-page/comment-page.component.html b/src/app/components/comment-page/comment-page.component.html
index 1b94568..553b545 100644
--- a/src/app/components/comment-page/comment-page.component.html
+++ b/src/app/components/comment-page/comment-page.component.html
@@ -2,7 +2,7 @@
 
 <app-loading *ngIf="!loaded"></app-loading>
 
-<main id="content" *ngIf="loaded">
+<main id="content" class="scroll-standalone under-navbar" *ngIf="loaded">
 	<nav>
 		<button class="submit-btn" type="submit" (click)="toPost()">ᐊ Back to post</button>
 	</nav>
diff --git a/src/app/components/feed/feed.component.html b/src/app/components/feed/feed.component.html
index c5c4401..a8290a1 100644
--- a/src/app/components/feed/feed.component.html
+++ b/src/app/components/feed/feed.component.html
@@ -2,7 +2,7 @@
 
 <app-loading *ngIf="!dataArrived"></app-loading>
 
-<main class="centered-content scroll-standalone flex-col flex-justify-start" *ngIf="dataArrived">
+<main class="centered-content scroll-standalone under-navbar flex-col flex-justify-start" *ngIf="dataArrived">
 	<form id="create-post" class="card flex-col" [formGroup]="createPostFormGroup" (ngSubmit)="createPost()">
 		<textarea id="new-post-message" class="faded-slim-border border-bottom-only padding-small" rows="1" formControlName="newPostMessage" placeholder="What's on your mind?"></textarea>
 		<section id="attachments-btns" class="flex-row flex-justify-start flex-center-align-children">
diff --git a/src/app/components/navbar/navbar.component.css b/src/app/components/navbar/navbar.component.css
index aa666b0..d02e928 100644
--- a/src/app/components/navbar/navbar.component.css
+++ b/src/app/components/navbar/navbar.component.css
@@ -1,4 +1,5 @@
 #navbar {
+  height: var(--navbar-height);
   width: 100%;
   background-color: var(--card-bg);
 }
diff --git a/src/app/components/post-page/post-page.component.html b/src/app/components/post-page/post-page.component.html
index fe12177..ad748e3 100644
--- a/src/app/components/post-page/post-page.component.html
+++ b/src/app/components/post-page/post-page.component.html
@@ -2,7 +2,7 @@
 
 <app-loading *ngIf="!dataArrived"></app-loading>
 
-<main id="content" *ngIf="dataArrived">
+<main id="content" class="scroll-standalone under-navbar" *ngIf="dataArrived">
 	<nav>
 		<div class="many-buttons"  *ngIf="loggedIn">
 			<button class="submit-btn" type="submit" (click)="backToFeed()">ᐊ Back to feed</button>
diff --git a/src/app/components/profile-settings/profile-settings.component.html b/src/app/components/profile-settings/profile-settings.component.html
index dbfc747..9e0e80e 100644
--- a/src/app/components/profile-settings/profile-settings.component.html
+++ b/src/app/components/profile-settings/profile-settings.component.html
@@ -2,7 +2,7 @@
 
 <app-loading *ngIf="!dataArrived"></app-loading>
 
-<div id="content" *ngIf="dataArrived">
+<div id="content" class="scroll-standalone under-navbar" *ngIf="dataArrived">
 	<nav id="navigation">
 		<button class="submit-btn" (click)="goToProfile()">ᐊ Back</button>
 		<button class="submit-btn" (click)="navigateToAdminPanel()" *ngIf="isAdminUser">Panel</button>
diff --git a/src/app/components/profile/profile.component.html b/src/app/components/profile/profile.component.html
index 45e51a5..38f15e4 100644
--- a/src/app/components/profile/profile.component.html
+++ b/src/app/components/profile/profile.component.html
@@ -2,7 +2,7 @@
 
 <app-loading *ngIf="!dataArrived"></app-loading>
 
-<main class="scroll-standalone flex-col centered-content" *ngIf="dataArrived" (scroll)="onScroll($event)">
+<main class="scroll-standalone under-navbar flex-col centered-content" *ngIf="dataArrived" (scroll)="onScroll($event)">
 	<section id="user-info" class="card flex-row full-width flex-justify-center">
 		<div>
 			<img id="profile-picture" class="round-image" [src]="user.profilePictureURL">
diff --git a/src/app/services/comment.service.ts b/src/app/services/comment.service.ts
index 29707ab..f299e82 100644
--- a/src/app/services/comment.service.ts
+++ b/src/app/services/comment.service.ts
@@ -55,7 +55,7 @@ export class CommentService {
 
   getCommentRequest(id: Guid): Observable<object> {
     const options = {
-      params: new HttpParams().set('Id', id.toString())
+      params: new HttpParams().set('CommentId', id.toString())
     };
     return this._http.get(AppConstants.API_COMMENT_URL, options);
   }
diff --git a/src/styles.css b/src/styles.css
index 64aa79f..0f60fd0 100644
--- a/src/styles.css
+++ b/src/styles.css
@@ -11,6 +11,7 @@
   --success: forestgreen;
   --failure: indianred;
   --faded-color: #696969;
+  --navbar-height: 2.6em;
 }
 
 html,
@@ -287,6 +288,10 @@ input[type=file]::file-selector-button {
   box-sizing: border-box;
 }
 
+.under-navbar {
+  height: calc(100% - var(--navbar-height)) !important;
+}
+
 /* Inputs, the type found in login and register */
 
 .input-field {