From b06b8690902f0004b21937bc615ec115c3590b64 Mon Sep 17 00:00:00 2001
From: Arpit <arpitnath42@gmail.com>
Date: Sun, 5 Sep 2021 10:25:30 +0530
Subject: [PATCH] Alignment issue fixed: checkbox widget (#677)

---
 frontend/src/Editor/Components/Checkbox.jsx  | 23 ++++++++++----------
 frontend/src/Editor/Components/components.js |  2 +-
 2 files changed, 13 insertions(+), 12 deletions(-)

diff --git a/frontend/src/Editor/Components/Checkbox.jsx b/frontend/src/Editor/Components/Checkbox.jsx
index cfe8205632..873b24c53d 100644
--- a/frontend/src/Editor/Components/Checkbox.jsx
+++ b/frontend/src/Editor/Components/Checkbox.jsx
@@ -37,18 +37,19 @@ export const Checkbox = function Checkbox({
   }
 
   return (
-    <div style={{ width, height, display:parsedWidgetVisibility ? '' : 'none' }} onClick={event => {event.stopPropagation(); onComponentClick(id, component)}}>
-      <label className="form-check form-check-inline">
-        <input
-          disabled={parsedDisabledState}
-          className="form-check-input"
-          type="checkbox"
-          onClick={(e) => {
-            toggleValue(e);
-          }}
-        />
-        <span className="form-check-label" style={{color: textColor}}>{label}</span>
+    <div className="row" style={{ width, height, display:parsedWidgetVisibility ? '' : 'none' }} onClick={event => {event.stopPropagation(); onComponentClick(id, component)}}>
+      <div className="col py-1">
+        <label className="form-check form-check-inline">
+          <input
+            className="form-check-input"
+            type="checkbox"
+            onClick={(e) => {
+              toggleValue(e);
+            }}
+          />
+          <span className="form-check-label" style={{color: textColor}}>{label}</span>
       </label>
+      </div>
     </div>
   );
 };
diff --git a/frontend/src/Editor/Components/components.js b/frontend/src/Editor/Components/components.js
index 101d3b6c45..b08294a9cf 100644
--- a/frontend/src/Editor/Components/components.js
+++ b/frontend/src/Editor/Components/components.js
@@ -324,7 +324,7 @@ export const componentTypes = [
     component: 'Checkbox',
     defaultSize: {
       width: 200,
-      height: 25,
+      height: 30,
     },
     others: {
       showOnDesktop: { type: 'toggle', displayName: 'Show on desktop? ' },