breadcrumbs styling fixes

dmp-frontend/src/app/ui/description/overview/description-overview.component.scss

@@ -303,7 +303,7 @@
 }
 
 .author-focused {
-  background-color: #e0e0e0;
+  background-color: #ececec;
   border-radius: 3px;
 }
 

dmp-frontend/src/app/ui/misc/breadcrumb/navigation-breadcrumb.component.html

@@ -1,16 +1,20 @@
 <nav class="list-inline list-unstyled">
-    <li *ngFor="let item of breadCrumbs; let first = first; let index = index;let last = last" class="list-inline-item mr-2">
+    <li *ngFor="let item of breadCrumbs; let first = first; let index = index;let last = last" class="list-inline-item m-0">
         <div style="display: flex; justify-content: center; align-items:center" *ngIf="!item?.hideItem">
             <mat-icon [class.hidden]="first">chevron_right</mat-icon>
 
             <a *ngIf="(!item?.skipNavigation && !last) else regularText" [routerLink]="computePath(index)" class=" text-black" disabled>
                 <ng-container *ngIf="item.title !== HOME_SYMBOL else homeIcon">
+                    <span class="breadcrumb-item p-2">
                         {{ item.title | translate:item.translateParams | appTitleCaseTransform }}
+                    </span>
                 </ng-container>
             </a>
             <ng-template #regularText>
                 <ng-container *ngIf="item.title !== HOME_SYMBOL else homeIcon">
+                    <span class="p-2">
                         {{ item.title | translate:item.translateParams | appTitleCaseTransform }}
+                    </span>
                 </ng-container>
             </ng-template>
 
@@ -19,8 +23,6 @@
     </li>
 </nav>
 
-
-
 <ng-template #homeIcon>
-    <mat-icon style="width: 1.5rem; height: 1.5rem; font-size: 1.2rem; color: #949597" class="text-muted">home</mat-icon>
+    <mat-icon style="width: auto; height: auto; font-size: 1.2rem; color: #949597" class="text-muted breadcrumb-item p-2">home</mat-icon>
 </ng-template>

dmp-frontend/src/app/ui/misc/breadcrumb/navigation-breadcrumb.component.scss

@@ -11,3 +11,9 @@
     font-size: 1rem;
     height: 1rem;
 }
+
+
+.breadcrumb-item:hover {
+	background-color: #ececec;
+	border-radius: 16px;
+}