From ea8d2b91c020f89e3b6b1f3b2ce019fb6801ca2d Mon Sep 17 00:00:00 2001
From: DanHillesheim <79476558+DanHillesheim@users.noreply.github.com>
Date: Tue, 15 Nov 2022 14:35:44 -0700
Subject: [PATCH] [EC-665] Fix biometrics button style (#3979)

* fix biometrics button style

* expand button to fill space

this is a result of it being used outside the box-content

* remove padding from box-footer
---
 apps/browser/src/popup/accounts/lock.component.html |  2 +-
 apps/browser/src/popup/scss/base.scss               |  4 ++++
 apps/browser/src/popup/scss/box.scss                | 12 ++++++++++++
 3 files changed, 17 insertions(+), 1 deletion(-)

diff --git a/apps/browser/src/popup/accounts/lock.component.html b/apps/browser/src/popup/accounts/lock.component.html
index ed47940875..3c96458766 100644
--- a/apps/browser/src/popup/accounts/lock.component.html
+++ b/apps/browser/src/popup/accounts/lock.component.html
@@ -60,7 +60,7 @@
       </div>
     </div>
     <div class="box" *ngIf="biometricLock">
-      <div class="box-footer">
+      <div class="box-footer no-pad">
         <button
           type="button"
           class="btn primary block"
diff --git a/apps/browser/src/popup/scss/base.scss b/apps/browser/src/popup/scss/base.scss
index 29548d17aa..8803c73aa6 100644
--- a/apps/browser/src/popup/scss/base.scss
+++ b/apps/browser/src/popup/scss/base.scss
@@ -322,6 +322,10 @@ header {
   background-color: transparent;
 }
 
+.no-pad {
+  padding: 0 !important;
+}
+
 .content {
   padding: 15px;
 }
diff --git a/apps/browser/src/popup/scss/box.scss b/apps/browser/src/popup/scss/box.scss
index ab1f8bd91e..29e54ed9f3 100644
--- a/apps/browser/src/popup/scss/box.scss
+++ b/apps/browser/src/popup/scss/box.scss
@@ -88,6 +88,18 @@
       padding: 0;
     }
 
+    button.btn.primary {
+      font-size: $font-size-base;
+      padding: 7px 15px;
+      width: 100%;
+
+      &:hover {
+        @include themify($themes) {
+          border-color: themed("borderHoverColor") !important;
+        }
+      }
+    }
+
     @include themify($themes) {
       color: themed("mutedColor");
     }