diff --git a/app/pods/components/delete-button/component.js b/app/pods/components/delete-button/component.js
index 2ceca5b..1cd364a 100644
--- a/app/pods/components/delete-button/component.js
+++ b/app/pods/components/delete-button/component.js
@@ -2,10 +2,13 @@ import Ember from 'ember';
 
 export default Ember.Component.extend({
   tagName: 'button',
-  classNames: ["button-red", "smaller"],
+  classNames: ["button-red", "smaller", "delete"],
+  showConfirmDelete: false,
 
   click: function() {
-    if (window.confirm("Do you really want to delete this?")) {
+    if (!this.get('showConfirmDelete')) {
+      this.set('showConfirmDelete', true);
+    } else {
       this.attrs.delete();
     }
   },
diff --git a/app/pods/components/delete-button/template.hbs b/app/pods/components/delete-button/template.hbs
index 4b2e04f..de6c612 100644
--- a/app/pods/components/delete-button/template.hbs
+++ b/app/pods/components/delete-button/template.hbs
@@ -1 +1,5 @@
-Delete
+{{#if showConfirmDelete}}
+  Are you sure?
+{{else}}
+  Delete
+{{/if}}