diff options
author | Filipa Lacerda <filipa@gitlab.com> | 2019-08-09 13:53:22 +0300 |
---|---|---|
committer | Filipa Lacerda <filipa@gitlab.com> | 2019-08-12 19:24:42 +0300 |
commit | 3e2f2b807148c9dce1f7cc56ec902cf60bc9029c (patch) | |
tree | 8036e7368522b6c53377f98dfe33861089e65ee1 | |
parent | c85cbc08f7fc43819f7569b7686ee22ce747e7b3 (diff) |
Adds highlight to collapsible line
In the job log adds a highlight when hovering
the collapsible line
-rw-r--r-- | app/assets/stylesheets/framework/variables.scss | 1 | ||||
-rw-r--r-- | app/assets/stylesheets/pages/builds.scss | 20 | ||||
-rw-r--r-- | changelogs/unreleased/65790-highlight.yml | 5 | ||||
-rw-r--r-- | lib/gitlab/ci/ansi2html.rb | 2 | ||||
-rw-r--r-- | spec/lib/gitlab/ci/ansi2html_spec.rb | 2 |
5 files changed, 28 insertions, 2 deletions
diff --git a/app/assets/stylesheets/framework/variables.scss b/app/assets/stylesheets/framework/variables.scss index c108f45622f..92190f8979e 100644 --- a/app/assets/stylesheets/framework/variables.scss +++ b/app/assets/stylesheets/framework/variables.scss @@ -603,6 +603,7 @@ $blame-blue: #254e77; * Builds */ $builds-trace-bg: #111; +$job-log-highlight-height: 18px; /* * Commit Page diff --git a/app/assets/stylesheets/pages/builds.scss b/app/assets/stylesheets/pages/builds.scss index 6fc742871e7..73166940146 100644 --- a/app/assets/stylesheets/pages/builds.scss +++ b/app/assets/stylesheets/pages/builds.scss @@ -124,6 +124,26 @@ float: left; padding-left: $gl-padding-8; } + + .section-start { + display: inline; + } + + .section-start, + .section-header { + &:hover { + cursor: pointer; + + &::after { + content: ''; + background-color: rgba($white-light, 0.2); + left: 0; + right: 0; + position: absolute; + height: $job-log-highlight-height; + } + } + } } .build-header { diff --git a/changelogs/unreleased/65790-highlight.yml b/changelogs/unreleased/65790-highlight.yml new file mode 100644 index 00000000000..2531a3730ed --- /dev/null +++ b/changelogs/unreleased/65790-highlight.yml @@ -0,0 +1,5 @@ +--- +title: Adds highlight to the collapsible section +merge_request: +author: +type: added diff --git a/lib/gitlab/ci/ansi2html.rb b/lib/gitlab/ci/ansi2html.rb index 382b8896dbd..b7886114e9c 100644 --- a/lib/gitlab/ci/ansi2html.rb +++ b/lib/gitlab/ci/ansi2html.rb @@ -218,7 +218,7 @@ module Gitlab return if @sections.include?(section) @sections << section - write_raw %{<div class="js-section-start fa fa-caret-down pr-2 cursor-pointer" data-timestamp="#{timestamp}" data-section="#{data_section_names}" role="button"></div>} + write_raw %{<div class="js-section-start section-start fa fa-caret-down pr-2 cursor-pointer" data-timestamp="#{timestamp}" data-section="#{data_section_names}" role="button"></div>} @lineno_in_section = 0 end diff --git a/spec/lib/gitlab/ci/ansi2html_spec.rb b/spec/lib/gitlab/ci/ansi2html_spec.rb index b6b3de4bc4a..c8afcbd053d 100644 --- a/spec/lib/gitlab/ci/ansi2html_spec.rb +++ b/spec/lib/gitlab/ci/ansi2html_spec.rb @@ -209,7 +209,7 @@ describe Gitlab::Ci::Ansi2html do let(:section_start) { "section_start:#{section_start_time.to_i}:#{section_name}\r\033[0K"} let(:section_end) { "section_end:#{section_end_time.to_i}:#{section_name}\r\033[0K"} let(:section_start_html) do - '<div class="js-section-start fa fa-caret-down pr-2 cursor-pointer"' \ + '<div class="js-section-start section-start fa fa-caret-down pr-2 cursor-pointer"' \ " data-timestamp=\"#{section_start_time.to_i}\" data-section=\"#{class_name(section_name)}\"" \ ' role="button"></div>' end |