**As** a project member
**I want to** see the most relevant information always at the same place in the work packages different views Begin of the insertion
End of the insertion Begin of the deletion

End of the deletion **so that** I can modify it easier and don't need to search for it in the details of the work package.

Begin of the insertion##End of the insertion Begin of the deletion ####End of the deletion **Acceptance criteria**

Begin of the insertion#### **New sub-header with relevant information:**

End of the insertion * Remove the following fields from the work package form configuration (details):
* Date
* Assignee
* Log time
* Add the previous mentioned information in a sub-header closer to the content header as in the Begin of the insertionvisuals (also check the specific visuals to see the expected behaviour on how to set each value).End of the insertion Begin of the deletion visuals.End of the deletion
* There is multiple options to display the dates depending on the Begin of the insertionsituation (specific visuals bellow):End of the insertion Begin of the deletion situation:End of the deletion
* _No date or duration:_ "Set date"
* _No date but has duration_: "Set date (19 days)"
* _Start date only:_ "05/10/2022 – Set finish date"
* _Finish date only:_ "Set start date – 24/10/2022"
* Begin of the insertionIn the case of log time the current behaviour is still expected with a minor change:
* When there is no time logged: the text is "Log time" and both icon and text are clickable to log time.
* When there is time logged: the current behaviour applies.End of the insertion The Begin of the insertionclock icon opens the modal to log time while the text opens the report page.
* TheEnd of the insertion ID and last change will be also moved to the the sub-header and will take the format: "ID - Last update X days ago". This means the "Created by" disappears and the time stamp is standardised with "days ago". TBD which is the scale used for days vs months vs years (eg. 90+ days is transformed in months and 12+ months is transformed in years)
* Begin of the insertionChangesEnd of the insertion Begin of the deletion **\[open\]** how to display changesEnd of the deletion carried out on the same day. Should there also be an hours and minutes Begin of the insertionunit as we do for linking/attaching files.End of the insertion Begin of the deletion unit.End of the deletion
* The placement of the elements is variable depending on the following cases:
* Work package full view
* Work package split screen view Begin of the insertion
End of the insertion Begin of the deletion
End of the deletion * Work package Begin of the insertionmobileThe arrangement of elements adapts to the different cases and devices as specified in the visuals.

#### **Other changes:**

End of the insertion Begin of the deletion mobile
End of the deletion * On the full view the Begin of the insertiontoolbar/header also changes as theEnd of the insertion "+ Create" button disappears and two new buttons will appear that will relate to the tabs and will behave as specified in this [Figma prototype](https://www.figma.com/proto/9Xx1gBIDG2MHsUmE4MjFV0/Sub-header-proposal?page-id=79%3A3707&node-id=82%3A3708&viewport=424%2C311%2C0.15&scaling=contain&starting-point-node-id=82%3A3708):
* Create child work package (icon needs to be redesigned and reviewed)
* Attach a file
* Watch work package (already existing but behaviour will change)
* There is a new breadcrumb that indicates the project that the work package is set in and after it the option to set a parent for it (or the parent if already has one). 
In case of accessing a work package from outside any project the blue box with "This work package belongs to project X. Open this work package in that project." will not appear anymore as you can see the project in the breadcrumb. Begin of the deletion
* The arrangement of elements adapts to the different cases and devices as specified in the visuals.End of the deletion

Begin of the insertion## **Generic visuals**End of the insertion Begin of the deletion #### **Visuals**End of the deletion

Begin of the insertion####End of the insertion Begin of the deletion * End of the deletion Full view:

Begin of the insertion<img class="op-uc-image op-uc-image_inline" style="width:700px;" src="/api/v3/attachments/36885/content"> <img class="op-uc-image op-uc-image_inline" style="width:700px;" src="/api/v3/attachments/36886/content">End of the insertion Begin of the deletion <figure class="image op-uc-figure"><div class="op-uc-figure--content"><img class="op-uc-image" src="/api/v3/attachments/34399/content"></div></figure>End of the deletion

Begin of the insertion#### Split view:End of the insertion Begin of the deletion <figure class="image op-uc-figure"><div class="op-uc-figure--content"><img class="op-uc-image" src="/api/v3/attachments/34400/content"></div></figure>End of the deletion

Begin of the insertion<img class="op-uc-image op-uc-image_inline" style="width:700px;" src="/api/v3/attachments/36887/content"><img class="op-uc-image op-uc-image_inline" style="width:700px;" src="/api/v3/attachments/36888/content">End of the insertion Begin of the deletion <figure class="image op-uc-figure"><div class="op-uc-figure--content"><img class="op-uc-image" src="/api/v3/attachments/34402/content"></div></figure>End of the deletion

Begin of the insertion#### Mobile:End of the insertion Begin of the deletion <figure class="image op-uc-figure"><div class="op-uc-figure--content"><img class="op-uc-image" src="/api/v3/attachments/34404/content"></div></figure>End of the deletion

Begin of the insertion## <img class="op-uc-image op-uc-image_inline" src="/api/v3/attachments/36889/content">End of the insertion Begin of the deletion <figure class="image op-uc-figure"><div class="op-uc-figure--content"><img class="op-uc-image" src="/api/v3/attachments/34403/content"></div></figure>End of the deletion

Begin of the insertion##

##

## **Visuals for time specific cases**End of the insertion Begin of the deletion <figure class="image op-uc-figure"><div class="op-uc-figure--content"><img class="op-uc-image" src="/api/v3/attachments/34401/content"></div></figure>End of the deletion

Begin of the insertion#### FullEnd of the insertion Begin of the deletion * Split screenEnd of the deletion view:

Begin of the insertion## <img class="op-uc-image op-uc-image_inline" style="width:700px;" src="/api/v3/attachments/36890/content"><img class="op-uc-image op-uc-image_inline" style="width:700px;" src="/api/v3/attachments/36891/content"><img class="op-uc-image op-uc-image_inline" style="width:700px;" src="/api/v3/attachments/36894/content"><img class="op-uc-image op-uc-image_inline" style="width:700px;" src="/api/v3/attachments/36892/content"><img class="op-uc-image op-uc-image_inline" style="width:700px;" src="/api/v3/attachments/36893/content">End of the insertion Begin of the deletion <figure class="image op-uc-figure"><div class="op-uc-figure--content"><img class="op-uc-image" src="/api/v3/attachments/34405/content"></div></figure>End of the deletion

Begin of the insertion#### Split view:End of the insertion Begin of the deletion <figure class="image op-uc-figure"><div class="op-uc-figure--content"><img class="op-uc-image" src="/api/v3/attachments/34410/content"></div></figure>End of the deletion

Begin of the insertion## <img class="op-uc-image op-uc-image_inline" style="width:700px;" src="/api/v3/attachments/36895/content"><img class="op-uc-image op-uc-image_inline" style="width:700px;" src="/api/v3/attachments/36898/content"><img class="op-uc-image op-uc-image_inline" style="width:700px;" src="/api/v3/attachments/36896/content"><img class="op-uc-image op-uc-image_inline" style="width:700px;" src="/api/v3/attachments/36897/content"><img class="op-uc-image op-uc-image_inline" style="width:700px;" src="/api/v3/attachments/36899/content">End of the insertion Begin of the deletion <figure class="image op-uc-figure"><div class="op-uc-figure--content"><img class="op-uc-image" src="/api/v3/attachments/34408/content"></div></figure>End of the deletion

Begin of the insertion##

##

## **Visuals for time specific cases**End of the insertion Begin of the deletion <figure class="image op-uc-figure"><div class="op-uc-figure--content"><img class="op-uc-image" src="/api/v3/attachments/34409/content"></div></figure>End of the deletion

Begin of the insertion#### Set dates:End of the insertion Begin of the deletion <figure class="image op-uc-figure"><div class="op-uc-figure--content"><img class="op-uc-image" src="/api/v3/attachments/34407/content"></div></figure>End of the deletion

Begin of the insertion<img class="op-uc-image op-uc-image_inline" style="width:700px;" src="/api/v3/attachments/36900/content"><img class="op-uc-image op-uc-image_inline" style="width:700px;" src="/api/v3/attachments/36901/content"><img class="op-uc-image op-uc-image_inline" style="width:700px;" src="/api/v3/attachments/36902/content"><img class="op-uc-image op-uc-image_inline" style="width:700px;" src="/api/v3/attachments/36903/content">End of the insertion Begin of the deletion <figure class="image op-uc-figure"><div class="op-uc-figure--content"><img class="op-uc-image" src="/api/v3/attachments/34406/content"></div></figure>End of the deletion

Begin of the insertion#### Set assignee:End of the insertion Begin of the deletion * Mobile version:End of the deletion

Begin of the insertion<img class="op-uc-image op-uc-image_inline" style="width:700px;" src="/api/v3/attachments/36904/content"><img class="op-uc-image op-uc-image_inline" style="width:700px;" src="/api/v3/attachments/36907/content"><img class="op-uc-image op-uc-image_inline" style="width:700px;" src="/api/v3/attachments/36906/content"><img class="op-uc-image op-uc-image_inline" style="width:700px;" src="/api/v3/attachments/36905/content">End of the insertion Begin of the deletion <figure class="image op-uc-figure" style="width:50%;"><div class="op-uc-figure--content"><img class="op-uc-image" src="/api/v3/attachments/34411/content"></div></figure>End of the deletion

#### Begin of the insertionLog time:

<img class="op-uc-image op-uc-image_inline" style="width:700px;" src="/api/v3/attachments/36908/content"><img class="op-uc-image op-uc-image_inline" style="width:700px;" src="/api/v3/attachments/36911/content"><img class="op-uc-image op-uc-image_inline" style="width:700px;" src="/api/v3/attachments/36910/content"><img class="op-uc-image op-uc-image_inline" style="width:700px;" src="/api/v3/attachments/36909/content">

##

##End of the insertion Figma

[https://www.figma.com/file/9Xx1gBIDG2MHsUmE4MjFV0/?node-id=0%3A1](https://www.figma.com/file/9Xx1gBIDG2MHsUmE4MjFV0/?node-id=0%3A1) Begin of the deletion

#### Out of scopeEnd of the deletion