Added hero components projection for good hero stat comparison bars. Fixed overflow/scrolling on code language selector for play-heroes-modal.

app/styles/play/modal/play-heroes-modal.sass

@@ -264,7 +264,6 @@ $heroCanvasHeight: 265px
         
       .trigger, .options
         background-color: rgb(239,232,217)
-        width: 100%
         color: black
         
       .trigger
@@ -272,6 +271,7 @@ $heroCanvasHeight: 265px
         border: 3px solid black
         font-size: 16px
         padding: 5px 10px
+        width: 100%
         
         //- the little triangle on the right side of the fancy select box
         &:after
@@ -282,6 +282,7 @@ $heroCanvasHeight: 265px
 
       .options
         padding-left: 5px
+        overflow: visible
 
         .selected
           color: black
@@ -295,6 +296,7 @@ $heroCanvasHeight: 265px
           padding-left: 40px
           background: transparent url(/images/common/code_languages/javascript_small.png) no-repeat left center
           background-size: 32px 32px
+          margin-bottom: -1px
 
           &[data-value="python"]
             background-image: url(/images/common/code_languages/python_small.png)

app/views/play/modal/PlayHeroesModal.coffee

@@ -27,7 +27,7 @@ module.exports = class PlayHeroesModal extends ModalView
     @confirmButtonI18N = options.confirmButtonI18N ? "common.save"
     @heroes = new CocoCollection([], {model: ThangType})
     @heroes.url = '/db/thang.type?view=heroes'
-    @heroes.setProjection ['original','name','slug','soundTriggers','featureImage','gems','heroClass','description']
+    @heroes.setProjection ['original','name','slug','soundTriggers','featureImage','gems','heroClass','description','components']
     @listenToOnce @heroes, 'sync', @onHeroesLoaded
     @supermodel.loadCollection(@heroes, 'heroes')
     @stages = {}
@@ -204,6 +204,3 @@ module.exports = class PlayHeroesModal extends ModalView
       createjs.Ticker.removeEventListener "tick", stage
       stage.removeAllChildren()
     super()
-
-
-