Fix button to remove users from teams in Admin Panel (#1437)

* Fix admin panel button to remove users from teams. 
* Add the data-href attribute to td as well as tr. 
* Closes #1435

CTFd/themes/admin/assets/css/admin.scss

@@ -63,7 +63,7 @@ tbody tr:hover {
   background-color: rgba(0, 0, 0, 0.1) !important;
 }
 
-tr[data-href] {
+[data-href] {
   cursor: pointer;
 }
 

CTFd/themes/admin/assets/js/styles.js

@@ -35,7 +35,7 @@ export default () => {
       }
     });
 
-    $("tr[data-href]").click(function() {
+    $("tr[data-href], td[data-href]").click(function() {
       var sel = getSelection().toString();
       if (!sel) {
         var href = $(this).attr("data-href");

CTFd/themes/admin/static/css/admin.dev.css

@@ -1,4 +1,4 @@
 html{position:relative;min-height:100%}body{margin-bottom:60px}.footer{position:absolute;bottom:1px;width:100%;height:60px;line-height:normal !important;z-index:-20}
 
-#score-graph{height:450px;display:block;clear:both}#solves-graph{display:block;height:350px}#keys-pie-graph{height:400px;display:block}#categories-pie-graph{height:400px;display:block}#solve-percentages-graph{height:400px;display:block}.no-decoration{color:inherit !important;text-decoration:none !important}.no-decoration:hover{color:inherit !important;text-decoration:none !important}.table td,.table th{vertical-align:inherit}pre{white-space:pre-wrap;margin:0;padding:0}.form-control{position:relative;display:block;border-radius:0;font-weight:400;font-family:"Avenir Next", "Helvetica Neue", Helvetica, Arial, sans-serif;-webkit-appearance:none}tbody tr:hover{background-color:rgba(0,0,0,0.1) !important}tr[data-href]{cursor:pointer}.sort-col{cursor:pointer}input[type="checkbox"]{cursor:pointer}
+#score-graph{height:450px;display:block;clear:both}#solves-graph{display:block;height:350px}#keys-pie-graph{height:400px;display:block}#categories-pie-graph{height:400px;display:block}#solve-percentages-graph{height:400px;display:block}.no-decoration{color:inherit !important;text-decoration:none !important}.no-decoration:hover{color:inherit !important;text-decoration:none !important}.table td,.table th{vertical-align:inherit}pre{white-space:pre-wrap;margin:0;padding:0}.form-control{position:relative;display:block;border-radius:0;font-weight:400;font-family:"Avenir Next", "Helvetica Neue", Helvetica, Arial, sans-serif;-webkit-appearance:none}tbody tr:hover{background-color:rgba(0,0,0,0.1) !important}[data-href]{cursor:pointer}.sort-col{cursor:pointer}input[type="checkbox"]{cursor:pointer}
 

CTFd/themes/admin/static/css/admin.min.css

@@ -1 +1 @@
-html{position:relative;min-height:100%}body{margin-bottom:60px}.footer{position:absolute;bottom:1px;width:100%;height:60px;line-height:normal!important;z-index:-20}#score-graph{height:450px;display:block;clear:both}#solves-graph{display:block;height:350px}#categories-pie-graph,#keys-pie-graph,#solve-percentages-graph{height:400px;display:block}.no-decoration,.no-decoration:hover{color:inherit!important;text-decoration:none!important}.table td,.table th{vertical-align:inherit}pre{white-space:pre-wrap;margin:0;padding:0}.form-control{position:relative;display:block;border-radius:0;font-weight:400;font-family:Avenir Next,Helvetica Neue,Helvetica,Arial,sans-serif;-webkit-appearance:none}tbody tr:hover{background-color:rgba(0,0,0,.1)!important}.sort-col,input[type=checkbox],tr[data-href]{cursor:pointer}
+html{position:relative;min-height:100%}body{margin-bottom:60px}.footer{position:absolute;bottom:1px;width:100%;height:60px;line-height:normal!important;z-index:-20}#score-graph{height:450px;display:block;clear:both}#solves-graph{display:block;height:350px}#categories-pie-graph,#keys-pie-graph,#solve-percentages-graph{height:400px;display:block}.no-decoration,.no-decoration:hover{color:inherit!important;text-decoration:none!important}.table td,.table th{vertical-align:inherit}pre{white-space:pre-wrap;margin:0;padding:0}.form-control{position:relative;display:block;border-radius:0;font-weight:400;font-family:Avenir Next,Helvetica Neue,Helvetica,Arial,sans-serif;-webkit-appearance:none}tbody tr:hover{background-color:rgba(0,0,0,.1)!important}.sort-col,[data-href],input[type=checkbox]{cursor:pointer}

CTFd/themes/admin/static/js/core.dev.js

@@ -20,7 +20,7 @@ eval("\n\nvar _CTFd = _interopRequireDefault(__webpack_require__(/*! core/CTFd *
 /***/ (function(module, exports, __webpack_require__) {
 
 ;
-eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nexports.default = void 0;\n\n__webpack_require__(/*! bootstrap/dist/js/bootstrap.bundle */ \"./node_modules/bootstrap/dist/js/bootstrap.bundle.js\");\n\nvar _utils = __webpack_require__(/*! core/utils */ \"./CTFd/themes/core/assets/js/utils.js\");\n\nvar _jquery = _interopRequireDefault(__webpack_require__(/*! jquery */ \"./node_modules/jquery/dist/jquery.js\"));\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nvar _default = function _default() {\n  // TODO: This is kind of a hack to mimic a React-like state construct.\n  // It should be removed once we have a real front-end framework in place.\n  (0, _jquery.default)(\":input\").each(function () {\n    (0, _jquery.default)(this).data(\"initial\", (0, _jquery.default)(this).val());\n  });\n  (0, _jquery.default)(\".form-control\").bind({\n    focus: function focus() {\n      (0, _jquery.default)(this).addClass(\"input-filled-valid\");\n    },\n    blur: function blur() {\n      if ((0, _jquery.default)(this).val() === \"\") {\n        (0, _jquery.default)(this).removeClass(\"input-filled-valid\");\n      }\n    }\n  });\n  (0, _jquery.default)(\".modal\").on(\"show.bs.modal\", function (e) {\n    (0, _jquery.default)(\".form-control\").each(function () {\n      if ((0, _jquery.default)(this).val()) {\n        (0, _jquery.default)(this).addClass(\"input-filled-valid\");\n      }\n    });\n  });\n  (0, _jquery.default)(function () {\n    (0, _jquery.default)(\".form-control\").each(function () {\n      if ((0, _jquery.default)(this).val()) {\n        (0, _jquery.default)(this).addClass(\"input-filled-valid\");\n      }\n    });\n    (0, _jquery.default)(\"tr[data-href]\").click(function () {\n      var sel = getSelection().toString();\n\n      if (!sel) {\n        var href = (0, _jquery.default)(this).attr(\"data-href\");\n\n        if (href) {\n          window.location = href;\n        }\n      }\n\n      return false;\n    });\n    (0, _jquery.default)(\"[data-checkbox]\").click(function (e) {\n      if ((0, _jquery.default)(e.target).is(\"input[type=checkbox]\")) {\n        e.stopImmediatePropagation();\n        return;\n      }\n\n      var checkbox = (0, _jquery.default)(this).find(\"input[type=checkbox]\"); // Doing it this way with an event allows data-checkbox-all to work\n\n      checkbox.click();\n      e.stopImmediatePropagation();\n    });\n    (0, _jquery.default)(\"[data-checkbox-all]\").on(\"click change\", function (e) {\n      var checked = (0, _jquery.default)(this).prop(\"checked\");\n      var idx = (0, _jquery.default)(this).index() + 1;\n      (0, _jquery.default)(this).closest(\"table\").find(\"tr td:nth-child(\".concat(idx, \") input[type=checkbox]\")).prop(\"checked\", checked);\n      e.stopImmediatePropagation();\n    });\n    (0, _jquery.default)(\"tr[data-href] a, tr[data-href] button\").click(function (e) {\n      // TODO: This is a hack to allow modal close buttons to work\n      if (!(0, _jquery.default)(this).attr(\"data-dismiss\")) {\n        e.stopPropagation();\n      }\n    });\n    (0, _jquery.default)(\".page-select\").change(function () {\n      var url = new URL(window.location);\n      url.searchParams.set(\"page\", this.value);\n      window.location.href = url.toString();\n    });\n    (0, _jquery.default)('a[data-toggle=\"tab\"]').on(\"shown.bs.tab\", function (e) {\n      sessionStorage.setItem(\"activeTab\", (0, _jquery.default)(e.target).attr(\"href\"));\n    });\n    var activeTab = sessionStorage.getItem(\"activeTab\");\n\n    if (activeTab) {\n      var target = (0, _jquery.default)(\".nav-tabs a[href=\\\"\".concat(activeTab, \"\\\"], .nav-pills a[href=\\\"\").concat(activeTab, \"\\\"]\"));\n\n      if (target.length) {\n        target.tab(\"show\");\n      } else {\n        sessionStorage.removeItem(\"activeTab\");\n      }\n    }\n\n    (0, _utils.makeSortableTables)();\n    (0, _jquery.default)('[data-toggle=\"tooltip\"]').tooltip();\n  });\n};\n\nexports.default = _default;\n\n//# sourceURL=webpack:///./CTFd/themes/admin/assets/js/styles.js?");
+eval("\n\nObject.defineProperty(exports, \"__esModule\", {\n  value: true\n});\nexports.default = void 0;\n\n__webpack_require__(/*! bootstrap/dist/js/bootstrap.bundle */ \"./node_modules/bootstrap/dist/js/bootstrap.bundle.js\");\n\nvar _utils = __webpack_require__(/*! core/utils */ \"./CTFd/themes/core/assets/js/utils.js\");\n\nvar _jquery = _interopRequireDefault(__webpack_require__(/*! jquery */ \"./node_modules/jquery/dist/jquery.js\"));\n\nfunction _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }\n\nvar _default = function _default() {\n  // TODO: This is kind of a hack to mimic a React-like state construct.\n  // It should be removed once we have a real front-end framework in place.\n  (0, _jquery.default)(\":input\").each(function () {\n    (0, _jquery.default)(this).data(\"initial\", (0, _jquery.default)(this).val());\n  });\n  (0, _jquery.default)(\".form-control\").bind({\n    focus: function focus() {\n      (0, _jquery.default)(this).addClass(\"input-filled-valid\");\n    },\n    blur: function blur() {\n      if ((0, _jquery.default)(this).val() === \"\") {\n        (0, _jquery.default)(this).removeClass(\"input-filled-valid\");\n      }\n    }\n  });\n  (0, _jquery.default)(\".modal\").on(\"show.bs.modal\", function (e) {\n    (0, _jquery.default)(\".form-control\").each(function () {\n      if ((0, _jquery.default)(this).val()) {\n        (0, _jquery.default)(this).addClass(\"input-filled-valid\");\n      }\n    });\n  });\n  (0, _jquery.default)(function () {\n    (0, _jquery.default)(\".form-control\").each(function () {\n      if ((0, _jquery.default)(this).val()) {\n        (0, _jquery.default)(this).addClass(\"input-filled-valid\");\n      }\n    });\n    (0, _jquery.default)(\"tr[data-href], td[data-href]\").click(function () {\n      var sel = getSelection().toString();\n\n      if (!sel) {\n        var href = (0, _jquery.default)(this).attr(\"data-href\");\n\n        if (href) {\n          window.location = href;\n        }\n      }\n\n      return false;\n    });\n    (0, _jquery.default)(\"[data-checkbox]\").click(function (e) {\n      if ((0, _jquery.default)(e.target).is(\"input[type=checkbox]\")) {\n        e.stopImmediatePropagation();\n        return;\n      }\n\n      var checkbox = (0, _jquery.default)(this).find(\"input[type=checkbox]\"); // Doing it this way with an event allows data-checkbox-all to work\n\n      checkbox.click();\n      e.stopImmediatePropagation();\n    });\n    (0, _jquery.default)(\"[data-checkbox-all]\").on(\"click change\", function (e) {\n      var checked = (0, _jquery.default)(this).prop(\"checked\");\n      var idx = (0, _jquery.default)(this).index() + 1;\n      (0, _jquery.default)(this).closest(\"table\").find(\"tr td:nth-child(\".concat(idx, \") input[type=checkbox]\")).prop(\"checked\", checked);\n      e.stopImmediatePropagation();\n    });\n    (0, _jquery.default)(\"tr[data-href] a, tr[data-href] button\").click(function (e) {\n      // TODO: This is a hack to allow modal close buttons to work\n      if (!(0, _jquery.default)(this).attr(\"data-dismiss\")) {\n        e.stopPropagation();\n      }\n    });\n    (0, _jquery.default)(\".page-select\").change(function () {\n      var url = new URL(window.location);\n      url.searchParams.set(\"page\", this.value);\n      window.location.href = url.toString();\n    });\n    (0, _jquery.default)('a[data-toggle=\"tab\"]').on(\"shown.bs.tab\", function (e) {\n      sessionStorage.setItem(\"activeTab\", (0, _jquery.default)(e.target).attr(\"href\"));\n    });\n    var activeTab = sessionStorage.getItem(\"activeTab\");\n\n    if (activeTab) {\n      var target = (0, _jquery.default)(\".nav-tabs a[href=\\\"\".concat(activeTab, \"\\\"], .nav-pills a[href=\\\"\").concat(activeTab, \"\\\"]\"));\n\n      if (target.length) {\n        target.tab(\"show\");\n      } else {\n        sessionStorage.removeItem(\"activeTab\");\n      }\n    }\n\n    (0, _utils.makeSortableTables)();\n    (0, _jquery.default)('[data-toggle=\"tooltip\"]').tooltip();\n  });\n};\n\nexports.default = _default;\n\n//# sourceURL=webpack:///./CTFd/themes/admin/assets/js/styles.js?");
 
 /***/ }),
 

CTFd/themes/admin/templates/teams/team.html

@@ -205,13 +205,13 @@
 				</thead>
 				<tbody>
 				{% for member in members %}
-					<tr data-href="{{ url_for('admin.users_detail', user_id=member.id) }}">
+					<tr>
-						<td class="text-center">
+						<td class="text-center" data-href="{{ url_for('admin.users_detail', user_id=member.id) }}">
 							{% if team.captain_id == member.id %}
 								<span class="badge badge-primary">Captain</span>
 							{% endif %}
 						</td>
-						<td class="text-left">
+						<td class="text-left" data-href="{{ url_for('admin.users_detail', user_id=member.id) }}">
 							<a href="{{ url_for('admin.users_detail', user_id=member.id) }}">
 								{{ member.name }}
 							</a>