PER-10108-display long folder names one beneath other

Author: crisnicandrei

src/app/core/components/main/main.component.scss

@@ -1,7 +1,6 @@
 @import 'variables';
 
 .main-content {
-  padding-top: $navbar-total-height;
   opacity: 1;
 
   &.navigating {

src/app/core/components/nav/nav.component.scss

@@ -2,7 +2,6 @@
 
 :host {
   display: block;
-  position: fixed;
   top: 0;
   left: 0;
   right: 0;

src/app/shared/components/breadcrumbs/breadcrumbs.component.scss

@@ -6,19 +6,16 @@
 
 .breadcrumbs {
   width: 100%;
-  overflow-y: hidden;
-  overflow-x: auto;
-  padding: 5px 10px;
-  white-space: nowrap;
-  -webkit-overflow-scrolling: touch;
-  user-select: none;
-  height: $breadcrumb-height;
+  flex-wrap: wrap; 
+  white-space: normal; 
+  overflow-x: visible; 
+  overflow-y: visible;
   display: flex;
   align-items: center;
 }
 
 pr-breadcrumb {
-  display: inline-block;
+  display: flex;
   color: white;
 
   @include after($tablet-horizontal) {
@@ -64,7 +61,6 @@ pr-breadcrumb {
 .breadcrumbs-large {
   @include desktop {
     font-size: $large-size;
-    height: 2 * $grid-unit;
   }
 }