<navbar></navbar>
<div class="modebg fill no-overflow">
  <div class="container-fluid navbar-pad">
    <div class="pad-small"></div>
    <div class="row">
      <div class="col-xs-12">
        <h1 class="text-center mode-title">CHOOSE GAME MODE</h1>
      </div>
    </div>
    <div class="pad-small"></div>
    <div class="row">
      <div ng-repeat="mode in select.modes">
        <div class="col-md-4 col-xs-12 text-center mode-pad">
          <button class="btn-unstyled btn-mode" ng-class='{modefloatRight:$first, modefloatLeft:$last}' ng-click="select.selectGameMode(mode.mode_id)" ng-disabled="select.buttonDisabled">
            <div class="mode-box">
              <div>
                <img alt="" class="mode-box-image" ng-src="{{mode.image}}">
              </div>
              <label class="mode-label h1">{{mode.name}}</label>
              <p class="textxMedium mode-description">
                {{mode.description}}
              </p>
            </div>
          </button>
        </div>
      </div>
    </div>
  </div>
</div>

<navbar></navbar>
<div class="modebg fill no-overflow">
  <div class="container-fluid navbar-pad">
    <div class="pad-small"></div>
    <div class="row">
      <div class="col-xs-12">
        <h1 class="text-center mode-title">CHOOSE GAME MODE</h1>
      </div>
    </div>
    <div class="pad-small"></div>
    <div class="row">
      <div ng-hide="select.modes.length > 0">
        <div class="pad-medium"></div>
        <div class="text-center">
          <div class="textxxLarge">Loading...</div>
        </div>
      </div>
      <div ng-repeat="mode in select.modes">
        <div class="col-md-4 col-xs-12 text-center mode-pad">
          <button class="btn-unstyled btn-mode" ng-class='{modefloatRight:$first, modefloatLeft:$last}' ng-click="select.selectGameMode(mode.mode_id)" ng-disabled="select.buttonDisabled">
            <div class="mode-box">
              <div>
                <img alt="" class="mode-box-image" ng-src="{{mode.image}}">
              </div>
              <label class="mode-label h1">{{mode.name}}</label>
              <p class="textxMedium mode-description">
                {{mode.description}}
              </p>
            </div>
          </button>
        </div>
      </div>
    </div>
  </div>
</div>

Add loading text when modes is not loaded
Add loading text when modes is not loaded
