Updated endpoint detail view style closer to sketch.

Refactored style to use CSS Flex instead of float.

src/components/CloudConnectionDetail/CloudConnectionDetail.js

@@ -178,8 +178,6 @@ class CloudConnectionDetail extends Component {
                 <Moment format="MM/DD/YYYY HH:mm" date={createdAt} />
               </div>
             </div>
-          </div>
-          <div className={s.container}>
             {this.renderAuthFields()}
           </div>
         </div>

src/components/CloudConnectionDetail/CloudConnectionDetail.scss

@@ -29,6 +29,9 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
 
 .container {
   margin: 0 auto;
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: center;
   &:after {
     clear: both;
     height: 0;
@@ -36,20 +39,16 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
     content: ' ';
   }
 }
-.columnLeft, .columnRight {
-  width: 50%;
-  float: left;
-}
 .formGroup {
   margin-bottom: 32px;
+  flex-grow: 1;
   width: 50%;
-  float: left;
   .title {
-    font-weight: $weight-semibold;
+    font-weight: $weight-regular;
     font-size: 10px;
-    color: $gray-dark;
+    color: $gray;
     text-transform: uppercase;
-    margin-bottom: 8px;
+    margin-bottom: 2px;
   }
   .titleIp {
     font-weight: $weight-semibold;

src/components/CloudConnectionsView/CloudConnectionsView.js

@@ -228,7 +228,7 @@ class CloudConnectionsView extends Component {
                   <button onClick={(e) => this.validateConnection(e)}>Validate Endpoint</button>
                 </div>
                 <div className={s.rightSide}>
-                  <button onClick={(e) => this.deleteConnection(e)} className="wire" style={{ float: "right" }}>
+                  <button onClick={(e) => this.deleteConnection(e)} className="wire red" style={{ float: "right" }}>
                     Delete
                   </button>
                 </div>

src/components/CloudConnectionsView/CloudConnectionsView.scss

@@ -116,6 +116,7 @@ $connectionHeaderBg: #D9DCE3;
 }
 
 .buttons {
+  margin-top: 16px;
   button {
     margin-bottom: 16px;
   }