Add overlays for environment picker

src/assets/stylesheets/hub-create.scss

@@ -41,7 +41,6 @@
   }
 }
 
-
 .create-panel__form__name {
   @extend %rounded-border;
   @extend %default-font;
@@ -171,3 +170,19 @@
   top: -3%;
   left: -3%;
 }
+
+.create-panel__form__environment__picker__labels {
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  top: 0;
+  left: 0;
+}
+
+.create-panel__form__environment__picker__controls {
+  position: absolute;
+  width: 100%;
+  height: 100%;
+  top: 0;
+  left: 0;
+}

src/react-components/hub-create-panel.js

@@ -18,7 +18,7 @@ class HubCreatePanel extends Component {
     this.state = {
       name: generateHubName(),
       environmentIndex: Math.floor(Math.random() * props.environments.length),
-      expanded: false
+      expanded: true
     };
   }
 
@@ -117,6 +117,8 @@ class HubCreatePanel extends Component {
               <div className="create-panel__form__environment">
                 <div className="create-panel__form__environment__picker">
                   <img className="create-panel__form__environment__picker__image" srcSet={environmentImageSrcSet} />
+                  <div className="create-panel__form__environment__picker__labels">labels</div>
+                  <div className="create-panel__form__environment__picker__controls">controls</div>
                 </div>
               </div>
             )}