fix css, grammar and text issues with the auto signout toasts (#3682)

LiskHQ · Jul 13, 2021 · 123153c · 123153c
1 parent 7d10f8a
commit 123153c
Show file tree

Hide file tree

Showing 4 changed files with 11 additions and 7 deletions.
diff --git a/i18n/locales/en/common.json b/i18n/locales/en/common.json
@@ -427,7 +427,7 @@
   "Send {{token}}": "Send {{token}}",
   "Send {{token}} here": "Send {{token}} here",
   "Sender": "Sender",
-  "Session timeout": "Your session was timed out after 10 minutes of no network activity. Please sign in to continue using your account.",
+  "Session timed out": "Your session was timed out after 10 minutes of no network activity. Please sign in to continue using your account.",
   "Settings": "Settings",
   "Settings saved!": "Settings saved!",
   "Share": "Share",
@@ -561,7 +561,7 @@
   "Wallet address": "Wallet address",
   "Wallet address:": "Wallet address:",
   "Wallet details": "Wallet details",
-  "Warning session timeout": "Warning session timeout",
+  "Warning: Session Timeout": "Warning: Session Timeout",
   "Watched": "Watched",
   "We are proud to announce that Lisk Core v3 now contains new improved robust security features.": "We are proud to announce that Lisk Core v3 now contains new improved robust security features.",
   "We kindly ask you to transfer your balance to the new account.": "We kindly ask you to transfer your balance to the new account.",
@@ -601,7 +601,7 @@
   "Your balance will be transferred in a few seconds.": "Your balance will be transferred in a few seconds.",
   "Your multisignatures groups": "Your multisignatures groups",
   "Your nickname": "Your nickname",
-  "Your session will timed out in {{time}} if no network activity occur.": "Your session will timed out in {{time}} if no network activity occur.",
+  "Your session will be timed out in {{time}} if no network activity occurs.": "Your session will be timed out in {{time}} if no network activity occurs.",
   "Your tokens and passphrase are safe.": "Your tokens and passphrase are safe.",
   "Your transaction has been submitted and will be confirmed in a few moments.": "Your transaction has been submitted and will be confirmed in a few moments.",
   "Your transaction is being submitted to the blockchain.": "Your transaction is being submitted to the blockchain.",

diff --git a/src/components/shared/navigationBars/sideBar/autoSignOut/autoSignOut.css b/src/components/shared/navigationBars/sideBar/autoSignOut/autoSignOut.css
@@ -38,8 +38,12 @@
 }
 
 .title {
-  text-decoration: underline;
   margin-bottom: 0;
+  margin-top: 20px;
+}
+
+.content {
+  margin-bottom: 45px;
 }
 
 button {

diff --git a/src/components/shared/navigationBars/sideBar/autoSignOut/index.js b/src/components/shared/navigationBars/sideBar/autoSignOut/index.js
@@ -6,7 +6,7 @@ import styles from './autoSignOut.css';
 
 const TimeOutToast = ({ t, completed }) => (
   completed && toast(
-    <div className={styles.toastText}>{t('Session timeout')}</div>, {
+    <div className={styles.toastText}>{t('Session timed out')}</div>, {
       toastId: 'time-out',
       autoClose: false,
       closeButton: <span

diff --git a/src/components/shared/navigationBars/sideBar/autoSignOut/warning.js b/src/components/shared/navigationBars/sideBar/autoSignOut/warning.js
@@ -28,8 +28,8 @@ const TimeOutToast = ({
   return (
     completed && toast(
       <div className={styles.toastText}>
-        <p className={styles.title}>{t('Warning session timeout')}</p>
-        <p>{t('Your session will timed out in {{time}} if no network activity occur.', { time: `${minutes}${seconds}` })}</p>
+        <h5 className={styles.title}>{t('Warning: Session Timeout')}</h5>
+        <p className={styles.content}>{t('Your session will be timed out in {{time}} if no network activity occurs.', { time: `${minutes}${seconds}` })}</p>
         <button
           className={`${styles.button} reset-time-button`}
           onClick={onResetTime}