fix: better style and copy for challenge modal

app/assets/javascripts/strings.ts

@@ -46,7 +46,7 @@ export const STRING_INVALID_IMPORT_FILE = "Unable to open file. Ensure it is a p
 export function StringImportError(errorCount: number) {
   return `Import complete. ${errorCount} items were not imported because there was an error decrypting them. Make sure the password is correct and try again.`;
 }
-export const STRING_ENTER_ACCOUNT_PASSCODE = 'Enter your application passcode';
+export const STRING_ENTER_ACCOUNT_PASSCODE = 'Enter your application passcode to decrypt your data and unlock the application';
 export const STRING_ENTER_ACCOUNT_PASSWORD = 'Enter your account password';
 export const STRING_ENTER_PASSCODE_FOR_MIGRATION = 'Your application passcode is required to perform an upgrade of your local data storage structure.';
 export const STRING_STORAGE_UPDATE = 'Storage Update';

app/assets/javascripts/views/challenge_modal/challenge-modal.pug

@@ -1,5 +1,5 @@
 .sk-modal-background(ng-click="ctrl.cancel()")
-#privileges-modal.challenge-modal.sk-modal-content
+.challenge-modal.sk-modal-content
   .sn-component
     .sk-panel
       .sk-panel-header
@@ -7,7 +7,7 @@
       .sk-panel-content
         .sk-panel-section
           div(ng-repeat="type in ctrl.state.types")
-            .sk-p.sk-bold.sk-panel-row.centered
+            .sk-p.sk-panel-row.centered.prompt
               strong {{ctrl.promptForChallenge(type)}}
             .sk-panel-row
               input.sk-input.contrast(

app/assets/stylesheets/_modals.scss

@@ -12,6 +12,11 @@
 }
 
 .challenge-modal {
+  max-width: 480px;
+
+  .prompt {
+    text-align: center;
+  }
   .sk-panel .sk-panel-header {
     justify-content: center;
   }