dashboard ui fixes

frontend/angular/src/app/my-career-web/career-history/career-history/publish/publish.component.ts

@@ -42,7 +42,6 @@ export class PublishComponent extends BaseComponent implements OnInit {
                 this.careerProfile = response;
                 this.updatedObjs[this.careerProfile.ObjectID] = this.careerProfile;
                 this.careerProfileLoaded.emit(this.careerProfile);
-                console.log(this.careerProfile);
             }, err => {
                 this.isLoading = false;
                 this.utilsService.handleError(err);

frontend/angular/src/app/my-career-web/dashboard/account/account.component.html

+<div class="mc-page-header-text">
+    Subscription
+</div>
+
+<div class="account-wrapper">
+    <div class="mc-card position-relative">
+        <app-overlay [isActive]="isLoading"></app-overlay>
+
+        <div class="row">
+            <div class="col-md-6">
+                <h4>Subscription Details</h4>
+            </div>
+
+            <div class="col-md-6">
+                <h4>Card Details</h4>
+            </div>
+
+            <div class="col-md-12 mt-3">
+                <h4>Card Details</h4>
+            </div>
+        </div>
+    </div>
+</div>

frontend/angular/src/app/my-career-web/dashboard/account/account.component.scss

+@import "../../../../styles/my-career-styles/variables";
+
+.account-wrapper {
+    padding: 0 8%;
+
+    .mc-card {
+        margin-top: -30px;
+
+        h4 {
+            color: #58595B;
+            font-family: $bodyFont;
+            font-size: 20px;
+            letter-spacing: 0;
+            line-height: 27px;
+            margin-bottom: 24px;
+            font-weight: 500;
+            position: relative;
+
+            &:after {
+                content: '';
+                position: absolute;
+                left: 0;
+                bottom: -7px;
+                height: 1px;
+                width: 47px;
+                border: 1px solid #F37124;
+            }
+        }
+    }
+}

frontend/angular/src/app/my-career-web/dashboard/account/account.component.ts

+import { Component, OnDestroy, OnInit } from '@angular/core';
+import { HelperService } from '../../services/helper.service';
+import { BaseComponent } from '../../base/base.component';
+
+@Component({
+  selector: 'app-account',
+  templateUrl: './account.component.html',
+  styleUrls: ['./account.component.scss']
+})
+export class AccountComponent extends BaseComponent implements OnInit, OnDestroy {
+
+  constructor(
+      private helperService: HelperService
+  ) {
+      super();
+  }
+
+  ngOnInit(): void {
+      this.helperService.hideTaskBar = true;
+  }
+
+  ngOnDestroy(): void {
+      super.ngOnDestroy();
+      this.helperService.hideTaskBar = false;
+  }
+
+}

frontend/angular/src/app/my-career-web/dashboard/dashboard.module.ts

@@ -9,6 +9,7 @@ import { LeftSidebarComponent } from './left-sidebar/left-sidebar.component';
 import { ProfileTasksComponent } from './profile-tasks/profile-tasks.component';
 import { GoPremiumComponent } from './go-premium/go-premium.component';
 import { SummaryReportComponent } from './summary-report/summary-report.component';
+import { AccountComponent } from './account/account.component';
 
 @NgModule({
     imports: [
@@ -22,7 +23,8 @@ import { SummaryReportComponent } from './summary-report/summary-report.componen
         LeftSidebarComponent,
         ProfileTasksComponent,
         GoPremiumComponent,
-        SummaryReportComponent
+        SummaryReportComponent,
+        AccountComponent
     ]
 })
 

frontend/angular/src/app/my-career-web/dashboard/dashboard.routing.ts

@@ -5,6 +5,7 @@ import { HomeComponent } from './home/home.component';
 import { PersonalDetailsComponent } from '../mc-shared/personal-details/personal-details.component';
 import { GoPremiumComponent } from './go-premium/go-premium.component';
 import { SummaryReportComponent } from './summary-report/summary-report.component';
+import { AccountComponent } from './account/account.component';
 
 const routes: Routes = [
     {
@@ -28,6 +29,10 @@ const routes: Routes = [
                 component: SummaryReportComponent
             },
             {
+                path: 'account',
+                component: AccountComponent
+            },
+            {
                 path: '',
                 redirectTo: 'home',
                 pathMatch: 'full'

frontend/angular/src/app/my-career-web/dashboard/dashboard/dashboard.component.html

 <div class="row" style="min-height: 100vh;" *ngIf="!isMobileView">
-    <div class="col-md-12 dashboard-wrapper" style="padding: 0; min-height: 100vh;">
+    <div class="col-md-12 dashboard-wrapper" style="padding: 0; min-height: 100vh;" [ngClass]="{hiddenTasks: hideTaskBar}">
 
         <div class="dashboard-left-sidebar">
             <app-left-sidebar></app-left-sidebar>
@@ -9,7 +9,7 @@
             <router-outlet></router-outlet>
         </div>
 
-        <div class="dashboard-right-sidebar">
+        <div class="dashboard-right-sidebar" *ngIf="!hideTaskBar">
             <app-profile-tasks></app-profile-tasks>
         </div>
     </div>

frontend/angular/src/app/my-career-web/dashboard/dashboard/dashboard.component.scss

@@ -7,12 +7,21 @@
     background: #FAFCFD;
     position: relative;
 
+    &.hiddenTasks {
+        justify-content: flex-start;
+
+        .dashboard-content {
+            flex: 1;
+        }
+    }
+
     .dashboard {
 
         &-left-sidebar, &-right-sidebar {
             min-height: 100vh;
             box-shadow: 0 0 20px 0 rgba(128,130,133,0.13);
             min-width: 260px;
+            max-width: 260px;
             width: 18%;
             background: #fff;
         }

frontend/angular/src/app/my-career-web/dashboard/dashboard/dashboard.component.ts

@@ -6,6 +6,7 @@ import { takeUntil } from 'rxjs/operators';
 import { PersonalDetailsService } from '../../services/personal-details.service';
 import { CareerProfileModel } from '../../models/career-profile.model';
 import { environment } from '../../../../environments/environment';
+import { HelperService } from '../../services/helper.service';
 
 @Component({
     selector: 'app-dashboard',
@@ -17,16 +18,24 @@ export class DashboardComponent extends BaseComponent implements OnInit {
     showMobileNav;
     careerProfile = new CareerProfileModel();
     unassumeLink  = `${environment.baseUrl}unassume_mc.jsp`;
+    hideTaskBar = false;
 
     constructor(
         private authService: AuthService,
         private router: Router,
+        private helperService: HelperService,
         private personalDetailsService: PersonalDetailsService
     ) {
         super();
     }
 
     ngOnInit(): void {
+        this.helperService.hideTaskBar$()
+            .pipe(takeUntil(this.componentInView))
+            .subscribe(response => {
+                this.hideTaskBar = response;
+
+            });
         this.personalDetailsService.careerProfileUpdated$
             .pipe(takeUntil(this.componentInView))
             .subscribe(response => {

frontend/angular/src/app/my-career-web/dashboard/left-sidebar/left-sidebar.component.html

@@ -32,7 +32,7 @@
         </div>
 
 
-        <div class="sidebar-navigation-item">
+        <div class="sidebar-navigation-item" routerLink="/my-career-web/dashboard/account" routerLinkActive="active">
             <span class="sidebar-navigation-item-icon">
                 <i class="fa fa-gear"></i>
             </span>

frontend/angular/src/app/my-career-web/services/helper.service.ts

 import { Injectable } from '@angular/core';
 import { FormArray, FormControl, FormGroup } from '@angular/forms';
+import { Observable, Subject } from 'rxjs';
 
 @Injectable()
 export class HelperService {
 
+    private _hideTaskBar$ = new Subject<boolean>();
+
+    hideTaskBar$(): Observable<boolean> {
+        return this._hideTaskBar$.asObservable();
+    }
+
+    set hideTaskBar(value) {
+        this._hideTaskBar$.next(value);
+    }
+
     validateAllFormFields(form?: any): void {
         const formObj = typeof form.form ? form.form : form;
         Object