diff --git a/app/public/css/styles.css b/app/public/css/styles.css
index 88ae4f25b126f28a6563fd6cc8e15b05bb5b4b7b..3fdcf0428e91e1a28b56591b8ce9302c9a614238 100644
--- a/app/public/css/styles.css
+++ b/app/public/css/styles.css
@@ -123,6 +123,10 @@ button.next:disabled {
   margin: 25px auto 50px auto;
   padding: 32px;
 }
+.card.done {
+  background: var(--card-disabled-bg);
+  pointer-events: none;
+}
 .card-header {
   font-size: 24px;
   font-family: "Century Gothic";
diff --git a/app/public/css/theme.css b/app/public/css/theme.css
index 44e6c4190985d5fefef0a0ab4b04768dcf0dc06c..976d7e6cca3eb3d5ab14fa3405f7f3edea5f984c 100644
--- a/app/public/css/theme.css
+++ b/app/public/css/theme.css
@@ -17,6 +17,7 @@
   --base-color: #dedee5;
   --secondary-color: #898989;
   --base-color-alt: #f5f5f7;
+  --card-disabled-bg: #eef3fb;
   --blue: #2a7ae2;
   --white: white;
   --green: #00b13c;
diff --git a/app/src/viewManager.js b/app/src/viewManager.js
index 786c18d618602eef08b71a7c7934ea6621f0518e..c0fc89c628c6ec7da57db1581e38d12b5290b377 100644
--- a/app/src/viewManager.js
+++ b/app/src/viewManager.js
@@ -32,9 +32,13 @@ export default class ViewManager {
       $copyStep.id = step.id;
       $copyStep.classList.add("active");
       $copyStep.classList.remove("inactive");
-      $copyStep.addEventListener("click", async () => {
-        this.executeStep($copyStep, step.name);
-      });
+      const $button = $copyStep.querySelector("button");
+      if ($button) {
+        $button.addEventListener("click", async (event) => {
+          event.stopPropagation();
+          await this.executeStep($button, step.name);
+        });
+      }
       let $processCtn = document.getElementById("process-ctn");
       if ($processCtn) {
         $processCtn.appendChild($copyStep);