From efd224d3807c99c15251a1816d8da35606693059 Mon Sep 17 00:00:00 2001
From: Tomer Shvueli <tomer@shvueli.com>
Date: Fri, 30 Apr 2021 10:48:20 -0400
Subject: [PATCH] fix: Updated UI so option is no longer nested, added proper
 description

---
 src/_locales/en/messages.json             |  5 ++++-
 src/popup/scss/box.scss                   |  7 -------
 src/popup/settings/options.component.html | 17 ++++++++++-------
 3 files changed, 14 insertions(+), 15 deletions(-)

diff --git a/src/_locales/en/messages.json b/src/_locales/en/messages.json
index 0ac89a2c87..6615263add 100644
--- a/src/_locales/en/messages.json
+++ b/src/_locales/en/messages.json
@@ -886,7 +886,10 @@
     "message": "If a login form is detected, automatically perform an auto-fill when the web page loads."
   },
   "enableAutoTotpCopyOnAutoFill": {
-    "message": "Copy TOTP to clipboard after auto-fill"
+    "message": "Automatic TOTP Copy after Page Load"
+  },
+  "enableAutoTotpCopyOnAutoFillDesc": {
+    "message": "If Auto-fill On Page Load is enabled, and your login has an authenticator key attached to it, the TOTP verification code is automatically copied to your clipboard after loading the web page."
   },
   "experimentalFeature": {
     "message": "This is currently an experimental feature. Use at your own risk."
diff --git a/src/popup/scss/box.scss b/src/popup/scss/box.scss
index 8ae0842d66..91f8db1d5a 100644
--- a/src/popup/scss/box.scss
+++ b/src/popup/scss/box.scss
@@ -9,13 +9,6 @@
         margin-top: 0;
     }
 
-    .box {
-        width: calc(100% - 15px);
-        margin-left: 15px;
-        margin-bottom: 5px;
-        border-left: 1px solid #000000;
-    }
-
     .box-header {
         margin: 0 10px 5px 10px;
         text-transform: uppercase;
diff --git a/src/popup/settings/options.component.html b/src/popup/settings/options.component.html
index 81a9a35598..e868ad66fb 100644
--- a/src/popup/settings/options.component.html
+++ b/src/popup/settings/options.component.html
@@ -23,15 +23,18 @@
             {{'enableAutoFillOnPageLoadDesc' | i18n}}
             <b>{{'warning' | i18n}}</b>: {{'experimentalFeature' | i18n}}
         </div>
-        <div class="box">
-            <div class="box-content">
-                <div class="box-content-row box-content-row-checkbox" appBoxRow>
-                    <label for="autoCopyTotp">{{'enableAutoTotpCopyOnAutoFill' | i18n}}</label>
-                    <input id="autoCopyTotp" type="checkbox" (change)="updateAutoTotpCopyOnAutoFill()"
-                        [(ngModel)]="enableAutoTotpCopyOnAutoFill" [disabled]="!enableAutoFillOnPageLoad">
-                </div>
+    </div>
+    <div class="box">
+        <div class="box-content">
+            <div class="box-content-row box-content-row-checkbox" appBoxRow>
+                <label for="autoCopyTotp">{{'enableAutoTotpCopyOnAutoFill' | i18n}}</label>
+                <input id="autoCopyTotp" type="checkbox" (change)="updateAutoTotpCopyOnAutoFill()"
+                    [(ngModel)]="enableAutoTotpCopyOnAutoFill" [disabled]="!enableAutoFillOnPageLoad">
             </div>
         </div>
+        <div class="box-footer">
+            {{'enableAutoTotpCopyOnAutoFillDesc' | i18n}}
+        </div>
     </div>
     <div class="box">
         <div class="box-content">