<div class="slider-overlay" (click)="close()"></div>
<div class="slider-bar">
  <div class="header">
    <div class="title">
      <h2>{{title}}</h2>
      <button type="button" class="close" (click)="close()"></button>
    </div>
    <div class="stepper" *ngIf="frames.length > 1">
      <div class="items">
        <div class="item" *ngFor="let frame of frames; let i = index" [class.active]="frame.active">
          <div class="num">{{i + 1}}</div>
          <div class="name">{{frame.title}}</div>
        </div>
      </div>
    </div>
  </div>
  <div class="body">
    <form-frame [formGroup]="formGroup" [form]="activeFrame" [readonly]="readonly" [params]="formParams"></form-frame>
  </div>
  <div class="footer">
    <div class="left">
      <div *ngIf="noticeVisible" class="notice">* Поля, обязательные для заполнения</div>
    </div>
    <div class="right">
      <button type="button" class="outline" (click)="back()">{{isFirstFrame ? 'Отмена' : 'Назад'}}</button>
      <button type="button" *ngIf="!btnSaveHidden" (click)="proceed()">{{isLastFrame ? btnSaveLabel : 'Продолжить'}}</button>
    </div>
  </div>
</div>
