From 3bd35530587ef543181c2c094fc35635741a7143 Mon Sep 17 00:00:00 2001
From: thecodrr <thecodrr@protonmail.com>
Date: Mon, 6 Apr 2020 11:36:49 +0500
Subject: [PATCH] ui: increase margins between colors in properties

---
 apps/web/src/components/properties/index.js | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/apps/web/src/components/properties/index.js b/apps/web/src/components/properties/index.js
index a9bebc740..19f3bd3d0 100644
--- a/apps/web/src/components/properties/index.js
+++ b/apps/web/src/components/properties/index.js
@@ -105,15 +105,16 @@ function Properties() {
               ))}
             </Flex>
             <Button color="static">Add to notebook</Button>
-            <Flex flexDirection="column" sx={{ my: 2 }}>
+            <Flex flexDirection="column">
               {objectMap(COLORS, (label, code) => (
                 <Flex
                   justifyContent="space-between"
                   alignItems="center"
                   onClick={() => setColor(label)}
                   sx={{ cursor: "pointer" }}
+                  mt={4}
                 >
-                  <Flex key={label} my={1}>
+                  <Flex key={label}>
                     <Icon.Circle size={24} color={code} />
                     <Text ml={1} color="text">
                       {toTitleCase(label)}
@@ -128,7 +129,7 @@ function Properties() {
 
             <Input
               placeholder="#tag"
-              sx={{ marginBottom: 2 }}
+              mt={4}
               onKeyUp={(event) => {
                 if (
                   event.key === "Enter" ||