From 50d4d8041e82ce684630396b97688852a9478569 Mon Sep 17 00:00:00 2001
From: Yugal Kaushik <yugalkaushik14@gmail.com>
Date: Sun, 4 May 2025 15:28:03 +0530
Subject: [PATCH 1/3] fix keyboard navigation

---
 client/styles/components/_preferences.scss | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/client/styles/components/_preferences.scss b/client/styles/components/_preferences.scss
index e80bd83b1a..0be792017f 100644
--- a/client/styles/components/_preferences.scss
+++ b/client/styles/components/_preferences.scss
@@ -204,6 +204,11 @@ input[type="number"]::-webkit-outer-spin-button {
     font-weight: bold;
   }
 }
+.preference__radio-button:focus-visible + .preference__option {
+  outline: 2px solid #3B99FC;
+  outline-offset: 2px;
+  border-radius: 4px;
+}
 
 .preference--hidden {
   @extend %hidden-element;

From b920c315215a57ea6ea86234564739f2c3541a12 Mon Sep 17 00:00:00 2001
From: Yugal Kaushik <yugalkaushik14@gmail.com>
Date: Sun, 4 May 2025 16:02:29 +0530
Subject: [PATCH 2/3] fix keyboard navigation

---
 client/styles/components/_preferences.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/client/styles/components/_preferences.scss b/client/styles/components/_preferences.scss
index 0be792017f..06f0a86bd8 100644
--- a/client/styles/components/_preferences.scss
+++ b/client/styles/components/_preferences.scss
@@ -205,7 +205,7 @@ input[type="number"]::-webkit-outer-spin-button {
   }
 }
 .preference__radio-button:focus-visible + .preference__option {
-  outline: 2px solid #3B99FC;
+  outline: 2px solid $dodgerblue; 
   outline-offset: 2px;
   border-radius: 4px;
 }

From b980819e4078393a354c56c14f4233833f0fddbf Mon Sep 17 00:00:00 2001
From: Yugal Kaushik <yugalkaushik14@gmail.com>
Date: Sat, 10 May 2025 15:43:52 +0530
Subject: [PATCH 3/3] Resized the component and fixed color mismatch

---
 client/styles/components/_preferences.scss | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/client/styles/components/_preferences.scss b/client/styles/components/_preferences.scss
index 06f0a86bd8..0ef44a9e48 100644
--- a/client/styles/components/_preferences.scss
+++ b/client/styles/components/_preferences.scss
@@ -2,7 +2,7 @@
 
 .preferences {
   width: 100%;
-  width: #{math.div(640, $base-font-size)}rem;
+  width: #{math.div(720, $base-font-size)}rem;
   max-width: 100%;
   max-height: 100%;
   z-index: 9999;
@@ -21,7 +21,7 @@
   }
 
   @media (min-width: 770px) {
-    max-height: #{math.div(460, $base-font-size)}rem;
+    max-height: #{math.div(520, $base-font-size)}rem;
   }
 }
 
@@ -204,6 +204,7 @@ input[type="number"]::-webkit-outer-spin-button {
     font-weight: bold;
   }
 }
+.preference__radio-button:focus + .preference__option,
 .preference__radio-button:focus-visible + .preference__option {
   outline: 2px solid $dodgerblue; 
   outline-offset: 2px;