Fix checkbox alignment

Author: tim-soft

src/components/DatBoolean.js

@@ -57,11 +57,13 @@ export default class DatBoolean extends Component {
           <span className="label-text" style={{ width: labelWidth }}>
             {labelText}
           </span>
-          <input
-            type="checkbox"
-            checked={this.state.value}
-            onChange={this.handleChange}
-          />
+          <span className="checkbox-container">
+            <input
+              type="checkbox"
+              checked={this.state.value}
+              onChange={this.handleChange}
+            />
+          </span>
         </label>
       </li>
     );

src/style/_boolean.scss

@@ -11,7 +11,12 @@
     padding: 5px 0;
   }
 
+  .checkbox-container {
+    width: 100%;
+  }
+
   input[type='checkbox'] {
     margin: 0;
+    vertical-align: middle;
   }
 }