Removing "MarginHack" from LoadingIcon

Set up all the loading icons so their text and gif were aligned. Removed
the hack property to offset them on every screen.

closes #25

Author: ProgrammingByPermutation

src/src/app/common/components/loading-icon/loading-icon.component.html

@@ -21,6 +21,6 @@
       repeatCount="indefinite" />
   </path>
 </svg>
-<div class="text-area" [style.font-size]="fontSize" [style.margin-top]="marginHack">
+<div class="text-area" [style.font-size]="fontSize">
   <ng-content></ng-content>
 </div>

src/src/app/common/components/loading-icon/loading-icon.component.ts

@@ -8,7 +8,6 @@ import { Component, Input } from '@angular/core';
   styleUrl: './loading-icon.component.scss'
 })
 export class LoadingIconComponent {
-  @Input() marginHack = '0px';
   @Input() width = '100%';
   @Input() height = '100%';
   @Input() fontSize = '14px';

src/src/app/view/login-landing/login-landing.component.html

@@ -4,7 +4,7 @@
   </div>
   <div class="centered-box_content-container">
     @if (error === '') {
-      <app-loading-icon fontSize="24px" height="35px" width="35px" marginHack="-25px">Logging in</app-loading-icon>
+      <app-loading-icon fontSize="24px" height="35px" width="35px">Logging in</app-loading-icon>
     } @else {
       <div class="error-banner">{{ error }}</div>
     }

src/src/app/view/login/login.component.html

@@ -19,7 +19,7 @@
     <app-twitch-login [twitchScopeIndex]="0" />
   </div>
   <div class="centered-box_content-container" [hidden]="!checkingLogin">
-    <app-loading-icon fontSize="24px" height="35px" width="35px" marginHack="-25px">
+    <app-loading-icon fontSize="24px" height="35px" width="35px">
       Checking Login Info
     </app-loading-icon>
   </div>

src/src/app/view/vm-manager/vm-manager.component.html

@@ -31,7 +31,7 @@ <h1>
                       [fontIcon]="vm.isOnline ? 'power_off' : 'power_settings_new'"
                       [matTooltip]="vm.isOnline ? 'Turn Off' : 'Turn On'" />
           } @else {
-            <app-loading-icon fontSize="24px" height="35px" width="35px" marginHack="-25px" />
+            <app-loading-icon fontSize="24px" height="35px" width="35px" />
           }
         </h1>
         <p>{{ vm.notes }}</p>
@@ -46,6 +46,6 @@ <h1>
   </div>
 } @else if (!error) {
   <div class="layout-content" style="text-align: center">
-    <app-loading-icon fontSize="24px" height="35px" width="35px" marginHack="-25px">Getting VMs...</app-loading-icon>
+    <app-loading-icon fontSize="24px" height="35px" width="35px">Getting VMs...</app-loading-icon>
   </div>
 }