message: Fixes Issue
  Added contional logic to render the border when there are 0 projects on for a user.
diff: </div>
  </div>
  <h4 *ngIf="projects">Available Opportunities ({{projects.length}})</h4>
  - <div class="section-body-project" *ngIf="projects">
  - <div class="items-list-wrapper">
  + <div class="section-body-project" *ngIf="!projects">
  <ul>
  - <li class="card-wrapper" *ngFor="let pr of projects.slice(0,5)">
  + <li class="card-wrapper">
  <div class="card">
  <div class="card-content">
  <div class="row single-info">
  - <div class="col m4">
  - <div class="info-avatar square-container" *ngIf="pr.imageUrl"><img class="square" [src]="pr.imageUrl"></div>
  - <div class="info-avatar square-container" *ngIf="!pr.imageUrl"><img class="square" [src]="constantsService.defaultImage"></div>
  </div>
  - <div class="col m8">
  - <div class="available-opp-proj-name">
  - <h5 [routerLink]="['/project/view/', pr.id]">{{pr.name}}</h5>
  </div>
  - <div>
  - <div class="skills-tag-wrapper">
  - <ul *ngIf="pr.skills">
  - <li class="chip" *ngFor="let skill of pr.skills">{{ skill }}</li>
  - </ul>
  </div>
  + </li>
  + </ul>
  </div>
  + <div class="section-body-project" *ngIf="projects?.length == 0">
  + <ul>
  + <li class="card-wrapper">
  + <div class="card">
  + <div class="card-content">
  + <div class="row single-info">
  </div>
  </div>
  - <p>{{ pr.description | slice:0:100 }} ...</p>
  </div>
  + </li>
  + </ul>
  </div>
  + <div class="section-body-project" *ngIf="projects?.length > 0">
  + <div class="items-list-wrapper">
  + <ul>
  + <li class="card-wrapper" *ngFor="let pr of projects.slice(0,5)">
  + <my-project-card-small [project]="pr"></my-project-card-small>
  </li>
  </ul>
  </div>
  