kotovalexarian-likes-gitlab/gitlab-org--gitlab-foss
1
0
Fork 0
Code Releases Activity

Merge branch 'ux-guide-color-update' into 'master'

Browse source 
UX Guide: split state and action guidance for color

See merge request !8204
This commit is contained in:
Annabel Dunstone Gray 2016-12-28 14:37:43 +00:00
commit cbee5f00fd
1 changed files with 7 additions and 7 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

14
doc/development/ux_guide/basics.md
View file

@ -50,13 +50,13 @@ GitLab uses Font Awesome icons throughout our interface.
## Color
| | |
| :------: | :------- |
| ![Blue](img/color-blue.png) | Blue is used to highlight primary active elements (such as the current tab), as well as other organizational and managing commands.|
| ![Green](img/color-green.png) | Green is for actions that create new objects. |
| ![Orange](img/color-orange.png) | Orange is used for warnings |
| ![Red](img/color-red.png) | Red is reserved for delete and other destructive commands |
| ![Grey](img/color-grey.png) | Grey is used for neutral secondary elements. Depending on context, white is sometimes used instead. |
| | State | Action |
| :------: | :------- | :------- |
| ![Blue](img/color-blue.png) | Primary and active (such as the current tab) | Organizational, managing, and retry commands|
| ![Green](img/color-green.png) | Opened | Create new objects |
| ![Orange](img/color-orange.png) | Warning | Non destructive action |
| ![Red](img/color-red.png) | Closed | Delete and other destructive commands |
| ![Grey](img/color-grey.png) | Neutral | Neutral secondary commands |
> TODO: Establish a perspective for color in terms of our personality and rationalize with Marketing usage.