<div class="modal-content">
    <div class="modal-header">
        <button type="button" class="close" aria-hidden="true" ng-click="cancel()">
            <span class="pficon pficon-close"></span>
        </button>
        <h4 class="modal-title">&ldquo;{{application.name}}&rdquo; variants</h4>
    </div>
    <div class="modal-body">
      <input type="checkbox" ng-checked="variantSelection.length == 0">All
      <div>
        <div ng-show="application.variants" ng-repeat="variant in application.variants">
          <h5 style="text-transform: capitalize" ng-if="variant.type != 'ios' && application.variants[$index - 1].type != variant.type">{{variant.type}}</h5>
          <h5 ng-if="variant.type == 'ios' && application.variants[$index - 1].type != variant.type">iOS</h5>
          <ul style="margin-bottom: -1px;">
          <li class="list-group-item">
              <label>
                  <input type="checkbox"  ng-checked="variantSelection.indexOf(variant) > -1" ng-click="toggleSelection(variant)">
                  {{variant.name}}
              </label>
          </li>
          </ul>
        </div>
      </div>
    </div>
    <div class="modal-footer">
        <button type="button" class="btn btn-default" ng-click="cancel()">Cancel</button>
        <button type="button" class="btn btn-primary" ng-click="ok(application)" ng-disabled="form.$pristine">Change</button>
    </div>
</div>