Skip to content

Code Insights: Final Insight design review for the 3.37 release

Administrator requested to merge vk/insight-design-review-fix into main

Created by: vovakulikov

Designs with @AlicjaSuska review comments

Test plan

  • Make sure that you're able to edit the repositories field in the first section of the landing page
  • Check that the CSS module migration example has a right repo value
  • Make sure that the link at the Code Insights example (explore more templates) leads to the template section
  • Check that copy of the add dashboard are right (Prior to this PR it was Create dashboard on the main and dashboard UI pages) now it's "Add dashboard"
  • Label of the template expand button should say "Show more" (prior to this it was "show all")
  • All template descriptions should have periods/dots at the end.

@AlicjaSuska a few things about the rest of the issues that you noted in the Figma file

  • No need for the ‘show less’ button - I suspect that if you changed the tab and moved back to the previously expanded tab you should see the "show more" button again. It turned out there is no easy way to achieve this behavior with our existing tab component. So I left the "show less" button that it still should be possible to go back to the not expanded state.
  • copy icon should be 12px x 12px, it is 16px x 16px it should be centered in the grey box. Our CSS variables say that all inline icons show has sizes 16px and not less. About the centered position I want to point out that when these icons always are placed in the same position (right top corner) it should be easier for users to hit this icon. Because it's always in a predictable place. If we center this icon by Y-axis it will be in different places depending on gray block height.

Merge request reports