Consistent issue row design for list view in dashboard, group, project, related issues, epics, and board cards

• An issue list appears in multiple places throughout GitLab.
• This issue provides a consistent design across all the places in GitLab for the issue row only.
• The places are:
  • Dashboard: https://gitlab.com/dashboard/issues
  • Group: https://gitlab.com/groups/gitlab-org/issues
  • Project: https://gitlab.com/gitlab-org/gitlab-ee/issues
  • Related issues
  • Epics
  • Board issue cards

• Background color

  • Regularly white
  • Green if recently created
  • Eliminate existing grey scenarios

• Closed badge

  • Appears if the issue is closed

• Confidentiality icon

  • Should appear as necessary.
  • Tooltip should be Confidential issue

• Locked icon

  • Should appear as necessary
  • Tooltip should be Locked issue

• Title

  • Should link to the issue

• Issue id

  • Should link to the issue
  • In a project list view, should be just id.
  • In all the other views, should be entire group/subgroup/.../subgroup/project#id path.

• Opened 12 minutes ago

  • Should be capitalized "O"
  • Tooltip should be timestamp

• Victor Wu

  • Should link to user profile

• Milestone

  • Tooltip should be one of:
    • No tooltip if no start date and no due date entered.
    • Both dates entered: Nov 1, 2017 to Nov 15, 2017
    • Only start date entered: Starts Nov 1, 2017 (Ignore whether it was in the past or is in the future.)
    • Only end date entered: Due Nov 15, 2017
  • It is a group milestone: Clicking on it goes to the group issues page with that group milestone filtered, regardless of where you currently are.
  • It is a project milestone: Clicking on it goes to the project milestones page with that project milestone filtered, regardless of where you currently are.

• Due date

  • Tooltip should be Due Nov 14, 2017

• Label: Not in scope for this design issue. Instead, it is handled in https://gitlab.com/gitlab-org/gitlab-ce/issues/35947.

• Weight

  • Tooltip should be Weight 4

• Assignees

  • Tooltip should be Assigned to Victor Wu
  • Should link to user profile

• Merge requests icon

  • Should only appear if there are more than 0 related merge requests
  • Tooltip should be 3 related merge requests or 1 related merge request

• Thumbsup icon

  • Should only appear if there are more than 0 thumbsup
  • Tooltip should be 3 people :thumbsup: or 1 person :thumbsup:

• Discussion icon

  • Should only appear if there are more than 0 comments
  • Tooltship should be 3 comments or 1 comment
  • Should link to #notes in the issue, i.e. comment thread part of the issue screen

• Updated 3 minutes ago

  • Should be capitalized "U"
  • Tooltip should be timestamp

• Mobile views

  • TBD