diff --git a/Makefile b/Makefile
index 37c5b3b..765c348 100644
--- a/Makefile
+++ b/Makefile
@@ -37,7 +37,7 @@ main.js: main.bundle.js
 	$(Q)npx babel --minified main.bundle.js -o main.js
 
 
-main.bundle.js: client/index.ls client/authd.ls client/bulma.ls client/card.ls client/modal.ls client/project.ls client/TaskCreationModal.ls client/task.ls client/task-removal-modal.ls client/todowebsocket.ls client/validation-modal.ls  
+main.bundle.js: client/index.ls client/authd.ls client/bulma.ls client/card.ls client/modal.ls client/project.ls client/task-creation-modal.ls client/task.ls client/task-removal-modal.ls client/todowebsocket.ls client/validation-modal.ls  
 	@echo '  BUN >   main.bundle.js'
 	$(Q)npx browserify -t browserify-livescript client/index.ls -o main.bundle.js
 
@@ -121,7 +121,7 @@ $(PACKAGE)-$(VERSION).tar.gz: distdir
 		$(PACKAGE)-$(VERSION)/client/card.ls \
 		$(PACKAGE)-$(VERSION)/client/modal.ls \
 		$(PACKAGE)-$(VERSION)/client/project.ls \
-		$(PACKAGE)-$(VERSION)/client/TaskCreationModal.ls \
+		$(PACKAGE)-$(VERSION)/client/task-creation-modal.ls \
 		$(PACKAGE)-$(VERSION)/client/task.ls \
 		$(PACKAGE)-$(VERSION)/client/task-removal-modal.ls \
 		$(PACKAGE)-$(VERSION)/client/todowebsocket.ls \
@@ -139,7 +139,7 @@ $(PACKAGE)-$(VERSION).tar.xz: distdir
 		$(PACKAGE)-$(VERSION)/client/card.ls \
 		$(PACKAGE)-$(VERSION)/client/modal.ls \
 		$(PACKAGE)-$(VERSION)/client/project.ls \
-		$(PACKAGE)-$(VERSION)/client/TaskCreationModal.ls \
+		$(PACKAGE)-$(VERSION)/client/task-creation-modal.ls \
 		$(PACKAGE)-$(VERSION)/client/task.ls \
 		$(PACKAGE)-$(VERSION)/client/task-removal-modal.ls \
 		$(PACKAGE)-$(VERSION)/client/todowebsocket.ls \
@@ -157,7 +157,7 @@ $(PACKAGE)-$(VERSION).tar.bz2: distdir
 		$(PACKAGE)-$(VERSION)/client/card.ls \
 		$(PACKAGE)-$(VERSION)/client/modal.ls \
 		$(PACKAGE)-$(VERSION)/client/project.ls \
-		$(PACKAGE)-$(VERSION)/client/TaskCreationModal.ls \
+		$(PACKAGE)-$(VERSION)/client/task-creation-modal.ls \
 		$(PACKAGE)-$(VERSION)/client/task.ls \
 		$(PACKAGE)-$(VERSION)/client/task-removal-modal.ls \
 		$(PACKAGE)-$(VERSION)/client/todowebsocket.ls \
diff --git a/client/card.ls b/client/card.ls
new file mode 100644
index 0000000..c254e82
--- /dev/null
+++ b/client/card.ls
@@ -0,0 +1,41 @@
+
+h = require 'maquette' .h
+
+TaskCard = (key, head-left, head-content, content, on-click) ->
+	self = {
+		key: key
+		head-left: head-left
+		head-content: head-content
+		content: content
+		modal: void
+	}
+
+	self.render = ->
+		h \div.card { key: self.key } [
+			h \div.card-content [
+				h \div.media [
+					h \div.media-left [
+						self.head-left
+					]
+					h \div.media-content [
+						self.head-content
+					]
+				]
+
+				h \div.content [
+					self.title
+					h \div.button {
+						onclick: -> on-click!
+							modal := TaskCreationModal project.id, todod-ws, self
+					} [ "Edit" ]
+
+					if self.modal
+						self.modal.render!
+				]
+			]
+		]
+
+	self
+
+
+module.exports = Card
diff --git a/client/project.ls b/client/project.ls
index d864294..c69bb26 100644
--- a/client/project.ls
+++ b/client/project.ls
@@ -3,7 +3,7 @@ h     = require 'maquette' .h
 bulma = require "./bulma.ls"
 Task  = require "./task.ls"
 Modal = require './modal.ls'
-TaskCreationModal = require './TaskCreationModal.ls'
+TaskCreationModal = require './task-creation-modal.ls'
 
 Project = (self, todod-ws) ->
 	self.todod-ws = todod-ws
diff --git a/client/task-creation-modal.ls b/client/task-creation-modal.ls
new file mode 100644
index 0000000..40d2d36
--- /dev/null
+++ b/client/task-creation-modal.ls
@@ -0,0 +1,45 @@
+
+h = require 'maquette' .h
+Modal = require './modal.ls'
+
+TaskCreationModal = (project-id, todod-ws, task) ->
+	task ||= {}
+
+	self = {
+		title: task.title || ""
+		description: task.description || ""
+	}
+
+	modal = Modal {
+		+visible
+		content: h \div.form [
+			h \input.input {
+				value: self.title
+				oninput: (e) ->
+					self.title := e.target.value
+			}
+
+			h \textarea {
+				value: self.description
+				oninput: (e) ->
+					self.description := e.target.value
+			}
+		]
+		on-validation: ->
+			if task.id
+				todod-ws.edit-task task.id, {
+					title: self.title
+					description: self.description
+				}
+			else
+				todod-ws.add-task project-id, self.title, {
+					description: self.description
+				}
+	}
+
+	self.render = ->
+		modal.render!
+
+	self
+
+module.exports = TaskCreationModal
diff --git a/client/task-removal-modal.ls b/client/task-removal-modal.ls
new file mode 100644
index 0000000..4964a1b
--- /dev/null
+++ b/client/task-removal-modal.ls
@@ -0,0 +1,28 @@
+
+h = require 'maquette' .h
+Modal = require './modal.ls'
+
+TaskRemovalModal = (project-id, todod-ws, task) ->
+	task ||= {}
+
+	self = {
+		title: task.title || ""
+		description: task.description || ""
+	}
+
+	modal = Modal {
+		+visible
+		content: h \div.is-danger [ "Do you want to remove the task ?" ]
+
+		on-validation: ->
+			if task.id
+				todod-ws.remove-task task.id
+	}
+
+	self.render = ->
+		modal.render!
+
+	self
+
+
+module.exports = TaskRemovalModal
diff --git a/client/task.ls b/client/task.ls
index 7175fa7..977dce7 100644
--- a/client/task.ls
+++ b/client/task.ls
@@ -5,7 +5,7 @@
 h     = require 'maquette' .h
 bulma = require "./bulma.ls"
 nmd   = require "nano-markdown"
-TaskCreationModal = require './TaskCreationModal.ls'
+TaskCreationModal = require './task-creation-modal.ls'
 TaskRemovalModal = require './task-removal-modal.ls'
 
 #
diff --git a/client/validation-modal.ls b/client/validation-modal.ls
new file mode 100644
index 0000000..68df480
--- /dev/null
+++ b/client/validation-modal.ls
@@ -0,0 +1,16 @@
+
+h = require 'maquette' .h
+Modal = require './modal.ls'
+
+
+# ValidationModal = (args) ->
+# 	m = Modal (args)
+# 	m.result = void
+# 	m.on-validation = ->
+# 		m.result = true
+# 	m.on-cancellation = ->
+# 		m.result = false
+# 	m
+
+
+module.exports = ValidationModal