diff options
| author | Dmitriy Zaporozhets <dmitriy.zaporozhets@gmail.com> | 2016-06-03 07:07:52 +0000 |
|---|---|---|
| committer | Dmitriy Zaporozhets <dmitriy.zaporozhets@gmail.com> | 2016-06-03 07:07:52 +0000 |
| commit | ae5f17ae2dc0009ca5fce9a46db18af943dffbd5 (patch) | |
| tree | a625810568b8f9fa625d636d9ab214b72d8ef446 | |
| parent | 07b46517cc940b429515374e4e102ff04405e804 (diff) | |
| parent | 814b26cfc3829a683ce565cbbfc8525dd768299d (diff) | |
| download | gitlab-ce-ae5f17ae2dc0009ca5fce9a46db18af943dffbd5.tar.gz | |
Merge branch 'dz-more-ui-guides' into 'master'
Add icons and buttons to UI guide
cc @jschatz1 @skyruler
See merge request !4445
| -rw-r--r-- | doc/development/ui_guide.md | 22 |
1 files changed, 21 insertions, 1 deletions
diff --git a/doc/development/ui_guide.md b/doc/development/ui_guide.md index b4dcb748351..23760a14b39 100644 --- a/doc/development/ui_guide.md +++ b/doc/development/ui_guide.md @@ -33,4 +33,24 @@ be under 'Wiki' tab and so on and so forth. We want GitLab to work well on small mobile screens as well. Size limitations make it is impossible to fit everything on a mobile screen. In this case it is OK to hide part of the UI for smaller resolutions in favor of a better user experience. However core functionality like browsing files, creating issues, writing comments, should -be available on all resolutions.
\ No newline at end of file +be available on all resolutions. + +## Icons + +* `trash` icon for button or link that does destructive action like removing +information from database or file system +* `x` icon for closing/hiding UI element. For example close modal window +* `pencil` icon for edit button or link +* `eye` icon for subscribe action +* `rss` for rss/atom feed +* `plus` for link or dropdown that lead to page where you create new object (For example new issue page) + + +## Buttons + +* Button should contain icon or text. Exceptions should be approved by UX designer. +* Use gray button on white background or white button on gray background. +* Use red button for destructive actions (not revertable). For example removing issue. +* Use green or blue button for primary action. Primary button should be only one. +Do not use both green and blue button in one form. + |