<div ng-controller="Wizdom365ModernAllowedFileTypesController as vm">
    <div class="lt-module-page__top lt-module-page-top">
        <div class="lt-module-page-top__title mr-auto">
            <h1>{{'Modern Experiences' | translate}}</h1>
        </div>
        <div class="lt-module-page-top__actions">
            <button class="btn btn-primary wide-config-btn"
                    ng-disabled="vm.saving" ng-click="vm.saveConfig()">
                {{(vm.saving ? 'Saving' : 'Save configuration')  | translate}}
            </button>
        </div>
    </div>

    <wizdom365-spinner style="position: absolute; top: 50%; left: 50%;" loading="loading"></wizdom365-spinner>

    <div class="panel lt-module-page__content-panel">
        <div class="panel-heading">
            {{'Define File Types' | translate}}
        </div>
        <p class="alert alert-info">{{'Enter file types as comma-separated strings below' | translate}}</p>

        <input type="text" class="form-control" placeholder="'image/jpg', 'image/gif', 'image/png', 'image/jpeg'" ng-model="vm.allowedFileTypes" />
    </div>
</div>