- Fixes layout bugs, adds description to connection view header

src/components/App/App.scss

@@ -76,7 +76,7 @@ html {
   }
   h2 {
     font-weight: $weight-light;
-    font-size: 32px;
+    font-size: 30px;
     color: $black;
     letter-spacing: -0.81px;
     margin: 0;
@@ -400,7 +400,14 @@ button {
 :global(.Dropdown-option.is-selected) {
   font-weight: 500;
 }
-
+:global(.detailViewHead) {
+  p {
+    margin: 0;
+    font-size: 14px;
+    color: $gray-dark;
+    letter-spacing: 0;
+  }
+}
 :global(.category-filter) {
   margin-bottom: 40px;
   a {

src/components/CloudConnectionsView/CloudConnectionsView.js

@@ -136,12 +136,13 @@ class CloudConnectionsView extends Component {
       return (
         <div className={s.root}>
           <Header title={title} linkUrl="/cloud-endpoints"/>
-          <div className={s.connectionHead}>
+          <div className={s.connectionHead + " detailViewHead"}>
             <div className={s.container}>
               <div className="backBtn" onClick={(e) => this.goBack(e)}></div>
               <div className={s.connectionTypeImg + " icon endpoint-white "}></div>
               <div className={s.connectionInfo}>
                 <h2>{item.name}</h2>
+                <p>{item.description}</p>
               </div>
             </div>
           </div>

src/components/CloudConnectionsView/CloudConnectionsView.scss

@@ -26,9 +26,6 @@ $connectionHeaderBg: #D9DCE3;
   background-color: $connectionHeaderBg;
   margin-top: 64px;
   padding: 16px;
-  h2 {
-    margin-top: 8px;
-  }
   .connectionTypeImg {
     margin-right: 64px;
     float: left;

src/components/WizardVms/WizardVms.scss

@@ -33,6 +33,7 @@ along with this program.  If not, see <http://www.gnu.org/licenses/>.
     :global(.item) {
       position: relative;
       cursor: pointer;
+      padding-left: 0;
       span:nth-child(2) {
         flex: 2;
       }