From 016501c089eca600477bec0c304eb131cccff526 Mon Sep 17 00:00:00 2001
From: rahmandikahaekal <rahmandikahaekal31@gmail.com>
Date: Wed, 3 Oct 2018 10:55:29 +0700
Subject: [PATCH] redesign ui form

---
 custom.css | 20 ++++++++++++++++++++
 index.html |  3 +--
 2 files changed, 21 insertions(+), 2 deletions(-)
 create mode 100644 custom.css

diff --git a/custom.css b/custom.css
new file mode 100644
index 0000000..f04768c
--- /dev/null
+++ b/custom.css
@@ -0,0 +1,20 @@
+.columns {
+    width: 100%;
+    background-color: #dfe6e9;
+    border-radius: 5px;
+    padding: 20px;
+}
+
+.box {
+    box-shadow: none;
+}
+
+button {
+    background-color: #00b894;
+    color: white;
+    padding: 14px 20px;
+    margin: 8px 0;
+    border: none;
+    border-radius: 4px;
+    cursor: pointer;
+}
\ No newline at end of file
diff --git a/index.html b/index.html
index 1ca0356..f9c71f9 100644
--- a/index.html
+++ b/index.html
@@ -4,6 +4,7 @@
     <meta charset="utf-8">
     <title>JSON Comparator</title>
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.4.2/css/bulma.css">
+    <link rel="stylesheet" href="custom.css">
     <style media="screen">
       #noti{
         display: none;
@@ -27,8 +28,6 @@ <h1 class="title is-1">JSON Comparator</h1>
                   <textarea class="textarea" id="json_a" placeholder="JSON A Here!">{"eiei": {"wow": "bear", "jellato" : "gum"}, "key": "val", "diff_val": "a"}</textarea>
                 </p>
               </div>
-            </div>
-            <div class="column">
               <div class="field">
                 <label class="label">JSON B</label>
                 <p class="control">