Break apart subjects in the relation block

app/assets/stylesheets/content/work_packages/tabs/_relations.sass

@@ -93,5 +93,9 @@
 .wp-relations-status-field
   margin-left: 2px
 
+// Break apart long subjects in the rather small block
+.wp-relations--subject-field
+  word-break: break-all
+
 
 

frontend/app/components/wp-relations/wp-relation-row/wp-relation-row.template.html

@@ -10,6 +10,7 @@
         <div class="grid-content medium-5 collapse" wp-single-relation
              ng-if="$ctrl.relatedWorkPackage">
             <a href="{{ singleRelationCtrl.workPackagePath($ctrl.relatedWorkPackage.id) }}"
+               class="wp-relations--subject-field"
                aria-label="{{ $ctrl.relation.type + ' ' + singleRelationCtrl.getFullIdentifier($ctrl.relatedWorkPackage, true) }}">
                 {{ singleRelationCtrl.getFullIdentifier($ctrl.relatedWorkPackage, true) }}
             </a>

frontend/app/components/wp-relations/wp-relations-hierarchy-row/wp-relations-hierarchy-row.template.html

@@ -7,6 +7,7 @@
             <span ng-style="{'padding-left': $ctrl.indentBy + 'px'}"
                   class="wp-relations-hierarchy-subject">
                 <a href="{{ singleRelationCtrl.workPackagePath($ctrl.relatedWorkPackage.id) }}"
+                   class="wp-relations--subject-field"
                    ng-if="!$ctrl.isCurrentElement()"
                    aria-label="{{ ($ctrl.isParent() ? $ctrl.text.parent : $ctrl.text.children) + ' ' + singleRelationCtrl.getFullIdentifier($ctrl.relatedWorkPackage) }}"
                    ng-attr-id="{{ $ctrl.isParent() ? 'hierarchy--parent' : ''}}">