Content
View differences
Updated by Henriette Darge 10 months ago
# Motivation
For our goal to move closer to Primer and use those components within OpenProject, we want to primerize the app header
# Acceptance
* The app header uses Primer components for
* All menus (quick add, help) help, User menu)
* The onboarding video dialog
* All buttons (notifications, help (if it is a link only instead of a menu)
* Change the icon of the notification button as shown in Figma from a bell to `inbox`
* _Open: Primer::IconButton do not support any kind of trailing counter. How shall we display the number of unread notifications? Probably has to be something custom...._
* The user menu will become a lateral menu the overlaps the whole content (similar to how we do it for modules here: <mention class="mention" data-id="65090" data-type="work_package" data-text="#65090">#65090</mention>
* The search will stay an angular component but look more primerized (with rounded borders, like the autocompleteres look for example in meetings)
* The new header works with existing plugins (openDesk, Nextcloud Project, DB, ...)
* The code of the `top_menu_helper` is cleaned up
## Visuals
workPackageValue:56583:Mockups
## **Out of scope**
* Do not rework the functionality of the search
* Do not change the implementation of the modules menu; will be done in <mention class="mention" data-id="65090" data-type="work_package" data-text="##65090">##65090</mention>
For our goal to move closer to Primer and use those components within OpenProject, we want to primerize the app header
# Acceptance
* The app header uses Primer components for
* All menus (quick add, help)
* The onboarding video dialog
* All buttons (notifications, help (if it is a link only instead of a menu)
* Change the icon of the notification button as shown in Figma from a bell to `inbox`
* _Open: Primer::IconButton do not support any kind of trailing counter. How shall we display the number of unread notifications? Probably has to be something custom...._
* The user menu will become a lateral menu the overlaps the whole content (similar to how we do it for modules here: <mention class="mention" data-id="65090" data-type="work_package" data-text="#65090">#65090</mention>
* The search will stay an angular component but look more primerized (with rounded borders, like the autocompleteres look for example in meetings)
* The new header works with existing plugins (openDesk, Nextcloud Project, DB, ...)
* The code of the `top_menu_helper` is cleaned up
## Visuals
workPackageValue:56583:Mockups
## **Out of scope**
* Do not rework the functionality of the search
* Do not change the implementation of the modules menu; will be done in <mention class="mention" data-id="65090" data-type="work_package" data-text="##65090">##65090</mention>