.sn-component
  #item-preview-modal.sk-modal.medium
    .sk-modal-background
    .sk-modal-content
      .sn-component
        .sk-panel
          .sk-panel-header
            div
              .sk-panel-header-title Preview
              .sk-subtitle.neutral.mt-1(
                ng-if="ctrl.title"
              ) {{ctrl.title}} 
            .sk-horizontal-group
              a.sk-a.info.close-button(
                ng-click="ctrl.restore(false)"
                ) Restore
              a.sk-a.info.close-button(
                ng-click="ctrl.restore(true)"
                ) Restore as copy
              a.sk-a.info.close-button(
                ng-click="ctrl.dismiss(); $event.stopPropagation()"
                ) Close
          .sk-panel-content.selectable(ng-if="!ctrl.state.editor")
            .sk-h2 {{ctrl.content.title}}
            p.normal.sk-p(
              style="white-space: pre-wrap; font-size: 16px;"
            ) {{ctrl.content.text}}
          .sk-panel-content.sk-h2(
            ng-if="ctrl.state.editor"
            style="height: auto; flex-grow: 0"
          ) {{ctrl.content.title}}
          component-view.component-view(
            ng-if="ctrl.state.editor",
            template-component="ctrl.state.editor",
            application='ctrl.application'
            )