From eef5069ede01a10a4301b0c4276a80a4dd689ae9 Mon Sep 17 00:00:00 2001
From: LianaHus <liana@ethdev.com>
Date: Wed, 29 Jul 2020 11:04:09 +0200
Subject: [PATCH] corrected the style of "Pubish to IPFS" checkbox

---
 .../src/app/tabs/runTab/contractDropdown.js     | 17 ++++++++++++-----
 .../src/app/tabs/styles/run-tab-styles.js       |  3 +++
 2 files changed, 15 insertions(+), 5 deletions(-)

diff --git a/apps/remix-ide/src/app/tabs/runTab/contractDropdown.js b/apps/remix-ide/src/app/tabs/runTab/contractDropdown.js
index 925719ea44..0f44391260 100644
--- a/apps/remix-ide/src/app/tabs/runTab/contractDropdown.js
+++ b/apps/remix-ide/src/app/tabs/runTab/contractDropdown.js
@@ -92,16 +92,23 @@ class ContractDropdownUI {
     const savedConfig = window.localStorage.getItem(`ipfs/${this.exEnvironment}/${this.networkName}`)
     this.ipfsCheckedState = savedConfig === 'true' ? true : false // eslint-disable-line
 
-    this.ipfsCheckbox = this.ipfsCheckedState === true
-    ? yo`<input id="deployAndRunPublishToIPFS" data-id="contractDropdownIpfsCheckbox" class="mr-2" checked type="checkbox" onchange=${this.toggleCheckedState.bind(this)} >`
-    : yo`<input id="deployAndRunPublishToIPFS" data-id="contractDropdownIpfsCheckbox" class="mr-2" type="checkbox" onchange=${this.toggleCheckedState.bind(this)} >`
+    this.ipfsCheckbox = yo`
+      <input
+      id="deployAndRunPublishToIPFS"
+      data-id="contractDropdownIpfsCheckbox"
+      class="form-check-input custom-control-input"
+      type="checkbox"
+      onchange=${() => this.toggleCheckedState.bind()}
+      >
+    `
+    if (this.ipfsCheckedState) this.ipfsCheckbox.checked = true
 
     this.deployCheckBox = yo`
-      <div class="mt-2 d-flex align-items-start">
+      <div class="d-flex py-1 align-items-center custom-control custom-checkbox">
         ${this.ipfsCheckbox}
         <label
           for="deployAndRunPublishToIPFS"
-          class="p-0 m-0"
+          class="m-0 form-check-label custom-control-label ${css.checkboxAlign}"
           title="Publishing the source code and ABI to IPFS facilitates source code verification and will greatly foster contract adoption (auditing, debugging, calling it, etc...)"
         >
           PUBLISH TO IPFS
diff --git a/apps/remix-ide/src/app/tabs/styles/run-tab-styles.js b/apps/remix-ide/src/app/tabs/styles/run-tab-styles.js
index 8d93dd92fd..357464372f 100644
--- a/apps/remix-ide/src/app/tabs/styles/run-tab-styles.js
+++ b/apps/remix-ide/src/app/tabs/styles/run-tab-styles.js
@@ -216,6 +216,9 @@ var css = csjs`
     text-align: center;
     text-transform: uppercase;
   }
+  .checkboxAlign {
+    padding-top: 2px;
+  }
 `
 
 module.exports = css