Merge pull request #3766 from mk84/21873-use-active-class-on-watcher-btn

[21873] Add active class to button for watched work packages

frontend/app/templates/work_packages/watcher_button.html

@@ -1,7 +1,7 @@
-<button class="button"
-        ng-click="toggleWatch()"
+<button ng-click="toggleWatch()"
         title="{{ buttonTitle }}"
         ng-disabled="disabled"
+        class="{{ buttonClass }}"
         id="{{ buttonId }}">
     <i class="button--icon" ng-class="watchIconClass"></i>
     <span class="button--text"

frontend/app/work_packages/directives/work-package-watcher-button-directive.js

@@ -54,11 +54,13 @@ module.exports = function(I18n, WorkPackageService) {
       if (scope.isWatched) {
         scope.buttonTitle = I18n.t('js.label_unwatch_work_package');
         scope.buttonText = I18n.t('js.label_unwatch');
+        scope.buttonClass = 'button -active';
         scope.buttonId = 'unwatch-button';
         scope.watchIconClass = 'icon-watch-1';
       } else {
         scope.buttonTitle = I18n.t('js.label_watch_work_package');
         scope.buttonText = I18n.t('js.label_watch');
+        scope.buttonClass = 'button';
         scope.buttonId = 'watch-button';
         scope.watchIconClass = 'icon-not-watch';
       }