diff options
| author | Jacob Schatz <jschatz@gitlab.com> | 2016-06-21 20:29:50 +0000 |
|---|---|---|
| committer | Jacob Schatz <jschatz@gitlab.com> | 2016-06-21 20:29:50 +0000 |
| commit | 7198b78417a9b17d55d390d57cc35638685d7305 (patch) | |
| tree | 16bd9df3b01aec88d96244b3d4f27a392b49b1d7 | |
| parent | 0f902d51a6b30346b2fb84f751072efa0784cd5e (diff) | |
| parent | e50739f4c7bf823f2c1a4a65363ed987eff7d399 (diff) | |
| download | gitlab-ce-7198b78417a9b17d55d390d57cc35638685d7305.tar.gz | |
Merge branch 'contributors-graph-mobile' into 'master'
Apply responsive design for Contributors graphs.
## What does this MR do?
Makes the Contributors graphs work on mobile.
## Are there points in the code the reviewer needs to double check?
That this doesn't break on any screen sizes.
## Why was this MR needed?
It used to be squished and impossible to read.
## What are the relevant issue numbers?
Fixes #18845.
## Screenshots (if relevant)
Before:
After:
cc: @jschatz1
See merge request !4801
| -rw-r--r-- | app/assets/javascripts/graphs/stat_graph_contributors_graph.js.coffee | 6 | ||||
| -rw-r--r-- | app/assets/stylesheets/pages/stat_graph.scss | 6 |
2 files changed, 11 insertions, 1 deletions
diff --git a/app/assets/javascripts/graphs/stat_graph_contributors_graph.js.coffee b/app/assets/javascripts/graphs/stat_graph_contributors_graph.js.coffee index 584d281a510..834a81af459 100644 --- a/app/assets/javascripts/graphs/stat_graph_contributors_graph.js.coffee +++ b/app/assets/javascripts/graphs/stat_graph_contributors_graph.js.coffee @@ -121,7 +121,11 @@ class @ContributorsMasterGraph extends ContributorsGraph class @ContributorsAuthorGraph extends ContributorsGraph constructor: (@data) -> - @width = $('.content').width()/2 - 100 + # Don't split graph size in half for mobile devices. + if $(window).width() < 768 + @width = $('.content').width() - 80 + else + @width = ($('.content').width() / 2) - 100 @height = 200 @x = null @y = null diff --git a/app/assets/stylesheets/pages/stat_graph.scss b/app/assets/stylesheets/pages/stat_graph.scss index 85a0304196c..8a1f2d098d6 100644 --- a/app/assets/stylesheets/pages/stat_graph.scss +++ b/app/assets/stylesheets/pages/stat_graph.scss @@ -25,13 +25,19 @@ &:nth-child(even) { float: right; } + float: left; margin-top: 10px; + + @media (max-width: $screen-sm-min) { + width: 100%; + } } .person .spark { display: block; background: #f3f3f3; + width: 100%; } .person .area-contributor { |