<div class="static-page-preview">
  <div class="static-page-preview__toolbar">
    @for (device of devices; track device.id) {
      <app-button
        [variant]="activeDevice() === device.id ? 'primary' : 'secondary'"
        size="sm"
        (click)="setDevice(device.id)"
      >{{ device.labelKey | translate }}</app-button>
    }
  </div>
  <div class="static-page-preview__viewport">
    <div class="static-page-preview__frame" [style.width]="activeWidth()">
      @if (title()) {
        <h1 class="static-page-preview__title">{{ title() }}</h1>
      }
      <div class="static-page-preview__content" [innerHTML]="safeHtml()"></div>
    </div>
  </div>
</div>
