diff --git a/modules/core/client/directives/toggle-class.client.directive.js b/modules/core/client/directives/toggle-class.client.directive.js
new file mode 100644
index 00000000..4fdc4d64
--- /dev/null
+++ b/modules/core/client/directives/toggle-class.client.directive.js
@@ -0,0 +1,30 @@
+(function () {
+  'use strict';
+
+  // Focus the element on page load
+  // Unless the user is on a small device, because this could obscure the page with a keyboard
+
+  angular.module('core')
+    .directive('toggleClass', toggleClass);
+
+  function toggleClass() {
+    var directive = {
+      restrict: 'A',
+      link: link
+    };
+
+    return directive;
+
+    function link(scope, element, attrs) {
+      element.bind('click', function () {
+        if (element.hasClass(attrs.toggleClass)) {
+          element.removeClass(attrs.toggleClass);
+          element.addClass(attrs.baseClass);
+        } else {
+          element.removeClass(attrs.baseClass);
+          element.addClass(attrs.toggleClass);
+        }
+      });
+    }
+  }
+}());