Fix highlighting && Move full screen icon to the right

app/assets/stylesheets/content/_table.sass

@@ -186,6 +186,9 @@ table.generic-table
         text-align: right
         white-space: nowrap
 
+      &.-no-highlighting
+        background-color: $body-background
+
     p
       padding: 0 8px
       margin: 0

app/assets/stylesheets/content/work_packages/_table_hierarchy.sass

@@ -78,11 +78,8 @@
   display: inline-block
   width: 20px
 
-  span
-
-
   span:before
-    padding: 10px 0 0 0
+    padding: 0
     // Align the botched verticality of the hierarchy icons.
     vertical-align: middle
     font-size: 20px

app/assets/stylesheets/layout/_work_packages_details_view.sass

@@ -56,6 +56,9 @@ body.action-create
   @media only screen and (min-width: 1440px)
     width: 580px
 
+  .tabrow
+    padding-left: 15px
+
 .work-packages--create--title
   margin-bottom: 1em
 

frontend/app/components/routing/wp-details/wp.list.details.html

@@ -8,13 +8,6 @@
       <ul class="tabrow">
         <!-- The hrefs with empty URLs are necessary for IE10 to focus these links
         properly. Thus, don't remove the hrefs or the empty URLs! -->
-        <li class="tab-icon">
-          <accessible-by-keyboard execute="$ctrl.switchToFullscreen()"
-                                  link-aria-label="{{ ::$ctrl.text.closeDetailsView }}"
-                                  link-class="work-packages--details-fullscreen-icon"
-                                  span-class="icon-context icon-to-fullscreen">
-          </accessible-by-keyboard>
-        </li>
         <li ui-sref="work-packages.list.details.overview({})"
             ui-sref-active="selected">
           <a href="" ng-bind="::$ctrl.text.tabs.overview"/>
@@ -32,6 +25,13 @@
             ui-sref-active="selected">
           <a href="" ng-bind="::$ctrl.text.tabs.watchers"/>
         </li>
+        <li class="tab-icon">
+          <accessible-by-keyboard execute="$ctrl.switchToFullscreen()"
+                                  link-aria-label="{{ ::$ctrl.text.closeDetailsView }}"
+                                  link-class="work-packages--details-fullscreen-icon"
+                                  span-class="icon-context icon-to-fullscreen">
+          </accessible-by-keyboard>
+        </li>
         <li class="tab-icon">
           <accessible-by-keyboard execute="$ctrl.close()"
                                   link-aria-label="{{ ::$ctrl.text.closeDetailsView }}"

frontend/app/components/wp-fast-table/builders/modes/grouped/grouped-rows-builder.ts

@@ -218,7 +218,7 @@ export class GroupedRowsBuilder extends RowsBuilder {
     row.dataset['groupIndex'] = (group.index as number).toString();
     row.dataset['groupIdentifier'] = group.identifier as string;
     row.innerHTML = `
-      <td colspan="${colspan}">
+      <td colspan="${colspan}" class="-no-highlighting">
         <div class="expander icon-context ${togglerIconClass}">
           <span class="hidden-for-sighted">${_.escape(text)}</span>
         </div>

frontend/app/components/wp-inline-create/wp-inline-create.directive.html

@@ -1,5 +1,5 @@
 <tr ng-if="!$ctrl.isHidden" class="wp-inline-create-button-row">
-  <td colspan="{{ $ctrl.colspan }}">
+  <td colspan="{{ $ctrl.colspan }}" class="-no-highlighting">
     <div
         class="wp-inline-create-button"
         ng-show="$ctrl.isAllowed">