From 96648710f7e72e7cabffa00af0727f85ddd182ca Mon Sep 17 00:00:00 2001 From: Annabel Dunstone Gray Date: Wed, 22 Feb 2017 16:05:45 -0600 Subject: Refactor scss; add toggle button to issue board sidebar (still needs fixing) --- app/assets/javascripts/subscription.js | 15 ++++++++------- app/assets/stylesheets/pages/issuable.scss | 6 +----- .../boards/components/sidebar/_notifications.html.haml | 4 ++-- app/views/shared/issuable/_sidebar.html.haml | 5 ++--- 4 files changed, 13 insertions(+), 17 deletions(-) diff --git a/app/assets/javascripts/subscription.js b/app/assets/javascripts/subscription.js index bc68d67615c..646e1abf326 100644 --- a/app/assets/javascripts/subscription.js +++ b/app/assets/javascripts/subscription.js @@ -26,6 +26,14 @@ $.post(toggleActionUrl, () => { button.classList.remove('disabled'); + if (isSubscribed) { + toggleButton.addClass('unsubscribed') + toggleButton.removeClass('subscribed') + } else { + toggleButton.addClass('subscribed') + toggleButton.removeClass('unsubscribed') + } + // hack to allow this to work with the issue boards Vue object if (document.querySelector('html').classList.contains('issue-boards-page')) { gl.issueBoards.boardStoreIssueSet( @@ -34,13 +42,6 @@ ); } else { buttonSpan.innerHTML = isSubscribed ? 'Subscribe' : 'Unsubscribe'; - if (isSubscribed) { - toggleButton.addClass('unsubscribed') - toggleButton.removeClass('subscribed') - } else { - toggleButton.addClass('subscribed') - toggleButton.removeClass('unsubscribed') - } } }); } diff --git a/app/assets/stylesheets/pages/issuable.scss b/app/assets/stylesheets/pages/issuable.scss index d79ae47f589..f3051912892 100644 --- a/app/assets/stylesheets/pages/issuable.scss +++ b/app/assets/stylesheets/pages/issuable.scss @@ -98,7 +98,7 @@ } .issuable-header-text { - margin-top: 7px; + margin-top: 3px; } .block { @@ -119,10 +119,6 @@ border: none; } - span { - display: inline-block; - } - .select2-container span { margin-top: 0; } diff --git a/app/views/projects/boards/components/sidebar/_notifications.html.haml b/app/views/projects/boards/components/sidebar/_notifications.html.haml index a08c7f2af09..0b891cf79d2 100644 --- a/app/views/projects/boards/components/sidebar/_notifications.html.haml +++ b/app/views/projects/boards/components/sidebar/_notifications.html.haml @@ -2,6 +2,6 @@ .block.light.subscription{ ":data-url" => "'#{namespace_project_issues_path(@project.namespace, @project)}/' + issue.id + '/toggle_subscription'" } %span.issuable-header-text.hide-collapsed.pull-left Notifications - %button.btn.btn-default.pull-right.js-subscribe-button.issuable-subscribe-button.hide-collapsed{ type: "button" } - %span + %button.btn.toggle-button.pull-right.js-subscribe-button.issuable-subscribe-button.hide-collapsed{ type: "button" } + %span.subscription-label {{issue.subscribed ? 'Unsubscribe' : 'Subscribe'}} diff --git a/app/views/shared/issuable/_sidebar.html.haml b/app/views/shared/issuable/_sidebar.html.haml index 2576bb4e2a0..d37f995caca 100644 --- a/app/views/shared/issuable/_sidebar.html.haml +++ b/app/views/shared/issuable/_sidebar.html.haml @@ -123,9 +123,8 @@ = icon('rss', 'aria-hidden': 'true') %span.issuable-header-text.hide-collapsed.pull-left Notifications - .toggle-button-container - %button.btn.toggle-button.pull-right.js-subscribe-button.issuable-subscribe-button.hide-collapsed{ type: "button" , class: (subscribed ? "subscribed" : "unsubscribed") } - %span= subscribed ? 'Unsubscribe' : 'Subscribe' + %button.btn.toggle-button.pull-right.js-subscribe-button.issuable-subscribe-button.hide-collapsed{ type: "button" , class: (subscribed ? "subscribed" : "unsubscribed") } + %span.subscription-label= subscribed ? 'Unsubscribe' : 'Subscribe' - project_ref = cross_project_reference(@project, issuable) .block.project-reference -- cgit v1.2.1