diff options
author | Phil Hughes <me@iamphill.com> | 2017-10-16 16:16:43 +0000 |
---|---|---|
committer | Phil Hughes <me@iamphill.com> | 2017-10-16 16:16:43 +0000 |
commit | 7996be6070439f6faf379c116764ea45090fb930 (patch) | |
tree | fc5e28d130590c4d016f25b77b8503c9b9520ee4 | |
parent | d5bfb9315275c94e69eaa6012d2c43785b5cd3a6 (diff) | |
parent | 490d117a5a49b2ebf31518d4a4a819e00bd4b2b1 (diff) | |
download | gitlab-ce-7996be6070439f6faf379c116764ea45090fb930.tar.gz |
Merge branch 'fl-autodevops-fix' into 'master'
Remove banner from pipelines page
Closes #38641, #39051, and #38827
See merge request gitlab-org/gitlab-ce!14849
-rw-r--r-- | app/assets/javascripts/dispatcher.js | 12 | ||||
-rw-r--r-- | app/assets/stylesheets/framework.scss | 1 | ||||
-rw-r--r-- | app/assets/stylesheets/framework/banner.scss | 25 | ||||
-rw-r--r-- | app/views/projects/empty.html.haml | 9 | ||||
-rw-r--r-- | app/views/projects/merge_requests/index.html.haml | 2 | ||||
-rw-r--r-- | app/views/projects/pipelines/index.html.haml | 2 | ||||
-rw-r--r-- | app/views/projects/tree/show.html.haml | 2 | ||||
-rw-r--r-- | app/views/shared/_auto_devops_callout.html.haml | 29 | ||||
-rw-r--r-- | app/views/shared/icons/_icon_autodevops.svg | 2 | ||||
-rw-r--r-- | changelogs/unreleased/fl-autodevops-fix.yml | 5 |
10 files changed, 58 insertions, 31 deletions
diff --git a/app/assets/javascripts/dispatcher.js b/app/assets/javascripts/dispatcher.js index cd53bc1e2dd..0a645e5842d 100644 --- a/app/assets/javascripts/dispatcher.js +++ b/app/assets/javascripts/dispatcher.js @@ -168,9 +168,6 @@ import memberExpirationDate from './member_expiration_date'; const filteredSearchManager = new gl.FilteredSearchManager(page === 'projects:issues:index' ? 'issues' : 'merge_requests'); filteredSearchManager.setup(); } - if (page === 'projects:merge_requests:index') { - new UserCallout({ setCalloutPerProject: true }); - } const pagePrefix = page === 'projects:merge_requests:index' ? 'merge_request_' : 'issue_'; IssuableIndex.init(pagePrefix); @@ -352,7 +349,10 @@ import memberExpirationDate from './member_expiration_date'; case 'projects:show': shortcut_handler = new ShortcutsNavigation(); new NotificationsForm(); - new UserCallout({ setCalloutPerProject: true }); + new UserCallout({ + setCalloutPerProject: true, + className: 'js-autodevops-banner', + }); if ($('#tree-slider').length) new TreeView(); if ($('.blob-viewer').length) new BlobViewer(); @@ -372,9 +372,6 @@ import memberExpirationDate from './member_expiration_date'; case 'projects:pipelines:new': new NewBranchForm($('.js-new-pipeline-form')); break; - case 'projects:pipelines:index': - new UserCallout({ setCalloutPerProject: true }); - break; case 'projects:pipelines:builds': case 'projects:pipelines:failures': case 'projects:pipelines:show': @@ -432,7 +429,6 @@ import memberExpirationDate from './member_expiration_date'; new TreeView(); new BlobViewer(); new NewCommitForm($('.js-create-dir-form')); - new UserCallout({ setCalloutPerProject: true }); $('#tree-slider').waitForImages(function() { ajaxGet(document.querySelector('.js-tree-content').dataset.logsPath); }); diff --git a/app/assets/stylesheets/framework.scss b/app/assets/stylesheets/framework.scss index 0d7a5cba928..aa61ddc6a2c 100644 --- a/app/assets/stylesheets/framework.scss +++ b/app/assets/stylesheets/framework.scss @@ -7,6 +7,7 @@ @import "framework/animations"; @import "framework/avatar"; @import "framework/asciidoctor"; +@import "framework/banner"; @import "framework/blocks"; @import "framework/buttons"; @import "framework/badges"; diff --git a/app/assets/stylesheets/framework/banner.scss b/app/assets/stylesheets/framework/banner.scss new file mode 100644 index 00000000000..6433b0c7855 --- /dev/null +++ b/app/assets/stylesheets/framework/banner.scss @@ -0,0 +1,25 @@ +.banner-callout { + display: flex; + position: relative; + flex-wrap: wrap; + + .banner-close { + position: absolute; + top: 10px; + right: 10px; + opacity: 1; + + .dismiss-icon { + color: $gl-text-color; + font-size: $gl-font-size; + } + } + + .banner-graphic { + margin: 20px auto; + } + + &.banner-non-empty-state { + border-bottom: 1px solid $border-color; + } +} diff --git a/app/views/projects/empty.html.haml b/app/views/projects/empty.html.haml index 3f3ce10419f..c9956183e12 100644 --- a/app/views/projects/empty.html.haml +++ b/app/views/projects/empty.html.haml @@ -24,10 +24,15 @@ %p You will need to be owner or have the master permission level for the initial push, as the master branch is automatically protected. + - if show_auto_devops_callout?(@project) + %p + - link = link_to(s_('AutoDevOps|Auto DevOps (Beta)'), project_settings_ci_cd_path(@project, anchor: 'js-general-pipeline-settings')) + = s_('AutoDevOps|You can activate %{link_to_settings} for this project.').html_safe % { link_to_settings: link } + %p + = s_('AutoDevOps|It will automatically build, test, and deploy your application based on a predefined CI/CD configuration.') + - if can?(current_user, :push_code, @project) %div{ class: container_class } - - if show_auto_devops_callout?(@project) - = render 'shared/auto_devops_callout' .prepend-top-20 .empty_wrapper %h3.page-title-empty diff --git a/app/views/projects/merge_requests/index.html.haml b/app/views/projects/merge_requests/index.html.haml index 6b8dcb3e60b..8da2243adef 100644 --- a/app/views/projects/merge_requests/index.html.haml +++ b/app/views/projects/merge_requests/index.html.haml @@ -13,8 +13,6 @@ - if @project.merge_requests.exists? %div{ class: container_class } - - if show_auto_devops_callout?(@project) - = render 'shared/auto_devops_callout' .top-area = render 'shared/issuable/nav', type: :merge_requests .nav-controls diff --git a/app/views/projects/pipelines/index.html.haml b/app/views/projects/pipelines/index.html.haml index a10a7c23924..f8627a3818b 100644 --- a/app/views/projects/pipelines/index.html.haml +++ b/app/views/projects/pipelines/index.html.haml @@ -2,8 +2,6 @@ - page_title "Pipelines" %div{ 'class' => container_class } - - if show_auto_devops_callout?(@project) - = render 'shared/auto_devops_callout' #pipelines-list-vue{ data: { endpoint: project_pipelines_path(@project, format: :json), "help-page-path" => help_page_path('ci/quick_start/README'), "help-auto-devops-path" => help_page_path('topics/autodevops/index.md'), diff --git a/app/views/projects/tree/show.html.haml b/app/views/projects/tree/show.html.haml index 0cc6674842a..745a6040488 100644 --- a/app/views/projects/tree/show.html.haml +++ b/app/views/projects/tree/show.html.haml @@ -12,7 +12,5 @@ = webpack_bundle_tag 'repo' %div{ class: [container_class, ("limit-container-width" unless fluid_layout)] } - - if show_auto_devops_callout?(@project) && !show_new_repo? - = render 'shared/auto_devops_callout' = render 'projects/last_push' = render 'projects/files', commit: @last_commit, project: @project, ref: @ref, content_url: project_tree_path(@project, @id) diff --git a/app/views/shared/_auto_devops_callout.html.haml b/app/views/shared/_auto_devops_callout.html.haml index 7c633175a06..934d65e8b42 100644 --- a/app/views/shared/_auto_devops_callout.html.haml +++ b/app/views/shared/_auto_devops_callout.html.haml @@ -1,15 +1,16 @@ -.user-callout{ data: { uid: 'auto_devops_settings_dismissed', project_path: project_path(@project) } } - .bordered-box.landing.content-block - %button.btn.btn-default.close.js-close-callout{ type: 'button', - 'aria-label' => 'Dismiss Auto DevOps box' } - = icon('times', class: 'dismiss-icon', 'aria-hidden' => 'true') - .svg-container - = custom_icon('icon_autodevops') - .user-callout-copy - %h4= s_('AutoDevOps|Auto DevOps (Beta)') - %p= s_('AutoDevOps|Auto DevOps can be activated for this project. It will automatically build, test, and deploy your application based on a predefined CI/CD configuration.') - %p - - link = link_to(s_('AutoDevOps|Auto DevOps documentation'), help_page_path('topics/autodevops/index.md'), target: '_blank', rel: 'noopener noreferrer') - = s_('AutoDevOps|Learn more in the %{link_to_documentation}').html_safe % { link_to_documentation: link } +.js-autodevops-banner.banner-callout.banner-non-empty-state.append-bottom-20{ data: { uid: 'auto_devops_settings_dismissed', project_path: project_path(@project) } } + .banner-graphic + = custom_icon('icon_autodevops') - = link_to s_('AutoDevOps|Enable in settings'), project_settings_ci_cd_path(@project, anchor: 'js-general-pipeline-settings'), class: 'btn btn-primary js-close-callout' + .prepend-top-10.prepend-left-10.append-bottom-10 + %h5= s_('AutoDevOps|Auto DevOps (Beta)') + %p= s_('AutoDevOps|It will automatically build, test, and deploy your application based on a predefined CI/CD configuration.') + %p + - link = link_to(s_('AutoDevOps|Auto DevOps documentation'), help_page_path('topics/autodevops/index.md'), target: '_blank', rel: 'noopener noreferrer') + = s_('AutoDevOps|Learn more in the %{link_to_documentation}').html_safe % { link_to_documentation: link } + .prepend-top-10 + = link_to s_('AutoDevOps|Enable in settings'), project_settings_ci_cd_path(@project, anchor: 'js-general-pipeline-settings'), class: 'btn js-close-callout' + + %button.btn-transparent.banner-close.close.js-close-callout{ type: 'button', + 'aria-label' => 'Dismiss Auto DevOps box' } + = icon('times', class: 'dismiss-icon', 'aria-hidden' => 'true') diff --git a/app/views/shared/icons/_icon_autodevops.svg b/app/views/shared/icons/_icon_autodevops.svg index 807ff27bb67..7e47c084bde 100644 --- a/app/views/shared/icons/_icon_autodevops.svg +++ b/app/views/shared/icons/_icon_autodevops.svg @@ -1,4 +1,4 @@ -<svg xmlns="http://www.w3.org/2000/svg" width="189" height="179" viewBox="0 0 189 179"> +<svg xmlns="http://www.w3.org/2000/svg" width="189" height="110" viewBox="0 0 189 179"> <g fill="none" fill-rule="evenodd"> <path fill="#FFFFFF" fill-rule="nonzero" d="M110.160166,47.6956996 L160.160166,47.6956996 C165.683013,47.6956996 170.160166,52.1728521 170.160166,57.6956996 L170.160166,117.6957 C170.160166,123.218547 165.683013,127.6957 160.160166,127.6957 L110.160166,127.6957 C104.637318,127.6957 100.160166,123.218547 100.160166,117.6957 L100.160166,57.6956996 C100.160166,52.1728521 104.637318,47.6956996 110.160166,47.6956996 Z" transform="rotate(10 135.16 87.696)"/> <path fill="#EEEEEE" fill-rule="nonzero" d="M110.160166,51.6956996 C106.846457,51.6956996 104.160166,54.3819911 104.160166,57.6956996 L104.160166,117.6957 C104.160166,121.009408 106.846457,123.6957 110.160166,123.6957 L160.160166,123.6957 C163.473874,123.6957 166.160166,121.009408 166.160166,117.6957 L166.160166,57.6956996 C166.160166,54.3819911 163.473874,51.6956996 160.160166,51.6956996 L110.160166,51.6956996 Z M110.160166,47.6956996 L160.160166,47.6956996 C165.683013,47.6956996 170.160166,52.1728521 170.160166,57.6956996 L170.160166,117.6957 C170.160166,123.218547 165.683013,127.6957 160.160166,127.6957 L110.160166,127.6957 C104.637318,127.6957 100.160166,123.218547 100.160166,117.6957 L100.160166,57.6956996 C100.160166,52.1728521 104.637318,47.6956996 110.160166,47.6956996 Z" transform="rotate(10 135.16 87.696)"/> diff --git a/changelogs/unreleased/fl-autodevops-fix.yml b/changelogs/unreleased/fl-autodevops-fix.yml new file mode 100644 index 00000000000..21b739231a8 --- /dev/null +++ b/changelogs/unreleased/fl-autodevops-fix.yml @@ -0,0 +1,5 @@ +--- +title: Improve autodevops banner UX and render it only in project page +merge_request: +author: +type: fixed |