From f2bf47f4dffacbb34ac3e4ed27f83176e29f9159 Mon Sep 17 00:00:00 2001 From: winniehell Date: Sat, 9 Jul 2016 03:06:12 +0200 Subject: Display tooltip for "Copy to Clipboard" button (!5164) --- CHANGELOG | 1 + app/assets/stylesheets/pages/commits.scss | 2 +- app/helpers/button_helper.rb | 22 +++------------------- app/views/projects/commits/_commit.html.haml | 2 +- .../merge_requests/show/_how_to_merge.html.haml | 6 +++--- 5 files changed, 9 insertions(+), 24 deletions(-) diff --git a/CHANGELOG b/CHANGELOG index 3e4a10bb5a3..16a297af4a1 100644 --- a/CHANGELOG +++ b/CHANGELOG @@ -7,6 +7,7 @@ v 8.10.0 (unreleased) - Add Application Setting to configure default Repository Path for new projects - Wrap code blocks on Activies and Todos page. !4783 (winniehell) - Align flash messages with left side of page content !4959 (winniehell) + - Display tooltip for "Copy to Clipboard" button !5164 (winniehell) - Display last commit of deleted branch in push events !4699 (winniehell) - Escape file extension when parsing search results !5141 (winniehell) - Apply the trusted_proxies config to the rack request object for use with rack_attack diff --git a/app/assets/stylesheets/pages/commits.scss b/app/assets/stylesheets/pages/commits.scss index 85bbf70e188..0298577c494 100644 --- a/app/assets/stylesheets/pages/commits.scss +++ b/app/assets/stylesheets/pages/commits.scss @@ -61,7 +61,7 @@ font-size: 0; } - .btn-transparent { + .btn-clipboard, .btn-transparent { padding-left: 0; padding-right: 0; } diff --git a/app/helpers/button_helper.rb b/app/helpers/button_helper.rb index 0f097f86816..b478580978b 100644 --- a/app/helpers/button_helper.rb +++ b/app/helpers/button_helper.rb @@ -15,29 +15,13 @@ module ButtonHelper # # See http://clipboardjs.com/#usage def clipboard_button(data = {}) + data = { toggle: 'tooltip', placement: 'bottom', container: 'body' }.merge(data) content_tag :button, icon('clipboard'), class: "btn btn-clipboard", data: data, - type: :button - end - - # Output a "Copy to Clipboard" button with a custom CSS class - # - # data - Data attributes passed to `content_tag` - # css_class - Class passed to the `content_tag` - # - # Examples: - # - # # Define the target element - # clipboard_button_with_class({clipboard_target: "div#foo"}, css_class: "btn-clipboard") - # # => "" - def clipboard_button_with_class(data = {}, css_class: 'btn-clipboard') - content_tag :button, - icon('clipboard'), - class: "btn #{css_class}", - data: data, - type: :button + type: :button, + title: "Copy to Clipboard" end def http_clone_button(project, placement = 'right', append_link: true) diff --git a/app/views/projects/commits/_commit.html.haml b/app/views/projects/commits/_commit.html.haml index 929496f81d8..c8c7b858baa 100644 --- a/app/views/projects/commits/_commit.html.haml +++ b/app/views/projects/commits/_commit.html.haml @@ -25,7 +25,7 @@ .commit-actions.hidden-xs - if commit.status = render_commit_status(commit, cssclass: 'btn btn-transparent') - = clipboard_button_with_class({ clipboard_text: commit.id }, css_class: 'btn-transparent') + = clipboard_button(clipboard_text: commit.id) = link_to commit.short_id, namespace_project_commit_path(project.namespace, project, commit), class: "commit-short-id btn btn-transparent" = link_to_browse_code(project, commit) diff --git a/app/views/projects/merge_requests/show/_how_to_merge.html.haml b/app/views/projects/merge_requests/show/_how_to_merge.html.haml index b3bea900d42..b727efaa6a6 100644 --- a/app/views/projects/merge_requests/show/_how_to_merge.html.haml +++ b/app/views/projects/merge_requests/show/_how_to_merge.html.haml @@ -8,7 +8,7 @@ %p %strong Step 1. Fetch and check out the branch for this merge request - = clipboard_button_with_class({clipboard_target: "pre#merge-info-1"}, css_class: "btn-clipboard") + = clipboard_button(clipboard_target: "pre#merge-info-1") %pre.dark#merge-info-1 - if @merge_request.for_fork? :preserve @@ -25,7 +25,7 @@ %p %strong Step 3. Merge the branch and fix any conflicts that come up - = clipboard_button_with_class({clipboard_target: "pre#merge-info-3"}, css_class: "btn-clipboard") + = clipboard_button(clipboard_target: "pre#merge-info-3") %pre.dark#merge-info-3 - if @merge_request.for_fork? :preserve @@ -38,7 +38,7 @@ %p %strong Step 4. Push the result of the merge to GitLab - = clipboard_button_with_class({clipboard_target: "pre#merge-info-4"}, css_class: "btn-clipboard") + = clipboard_button(clipboard_target: "pre#merge-info-4") %pre.dark#merge-info-4 :preserve git push origin #{h @merge_request.target_branch} -- cgit v1.2.1