fix: better style and copy for challenge modal

standardnotes · Sep 10, 2020 · 93deb92 · 93deb92
1 parent 844e853
commit 93deb92
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 3 deletions.
diff --git a/app/assets/javascripts/strings.ts b/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';

diff --git a/app/assets/javascripts/views/challenge_modal/challenge-modal.pug b/app/assets/javascripts/views/challenge_modal/challenge-modal.pug
@@ -1,13 +1,13 @@
 .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
         .sk-panel-header-title {{ctrl.title}}
       .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(

diff --git a/app/assets/stylesheets/_modals.scss b/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;
   }