From 8fae019667166bfbd2db3279f5af53f744bc953e Mon Sep 17 00:00:00 2001
From: karishmas6 <carishmashukla28@gmail.com>
Date: Wed, 23 Oct 2024 22:26:30 +0530
Subject: [PATCH] feat: margin + remove elevaton

---
 src/components/organisms/RightSidePanel.tsx | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/src/components/organisms/RightSidePanel.tsx b/src/components/organisms/RightSidePanel.tsx
index ee51cf50..93078093 100644
--- a/src/components/organisms/RightSidePanel.tsx
+++ b/src/components/organisms/RightSidePanel.tsx
@@ -374,12 +374,12 @@ export const RightSidePanel: React.FC<RightSidePanelProps> = ({ onFinishCapture
   };
 
   return (
-    <Paper variant="outlined" sx={{ height: '520px', width: 'auto', alignItems: "center", background: 'inherit' }} id="browser-actions">
+    <Paper sx={{ height: '520px', width: 'auto', alignItems: "center", background: 'inherit' }} id="browser-actions" elevation={0}>
       {/* <SimpleBox height={60} width='100%' background='lightGray' radius='0%'>
         <Typography sx={{ padding: '10px' }}>Last action: {` ${lastAction}`}</Typography>
       </SimpleBox> */}
       <ActionDescriptionBox />
-      <Box display="flex" flexDirection="column" gap={2} style={{ margin: '15px' }}>
+      <Box display="flex" flexDirection="column" gap={2} style={{ margin: '13px' }}>
         {!getText && !getScreenshot && !getList && showCaptureList && <Button variant="contained" onClick={startGetList}>Capture List</Button>}
         {getList && (
           <>
@@ -398,7 +398,7 @@ export const RightSidePanel: React.FC<RightSidePanelProps> = ({ onFinishCapture
           </>
         )}
         {showPaginationOptions && (
-          <Box display="flex" flexDirection="column" gap={2} style={{ margin: '15px' }}>
+          <Box display="flex" flexDirection="column" gap={2} style={{ margin: '13px' }}>
             <Typography>How can we find the next list item on the page?</Typography>
             <Button variant={paginationType === 'clickNext' ? "contained" : "outlined"} onClick={() => handlePaginationSettingSelect('clickNext')}>Click on next to navigate to the next page</Button>
             <Button variant={paginationType === 'clickLoadMore' ? "contained" : "outlined"} onClick={() => handlePaginationSettingSelect('clickLoadMore')}>Click on load more to load more items</Button>
@@ -463,7 +463,7 @@ export const RightSidePanel: React.FC<RightSidePanelProps> = ({ onFinishCapture
       </Box>
       <Box>
         {browserSteps.map(step => (
-          <Box key={step.id} onMouseEnter={() => handleMouseEnter(step.id)} onMouseLeave={() => handleMouseLeave(step.id)} sx={{ boxShadow: 5, padding: '10px', margin: '13px', borderRadius: '4px', position: 'relative', background: 'white' }}>
+          <Box key={step.id} onMouseEnter={() => handleMouseEnter(step.id)} onMouseLeave={() => handleMouseLeave(step.id)} sx={{ padding: '10px', margin: '11px', borderRadius: '5px', position: 'relative', background: 'white' }}>
             {
               step.type === 'text' && (
                 <>
@@ -472,6 +472,7 @@ export const RightSidePanel: React.FC<RightSidePanelProps> = ({ onFinishCapture
                     value={textLabels[step.id] || step.label || ''}
                     onChange={(e) => handleTextLabelChange(step.id, e.target.value)}
                     fullWidth
+                    size="small"
                     margin="normal"
                     error={!!errors[step.id]}
                     helperText={errors[step.id]}