Add export / import menu how to message (#264)

* Add export message

* Height fix

_locales/en/messages.json

@@ -174,5 +174,9 @@
     "scale": {
         "message": "Scale",
         "description": "Scale"
+    },
+    "export_info": {
+        "message": "Copy this text and save it somewhere else to backup your secrets. Want to add an account to another app? Hover over the top right part of any account and hit the hidden button.",
+        "description": "Export menu info text"
     }
 }

css/popup.css

@@ -596,7 +596,8 @@ body {
 }
 
 #exportData {
-    height: 330px;
+    margin-top: 10px;
+    height: 265px;
     width: 100%;
     word-break: break-all;
     resize: none;
@@ -675,7 +676,13 @@ body {
     margin: 10px 0 0 10px;
 }
 
+#export_info {
+    display: block;
+    margin: 10px 10px 0 10px;
+}
+
 #security_warning,
+#export_info,
 #passphrase_info {
     color: gray;
 }

javascript/popup.js

@@ -39,6 +39,7 @@ document.getElementById('menuName').innerText = chrome.i18n.getMessage('settings
 document.getElementById('security_new_phrase_label').innerText = chrome.i18n.getMessage('phrase');
 document.getElementById('security_confirm_phrase_label').innerText = chrome.i18n.getMessage('confirm_phrase');
 document.getElementById('security_warning').innerText = chrome.i18n.getMessage('security_warning');
+document.getElementById('export_info').innerText = chrome.i18n.getMessage('export_info');
 document.getElementById('exportButton').innerText = chrome.i18n.getMessage('update');
 document.getElementById('resize_save').innerText = chrome.i18n.getMessage('ok');
 document.getElementById('security_save').innerText = chrome.i18n.getMessage('ok');

popup.html

@@ -92,6 +92,7 @@
 <div id="export">
 <div id="exportClose"><i class="fa fa-times-circle"></i></div>
 <div id="exportContent">
+<div id="export_info"></div>
 <textarea id="exportData"></textarea>
 <div id="exportButton"></div>
 </div>