3 files changed, 39 insertions, 4 deletions
diff --git a/server/src/Design/Modal.hs b/server/src/Design/Modal.hs
index ce427c0..2677fd8 100644
--- a/server/src/Design/Modal.hs
+++ b/server/src/Design/Modal.hs
@@ -2,9 +2,11 @@ module Design.Modal
   ( design
   ) where
 
-import           Data.Monoid ((<>))
-
 import           Clay
+import           Data.Monoid                ((<>))
+
+import qualified Design.View.Payment.Add    as Add
+import qualified Design.View.Payment.Delete as Delete
 
 design :: Css
 design = do
@@ -31,6 +33,9 @@ design = do
     sym borderRadius (px 5)
     boxShadow (px 0) (px 0) (px 15) (rgba 0 0 0 0.5)
 
+    ".add" ? Add.design
+    ".delete" ? Delete.design
+
   ".paymentModal" & do
     ".radioGroup" ? ".title" ? display none
     ".selectInput" ? do
diff --git a/server/src/Design/View/Payment.hs b/server/src/Design/View/Payment.hs
index 2102ff8..0d59fa0 100644
--- a/server/src/Design/View/Payment.hs
+++ b/server/src/Design/View/Payment.hs
@@ -4,7 +4,6 @@ module Design.View.Payment
 
 import           Clay
 
-import qualified Design.View.Payment.Add    as Add
 import qualified Design.View.Payment.Header as Header
 import qualified Design.View.Payment.Pages  as Pages
 import qualified Design.View.Payment.Table  as Table
@@ -12,6 +11,5 @@ import qualified Design.View.Payment.Table  as Table
 design :: Css
 design = do
   ".header" ? Header.design
-  ".add" ? Add.design
   ".table" ? Table.design
   ".pages" ? Pages.design
diff --git a/server/src/Design/View/Payment/Delete.hs b/server/src/Design/View/Payment/Delete.hs
new file mode 100644
index 0000000..5597f5b
--- /dev/null
+++ b/server/src/Design/View/Payment/Delete.hs
@@ -0,0 +1,32 @@
+module Design.View.Payment.Delete
+  ( design
+  ) where
+
+import           Clay
+
+import qualified Design.Color     as Color
+import qualified Design.Constants as Constants
+import qualified Design.Helper    as Helper
+
+design :: Css
+design = do
+  ".deleteHeader" ? do
+    backgroundColor Color.chestnutRose
+    fontSize (px 18)
+    color Color.white
+    sym padding (px 20)
+    textAlign (alignSide sideCenter)
+    borderRadius (px 5) (px 5) (px 0) (px 0)
+
+  ".deleteContent" ? do
+    sym padding (px 20)
+
+    ".buttons" ? do
+      display flex
+      justifyContent spaceAround
+      marginTop (em 1.5)
+
+      ".confirm" ?
+        Helper.button Color.chestnutRose Color.white (px Constants.inputHeight) Constants.focusLighten
+      ".undo" ?
+        Helper.button Color.silver Color.white (px Constants.inputHeight) Constants.focusLighten