Add name to wp breadcrumb

app/assets/stylesheets/layout/_breadcrumb.sass

@@ -99,6 +99,9 @@ ul.breadcrumb
     height: initial
     li
       line-height: 20px
+      max-width: 250px
+      overflow: hidden
+      text-overflow: ellipsis
       &:first-child
         &:before
           display: none

frontend/app/components/work-packages/wp-breadcrumb/wp-breadcrumb.directive.html

@@ -1,4 +1,5 @@
-<div class="wp-breadcrumb -show">
+<div class="wp-breadcrumb -show"
+     ng-if="workPackage.ancestors.length > 0">
   <ul class="breadcrumb">
     <li ng-repeat="ancestor in workPackage.ancestors" class="icon-context icon-small icon-arrow-right5">
       <a ng-attr-title="{{ancestor.name}}"
@@ -6,6 +7,6 @@
          ui-sref="work-packages.show.activity({workPackageId: ancestor.id})"
          ng-bind="ancestor.name"></a>
     </li>
-    <li class="icon-context icon-small icon-arrow-right5">#{{workPackage.id}}</li>
+    <li class="icon-context icon-small icon-arrow-right5">#{{workPackage.name}}</li>
   </ul>
 </div>

frontend/app/components/work-packages/wp-single-view/wp-single-view.directive.html

@@ -7,6 +7,7 @@
 
 
   <div class="work-packages--info-row" ng-if="!$ctrl.workPackage.isNew">
+    <span ng-bind="$ctrl.idLabel"/>:
     <span ng-bind="$ctrl.text.infoRow.createdBy"/>
     <user-link class="user-link" user="$ctrl.workPackage.author"></user-link>.
     <span ng-bind="$ctrl.text.infoRow.lastUpdatedOn"/>