Merge pull request #3 from mk84/22043-wp-full-create-ui

[22043] WP fullcreate UI improvments

app/assets/stylesheets/_work_packages_show_view_overwrite.scss

@@ -138,7 +138,6 @@ body.controller-work_packages.action-show {
   ul#toolbar-items {
     @include clearfix;
     float: right;
-    margin-top: 10px;
 
     button {
       margin-bottom: 0;

app/assets/stylesheets/content/_in_place_editing.sass

@@ -316,9 +316,10 @@ a.inplace-editing--trigger-link,
     font-size: 1rem
 
 // this aligns the title for the WP
-.work-packages--details--title,
-.work-packages--details--description
-  margin-left: -0.375rem
+.work-packages--split-view
+  .work-packages--details--title,
+  .work-packages--details--description
+    margin-left: -0.375rem
 
 .inplace-edit--highlight
   border-color: $inplace-edit--color-highlight !important

app/assets/stylesheets/content/_work_packages.sass

@@ -156,7 +156,8 @@ $work-package-details--tab-height: 40px
 
 
 .work-package--new-state
-  padding: 0 0 64px
+  padding: 0 20px 64px 0
+  overflow-y: auto
 
   .work-packages--edit-actions
-    bottom: 54px
+    margin-left: -20px

app/assets/stylesheets/layout/_work_package.sass

@@ -27,7 +27,8 @@
 //++
 
 .controller-work_packages.action-index,
-.controller-work_packages.action-show
+.controller-work_packages.action-show,
+.controller-work_packages.full-create
   @extend %absolute-layout-mode
 
 #content

frontend/app/components/routes/partials/work-packages.show.html

@@ -1,7 +1,7 @@
 <div class="work-packages--show-view" ng-class="{'edit-all-mode': editAll.state}">
   <div class="toolbar-container">
     <div toolbar id="toolbar">
-      <ul id="toolbar-items">
+      <ul id="toolbar-items" class="toolbar-items">
         <li class="toolbar-item">
           <wp-create-button project-identifier="projectIdentifier"
                             ng-hide="editAll.state"

frontend/app/components/work-packages/directives/wp-create-form/wp-create-form.directive.js

@@ -52,6 +52,14 @@ function wpCreateForm() {
 
     controller: 'WorkPackageNewController',
     controllerAs: 'vm',
-    bindToController: true
+    bindToController: true,
+
+    link: function (scope) {
+      var body = angular.element('body').addClass('full-create');
+
+      scope.$on('$stateChangeStart', function () {
+        body.removeClass('full-create');
+      })
+    }
   };
 }

frontend/app/templates/work_packages/work_package_details_toolbar.html

@@ -1,5 +1,5 @@
 <div class="work-packages--details-toolbar" ng-hide="editAll.state && !editAll.allowed">
-  <button class="button" accesskey="3" ng-click="editAll.start()" ng-disabled="!editAll.allowed">
+  <button class="button -highlight" accesskey="3" ng-click="editAll.start()" ng-disabled="!editAll.allowed">
     <i class="button--icon icon-edit"></i>
     <span class="button--text" ng-bind="::I18n.t('js.button_edit')"></span>
   </button>