@@ -12,7 +12,7 @@ Follow these guidelines when contributing or reviewing design and user interface
advice and best practices for code review in general.
The basis for most of these guidelines is [Pajamas](https://design.gitlab.com/),
GitLab design system. We encourage you to [contribute to Pajamas](https://design.gitlab.com/get-started/contribute)
GitLab design system. We encourage you to [contribute to Pajamas](https://design.gitlab.com/get-started/contribute/)
with additions and improvements.
## Merge request reviews
...
...
@@ -32,9 +32,9 @@ Check these aspects both when _designing_ and _reviewing_ UI changes.
- Follow [Pajamas](https://design.gitlab.com/content/punctuation/) as the primary
guidelines for UI text and [documentation style guide](../documentation/styleguide/index.md)
as the secondary.
- Use clear and consistent [terminology](https://design.gitlab.com/content/terminology).
- Use clear and consistent [terminology](https://design.gitlab.com/content/terminology/).
- Check grammar and spelling.
- Consider help content and follow its [guidelines](https://design.gitlab.com/usability/helping-users).
- Consider help content and follow its [guidelines](https://design.gitlab.com/usability/helping-users/).
- Request review from the [appropriate Technical Writer](https://about.gitlab.com/handbook/engineering/ux/technical-writing/#designated-technical-writers),
indicating any specific files or lines they should review, and how to preview
or understand the location/context of the text from the user's perspective.
...
...
@@ -43,20 +43,20 @@ Check these aspects both when _designing_ and _reviewing_ UI changes.
- Consider similar patterns used in the product and justify in the issue when diverging
from them.
- Use appropriate [components](https://design.gitlab.com/components/overview)
and [data visualizations](https://design.gitlab.com/data-visualization/overview).
- Use appropriate [components](https://design.gitlab.com/components/overview/)
and [data visualizations](https://design.gitlab.com/data-visualization/overview/).
### Visual design
Check visual design properties using your browser's _elements inspector_ ([Chrome](https://developer.chrome.com/docs/devtools/css/),
@@ -61,7 +61,7 @@ Therefore, you should postpone this effort until the [experiment cleanup process
We recommend the following workflow:
1. Review the Pajamas guidelines for [icons](https://design.gitlab.com/product-foundations/iconography) and [illustrations](https://design.gitlab.com/product-foundations/illustration).
1. Review the Pajamas guidelines for [icons](https://design.gitlab.com/product-foundations/iconography/) and [illustrations](https://design.gitlab.com/product-foundations/illustration/).
1. Add an icon or illustration as an `.svg` file in the `/app/assets/images` (or EE) path in the GitLab repository.
1. Use `image_tag` or `image_path` to render it via the asset pipeline.
1.**If the experiment is a success**, designers add the new icon or illustration to the Pajamas UI kit as part of the cleanup process.