View ancestor line in epic sidebar

Current

  • An issue can have a parent epic.
  • An epic can have a parent epic.

Design

  • So given an epic, view your ancestor line in the sidebar.
  • For the first iteration, only the epic sidebar should have this tree. The issue sidebar should continue to show just the immediate parent, as it is (ux-research#134 (closed) and https://gitlab.com/gitlab-org/growth/issues/63 will aim to decrease the number of components in the issue sidebar)
header header
Screen_Shot_2019-02-25_at_2.38.47_PM Screen_Shot_2019-02-25_at_2.37.49_PM
  • Position in sidebar- this section will replace Parent epic, so the order in the sidebar should be (top to bottom): Todo, Start date, Due date, Labels, Ancestors, Participants, Notifications
  • Icons are Open and Closed
  • Icons should be filled #1f78d1($blue-500) if the issue/epic is closed, and #1aaa55 ($green-500) if the issue/epic is open
  • Each ancestor has 16px margin between them
  • Connecting lines are #a7a7a7 ($gray-500)
  • Recommendation- add the connecting lines as one solid line, like we do for the discussion/system notes connecting lines, rather than using pseudo-elements
End goal (when we have sub-issues and updated icons | | | | ------ | ------ | | Screen_Shot_2019-02-14_at_10.47.34_AM | Screen_Shot_2019-02-14_at_10.47.09_AM |
*This page may contain information related to upcoming products, features and functionality. It is important to note that the information presented is for informational purposes only, so please do not rely on the information for purchasing or planning purposes. Just like with all projects, the items mentioned on the page are subject to change or delay, and the development, release, and timing of any products, features, or functionality remain at the sole discretion of GitLab Inc.*
Edited by 🤖 GitLab Bot 🤖