ROENROLL-1667 typography update

src/app/app.component.ts

 import { Component, ViewChild, OnInit } from '@angular/core';
 import { MatSidenav, MatDialog } from '@angular/material';
-import { Observable } from 'rxjs';
 import { Profile } from '@app/core/models/profile';
 import {
   FormBuilder,
@@ -32,7 +31,6 @@ export class AppComponent implements OnInit {
     private api: DegreePlannerApiService,
   ) {
     this.subjectCode = new FormControl('', [Validators.required]);
-    this.selectedDegreePlan = 520224;
     this.coursesForm = this.fb.group({
       coursesInput: null,
     });

src/app/degree-planner/services/api.service.ts

@@ -3,6 +3,7 @@ import { Injectable } from '@angular/core';
 import { HttpClient, HttpHeaders } from '@angular/common/http';
 import { Location } from '@angular/common';
 import { Observable } from 'rxjs';
+import { of } from 'rxjs';
 import { map } from 'rxjs/operators';
 import { environment } from './../../../environments/environment';
 import { Note } from '@app/core/models/note';
@@ -53,7 +54,12 @@ export class DegreePlannerApiService {
   }
 
   public getUserProfile(): Observable<Profile> {
-    return this.http.get<Profile>('/profile', HTTP_OPTIONS);
+    // Prevents error locally
+    if (environment.production) {
+      return this.http.get<Profile>('/profile', HTTP_OPTIONS);
+    } else {
+      return of<Profile>();
+    }
   }
 
   public getAllDegreePlans(): Observable<DegreePlan[]> {

src/app/degree-planner/year-container/year-container.component.scss

 .year-container {
-  padding: 4px;
+  // padding: 4px;
 }

src/assets/sass/general.scss

@@ -107,7 +107,7 @@ body {
 .error-icon,
 .help-icon,
 .not-offered-icon {
-  font-size: 24px !important;
+  font-size: 18px !important;
   margin-left: 5px;
   &:hover {
     cursor: default;
@@ -156,7 +156,8 @@ body {
 .mat-form-field,
 #menu-toggle-btn {
   &:hover {
-    opacity: 0.8;
+    // Hinders the readability of tabs while hovering
+    // opacity: 0.8;
   }
   &:focus {
     outline: 2px solid #5e9ed6;