<div class="wrapper">
    <div class="content">
        <div class="buttons-container">
            <button class="button" routerLink="/materials/list"><i class="fas fa-arrow-left"></i> WRÓĆ DO LISTY</button>
        </div>
</div>
    <div class="wrapper-add">
      <div class="container">
        <h1>Dodawanie pliku</h1>
        <br />

        <div *ngIf="currentFileUpload" class="progress">
          <div class="progress-bar progress-bar-info progress-bar-striped"
            role="progressbar" attr.aria-valuenow="{{progress.percentage}}"
            aria-valuemin="0" aria-valuemax="100"
            [ngStyle]="{width:progress.percentage+'%'}">
            {{progress.percentage}}%</div>
        </div>
        <div>
          <label class="btn -btn default">
            <p>Podaj nazwę pliku:</p>
             <input type="text" name="title" class="form-control" ngModel required [(ngModel)]="title"> {{title}}
           </label>
        </div>
        <br />
          <label>
            <p>Wybierz plik:</p>
            <input type="file" (change)="selectFile($event)" accept=".pdf,.doc,.docx,.txt,.ptt,.pttx">
          </label>
          <div>
            <br />
            <input type="checkbox" name="{{ permission }}" class="form-control" [checked]="permission" (change)="changePermission()"/>
            <b>Udostępnij publicznie</b>
            <br /><br />
        </div>
          <button class="button" style ="font-size: x-large; padding-left: 30px; padding-right: 30px;" [disabled]="!selectedFiles" (click)="upload()"><i class="fas fa-check-circle"></i> Dodaj materiały!</button>
          <br /><br />
          <button class="button" routerLink="/materials/list/"><i class="fas fa-arrow-left"></i> Powrót</button>
      </div>
    </div>
  </div>
