Skip to content

Align visual styles of code insight according to latest design layouts

Administrator requested to merge code-insights/visual-polishing into main

Created by: vovakulikov

Details of this PR

This PR is the third PR in three polishing PR's before 3.28 release

  1. Change form validation mechanism in order to improve UX with live preview charts
  2. Support multi org for insight creation UI
  3. This PR

What has been done

Form

  • Change ordering of form fields according to latest Figma layouts

Live preview

  • Change description text for live preview (add requirements what fields need to be filled to see live preview chart)
  • Add card styles to live preview
  • Change the update button to label text + icon-button (according to designs)
  • Add opacity 0.5 to mock state of live preview

Insight card

  • Remove title background at insight card
  • Make the title a bit smaller (h3 to h4)
  • Change box shadow for context menu and use dropdown-menu css class

Navigation

  • Replace buttons add more insights and configure insights by just one button + Create new insight

Merge request reports

Loading