.sn-component
  #sync-resolution-menu.sk-panel.sk-panel-right
    .sk-panel-header
      .sk-panel-header-title Out of Sync
      a.sk-a.info.close-button(ng-click='ctrl.close()') Close
    .sk-panel-content
      .sk-panel-section
        .sk-panel-row.sk-p
          | We've detected that the data on the server may not match 
          | the data in the current application session.
        .sk-p.sk-panel-row
          .sk-panel-column
            strong.sk-panel-row Option 1 — Restart App:
            .sk-p 
              | Quit the application and re-open it. 
              | Sometimes, this may resolve the issue.
        .sk-p.sk-panel-row
          .sk-panel-column
            strong.sk-panel-row Option 2 (recommended) — Sign Out:
            .sk-p
              | Sign out of your account, then sign back in. 
              | This will ensure your data is consistent with the server.
            | Be sure to download a backup of your data before doing so.
        .sk-p.sk-panel-row
          .sk-panel-column
            strong.sk-panel-row Option 3 — Sync Resolution:
            .sk-p
              | We can attempt to reconcile changes by downloading all data from the 
              | server. No existing data will be overwritten. If the local contents of 
              | an item differ from what the server has, a conflicted copy will be created.
        div(ng-if='!ctrl.status.backupFinished')
          .sk-p.sk-panel-row
            | Please download a backup before we attempt to 
            | perform a full account sync resolution.
          .sk-panel-row
            .sk-button-group
              .sk-button.info(ng-click='ctrl.downloadBackup(true)')
                .sk-label Encrypted
              .sk-button.info(ng-click='ctrl.downloadBackup(false)')
                .sk-label Decrypted
              .sk-button.danger(ng-click='ctrl.skipBackup()')
                .sk-label Skip
        div(ng-if='ctrl.status.backupFinished')
          .sk-panel-row(ng-if='!ctrl.status.resolving && !ctrl.status.attemptedResolution')
            .sk-button.info(ng-click='ctrl.performSyncResolution()')
              .sk-label Perform Sync Resolution
          .sk-panel-row.justify-left(ng-if='ctrl.status.resolving')
            .sk-horizontal-group
              .sk-spinner.small.info
              .sk-label Attempting sync resolution...
          .sk-panel-column(ng-if='ctrl.status.fail')
            .sk-panel-row.sk-label.danger Sync Resolution Failed
            .sk-p.sk-panel-row
              | We attempted to reconcile local content and server content, but were 
              | unable to do so. At this point, we recommend signing out of your account 
              | and signing back in. You may wish to download a data backup before doing so.
          .sk-panel-column(ng-if='ctrl.status.success')
            .sk-panel-row.sk-label.success Sync Resolution Success
            .sk-p.sk-panel-row
              | Your local data is now in sync with the server. You may close this window.
