diff options
author | Annabel Dunstone Gray <annabel.dunstone@gmail.com> | 2016-09-14 13:51:36 +0200 |
---|---|---|
committer | Annabel Dunstone Gray <annabel.dunstone@gmail.com> | 2016-10-10 10:48:50 -0500 |
commit | ff0f70c0fe75773d060ecf5cf75d6fc5f879283b (patch) | |
tree | 585a39854dfc79576988fd6e4d3e406a4eec0e94 /app/assets | |
parent | cc8ad60fc42e9a115da63f0e0eca71c4b2567c35 (diff) | |
download | gitlab-ce-ff0f70c0fe75773d060ecf5cf75d6fc5f879283b.tar.gz |
Change length of connecting lines based on number of builds
Diffstat (limited to 'app/assets')
-rw-r--r-- | app/assets/javascripts/pipeline.js.es6 | 9 | ||||
-rw-r--r-- | app/assets/stylesheets/pages/pipelines.scss | 24 |
2 files changed, 27 insertions, 6 deletions
diff --git a/app/assets/javascripts/pipeline.js.es6 b/app/assets/javascripts/pipeline.js.es6 index d3ed9757afe..f501761b1ec 100644 --- a/app/assets/javascripts/pipeline.js.es6 +++ b/app/assets/javascripts/pipeline.js.es6 @@ -1,9 +1,12 @@ (function() { function addMarginToBuild () { - const $secondChild = $('.build:nth-child(2)'); - if ($secondChild.length) { - $secondChild.closest('.stage-column').addClass('left-margin'); + const $secondChildBuildNode = $('.build:nth-child(2)'); + const $firstChildBuildNode = $secondChildBuildNode.prev('.build'); + // const $previousBuildColumn = $secondChildBuildNode.closest('.stage-column').prev('.stage-column'); + if ($secondChildBuildNode.length) { + $secondChildBuildNode.closest('.stage-column').addClass('left-margin'); + $firstChildBuildNode.addClass('left-connector'); } } diff --git a/app/assets/stylesheets/pages/pipelines.scss b/app/assets/stylesheets/pages/pipelines.scss index e7e1a2a9b18..37df702ea13 100644 --- a/app/assets/stylesheets/pages/pipelines.scss +++ b/app/assets/stylesheets/pages/pipelines.scss @@ -303,11 +303,26 @@ .stage-column { display: inline-block; vertical-align: top; - margin-right: 48px; + + &:not(:last-child) { + margin-right: 44px; + } &.left-margin { &:not(:first-child) { - margin-left: 48px; + margin-left: 44px; + + .left-connector { + &::before { + content: ''; + position: absolute; + top: 50%; + left: -48px; + border-top: 2px solid $border-color; + width: 48px; + height: 1px; + } + } } } @@ -348,7 +363,10 @@ } .build-content { - width: 130px; + width: 164px; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; .ci-status-text { width: 110px; |