From 542d475d38147568601b2190f5a5583669c885fb Mon Sep 17 00:00:00 2001
From: karishmas6 <carishmashukla28@gmail.com>
Date: Tue, 29 Oct 2024 05:03:27 +0530
Subject: [PATCH] feat: ensure text field does not overflow

---
 src/components/organisms/RightSidePanel.tsx | 23 +++++++++++----------
 1 file changed, 12 insertions(+), 11 deletions(-)

diff --git a/src/components/organisms/RightSidePanel.tsx b/src/components/organisms/RightSidePanel.tsx
index dbb550d7..f2871aea 100644
--- a/src/components/organisms/RightSidePanel.tsx
+++ b/src/components/organisms/RightSidePanel.tsx
@@ -427,17 +427,18 @@ export const RightSidePanel: React.FC<RightSidePanelProps> = ({ onFinishCapture
                 <FormControlLabel value="custom" control={<Radio />} label="Custom" />
                 {limitType === 'custom' && (
                   <TextField
-                    type="number"
-                    value={customLimit}
-                    onChange={(e) => updateCustomLimit(e.target.value)}
-                    placeholder="Enter number"
-                    sx={{
-                      marginLeft: '10px',
-                      '& input': {
-                        padding: '10px',
-                        background: 'white',
-                      },
-                    }}
+                  type="number"
+                  value={customLimit}
+                  onChange={(e) => updateCustomLimit(e.target.value)}
+                  placeholder="Enter number"
+                  sx={{
+                    marginLeft: '10px',
+                    '& input': {
+                    padding: '10px',
+                    background: 'white',
+                    },
+                    width: '150px', // Ensure the text field does not go outside the panel
+                  }}
                   />
                 )}
               </div>