mobile friendliness

app/pods/components/music-tab/mixins/helpers.js

@@ -23,7 +23,7 @@ export default Em.Mixin.create({
             if(value === 0) {
               value = 'More';
             } else if(value === 0.25) {
-              value = 'Neutral';
+              value = '';
             } else {
               value = 'Less';
             }

app/pods/components/music-tab/template.hbs

@@ -142,25 +142,25 @@
 <div id="playerBottom" class="row {{if dimmerOn "dimmerOn"}}">
 <div id="beatArea" class="col-sm-7 col-xs-12">
 {{#if usingBeatPreferences}}
-  <span data-toggle="tooltip" data-placement="bottom" data-title="Using the saved sensitivity preference from the last time you listened to this song" class="bootstrapTooltip savedStarTooltip" id="saveBeatPreferencesStar">
+  <span data-toggle="tooltip" data-placement="bottom auto" data-title="Using the saved sensitivity preference from the last time you listened to this song" class="savedStarTooltip" id="saveBeatPreferencesStar">
   {{paper-icon class=dimmerOnClass icon="star"}}
   </span>
 {{/if}}
 
 <div class="row" id="beatOptionRow">
-  <div class="beatOption {{if usingMicAudio "col-xs-4" "col-xs-8"}}">
+  <div class="beatOption col-xs-4">
     <span data-toggle="tooltip" data-placement="bottom" data-title="The sensitivity of the beat detector ( more sensitivity results in more registered beats )" class="optionDescription bootstrapTooltip">Sensitivity</span>
   {{range-slider start=threshold orientation="vertical" step=beatOptions.threshold.step range=beatOptions.threshold.range slide="thresholdChanged" pips=beatOptions.threshold.pips}}
   </div>
 
   {{#if usingMicAudio}}
       <div class="beatOption col-xs-4">
-          <span data-toggle="tooltip" data-placement="bottom" data-title="The coefficient to boost the microphone signal by" class="optionDescription bootstrapTooltip">Microphone boost</span>
+          <span data-toggle="tooltip" data-placement="bottom" data-title="The coefficient to boost the microphone signal by" class="optionDescription bootstrapTooltip">Mic Boost</span>
         {{range-slider start=micBoost orientation="vertical" step=beatOptions.micBoost.step range=beatOptions.micBoost.range slide="micBoostChanged" pips=beatOptions.micBoost.pips}}
       </div>
   {{/if}}
 
-  <div id="lightOption" class="beatOption col-xs-4">
+  <div id="lightOption" class="beatOption {{if usingMicAudio "col-xs-4" "col-xs-8"}}">
     <span data-toggle="tooltip" data-placement="bottom auto" data-title="Quickly flash the lights on beat" class="bootstrapTooltip" {{action "hideTooltip" on="mouseLeave"}}>
       {{#paper-checkbox checked=flashingTransitions}}Flashing Transitions{{/paper-checkbox}}
     </span>

app/styles/app.scss

@@ -514,7 +514,7 @@ md-toolbar {
   transform: translateY(-50%);
   .tooltip {
     margin-top: 5px !important;
-    margin-left: -30px !important;
+    left: 0 !important;
   }
 }
 
@@ -825,6 +825,7 @@ md-switch.md-default-theme.md-checked .md-thumb {
 #beatArea {
   height: $playerBottomHeight;
   position: relative;
+  padding: 0;
 }
 
 .noUi-target {