1 files changed, 4 insertions, 2 deletions
diff --git a/app/assets/javascripts/pages/dashboard/todos/index/todos.js b/app/assets/javascripts/pages/dashboard/todos/index/todos.js
index e45a40bd44c..b6f42a27002 100644
--- a/app/assets/javascripts/pages/dashboard/todos/index/todos.js
+++ b/app/assets/javascripts/pages/dashboard/todos/index/todos.js
@@ -140,10 +140,10 @@ export default class Todos {
       restoreBtn.classList.add('hidden');
       doneBtn.classList.remove('hidden');
     } else if (target === doneBtn) {
-      row.classList.add('done-reversible');
+      row.classList.add('done-reversible', 'gl-bg-gray-50', 'gl-border-gray-100');
       restoreBtn.classList.remove('hidden');
     } else if (target === restoreBtn) {
-      row.classList.remove('done-reversible');
+      row.classList.remove('done-reversible', 'gl-bg-gray-50', 'gl-border-gray-100');
       doneBtn.classList.remove('hidden');
     } else {
       row.parentNode.removeChild(row);
@@ -200,9 +200,11 @@ export default class Todos {
     });
 
     document.dispatchEvent(event);
+    // eslint-disable-next-line no-unsanitized/property
     document.querySelector('.js-todos-pending .js-todos-badge').innerHTML = addDelimiter(
       data.count,
     );
+    // eslint-disable-next-line no-unsanitized/property
     document.querySelector('.js-todos-done .js-todos-badge').innerHTML = addDelimiter(
       data.done_count,
     );