diff options
author | Jacob Schatz <jschatz@gitlab.com> | 2016-10-06 22:17:58 +0300 |
---|---|---|
committer | Jacob Schatz <jschatz@gitlab.com> | 2016-10-06 22:17:58 +0300 |
commit | d6d295d40765280d7ba6dd510d2b74bc54ee5311 (patch) | |
tree | 30d97bcfe38b4e73b70cda81ea245d8ad101cd60 /app/assets/stylesheets | |
parent | 6320192592f32519c07231480cbd669a71e78320 (diff) | |
parent | e23c1d88e2d20ffd5cadde6bb06148b9295461b5 (diff) |
Merge branch 'replace-bootstrap-caret' into 'master'
Replace bootstrap caret with fontawesome caret
## What does this MR do?
1. Replaces all occurrences of `.caret` with fontawesome's caret (`fa-caret-down` for most cases)
2. Remove `.caret` from CSS
3. Refactored pipeline graph toggle to display the correct fontawesome caret (Had to change some JavaScript for this)
## Are there points in the code the reviewer needs to double check?
* Need to check if I missed any pages :disappointed_relieved: or for any side effects
## Why was this MR needed?
Resolves UI inconsistency
## Screenshots (if relevant)
Before (1 example out of many):
![Screen_Shot_2016-09-12_at_3.49.58_PM](/uploads/5eb93bbcc00412a5875e39302f4d8ba0/Screen_Shot_2016-09-12_at_3.49.58_PM.png)
After:
![Screen_Shot_2016-09-12_at_3.49.48_PM](/uploads/9259a9ebfb0bd09b4cfd55674e9b8be4/Screen_Shot_2016-09-12_at_3.49.48_PM.png)
## Does this MR meet the acceptance criteria?
- [x] [CHANGELOG](https://gitlab.com/gitlab-org/gitlab-ce/blob/master/CHANGELOG) entry added
- Tests
- [x] All builds are passing
- [x] Conform by the [merge request performance guides](http://docs.gitlab.com/ce/development/merge_request_performance_guidelines.html)
- [x] Conform by the [style guides](https://gitlab.com/gitlab-org/gitlab-ce/blob/master/CONTRIBUTING.md#style-guides)
- [x] Branch has no merge conflicts with `master` (if you do - rebase it please)
- [x] [Squashed related commits together](https://git-scm.com/book/en/Git-Tools-Rewriting-History#Squashing-Commits)
## What are the relevant issue numbers?
Closes #21169
See merge request !6314
Diffstat (limited to 'app/assets/stylesheets')
-rw-r--r-- | app/assets/stylesheets/framework/buttons.scss | 9 | ||||
-rw-r--r-- | app/assets/stylesheets/framework/dropdowns.scss | 17 | ||||
-rw-r--r-- | app/assets/stylesheets/framework/forms.scss | 4 | ||||
-rw-r--r-- | app/assets/stylesheets/framework/header.scss | 4 | ||||
-rw-r--r-- | app/assets/stylesheets/framework/selects.scss | 9 | ||||
-rw-r--r-- | app/assets/stylesheets/pages/pipelines.scss | 15 |
6 files changed, 26 insertions, 32 deletions
diff --git a/app/assets/stylesheets/framework/buttons.scss b/app/assets/stylesheets/framework/buttons.scss index ce489f7c3de..d11b2fe7ec2 100644 --- a/app/assets/stylesheets/framework/buttons.scss +++ b/app/assets/stylesheets/framework/buttons.scss @@ -194,10 +194,17 @@ pointer-events: none !important; } - .caret { + .fa-caret-down, + .fa-caret-up { margin-left: 5px; } + &.dropdown-toggle { + .fa-caret-down { + margin-left: 3px; + } + } + svg { height: 15px; width: 15px; diff --git a/app/assets/stylesheets/framework/dropdowns.scss b/app/assets/stylesheets/framework/dropdowns.scss index 4a87a73a68a..baa95711329 100644 --- a/app/assets/stylesheets/framework/dropdowns.scss +++ b/app/assets/stylesheets/framework/dropdowns.scss @@ -1,20 +1,3 @@ -.caret { - display: inline-block; - width: 0; - height: 0; - margin-left: 2px; - vertical-align: middle; - border-top: $caret-width-base dashed; - border-right: $caret-width-base solid transparent; - border-left: $caret-width-base solid transparent; -} - -.btn-group { - .caret { - margin-left: 0; - } -} - .dropdown { position: relative; diff --git a/app/assets/stylesheets/framework/forms.scss b/app/assets/stylesheets/framework/forms.scss index 37ff7e22ed1..a67d31de2f7 100644 --- a/app/assets/stylesheets/framework/forms.scss +++ b/app/assets/stylesheets/framework/forms.scss @@ -81,10 +81,10 @@ label { .select-wrapper { position: relative; - .caret { + .fa-caret-down { position: absolute; right: 10px; - top: $gl-padding; + top: 10px; color: $gray-darkest; pointer-events: none; } diff --git a/app/assets/stylesheets/framework/header.scss b/app/assets/stylesheets/framework/header.scss index c748f856501..9823abdde1f 100644 --- a/app/assets/stylesheets/framework/header.scss +++ b/app/assets/stylesheets/framework/header.scss @@ -57,6 +57,10 @@ header { &:hover, &:focus, &:active { background-color: $background-color; } + + .fa-caret-down { + font-size: 15px; + } } .navbar-toggle { diff --git a/app/assets/stylesheets/framework/selects.scss b/app/assets/stylesheets/framework/selects.scss index c75dacf95d9..bcd60391543 100644 --- a/app/assets/stylesheets/framework/selects.scss +++ b/app/assets/stylesheets/framework/selects.scss @@ -21,7 +21,14 @@ padding-right: 10px; b { - @extend .caret; + display: inline-block; + width: 0; + height: 0; + margin-left: 2px; + vertical-align: middle; + border-top: $caret-width-base dashed; + border-right: $caret-width-base solid transparent; + border-left: $caret-width-base solid transparent; color: $gray-darkest; } } diff --git a/app/assets/stylesheets/pages/pipelines.scss b/app/assets/stylesheets/pages/pipelines.scss index 68fc6da6c1b..a2779704eff 100644 --- a/app/assets/stylesheets/pages/pipelines.scss +++ b/app/assets/stylesheets/pages/pipelines.scss @@ -229,9 +229,12 @@ .fa { color: $table-text-gray; - margin-right: 6px; font-size: 14px; } + + svg, .fa { + margin-right: 0; + } } .btn-remove { @@ -272,18 +275,8 @@ .toggle-pipeline-btn { background-color: $gray-dark; - .caret { - border-top: none; - border-bottom: 4px solid; - } - &.graph-collapsed { background-color: $white-light; - - .caret { - border-bottom: none; - border-top: 4px solid; - } } } |