diff --git a/src/components/elements/dropdown-search.js b/src/components/elements/dropdown-search.js
index 6ada3c86c9f..9c9696b1a08 100644
--- a/src/components/elements/dropdown-search.js
+++ b/src/components/elements/dropdown-search.js
@@ -37,7 +37,7 @@ const DropdownInput = styled.input`
 `
 
 const DropdownSearch = ({
-    contract_size,
+    contractSize,
     error,
     has_short_name,
     items,
@@ -48,9 +48,8 @@ const DropdownSearch = ({
 }) => {
     const [input_value, setInputValue] = useState('')
     const [dropdown_items, setDropdownItems] = useState([...items])
-    const [is_open, dropdown_ref, nodes, handleChange, toggleListVisibility, setOpen] = useDropdown(
-        onChange,
-    )
+    const [is_open, dropdown_ref, nodes, handleChange, toggleListVisibility, setOpen] =
+        useDropdown(onChange)
 
     const handleInputChange = (e) => {
         setInputValue(e.target.value)
@@ -116,13 +115,13 @@ const DropdownSearch = ({
                     selected_option={selected_item}
                 />
             </DropdownContainer>
-            <BottomLabel contract_size={contract_size} error={error} />
+            <BottomLabel contractSize={contractSize} error={error} />
         </>
     )
 }
 
 DropdownSearch.propTypes = {
-    contract_size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+    contractSize: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
     default_item: PropTypes.any,
     error: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
     has_short_name: PropTypes.bool,
diff --git a/src/components/elements/dropdown.js b/src/components/elements/dropdown.js
index 584fbdceda1..37194f030fb 100644
--- a/src/components/elements/dropdown.js
+++ b/src/components/elements/dropdown.js
@@ -304,16 +304,16 @@ ItemList.propTypes = {
     selected_option: PropTypes.any,
 }
 
-export const BottomLabel = ({ error, contract_size }) => {
+export const BottomLabel = ({ error, contractSize }) => {
     return (
         <StyledDiv>
             <ErrorMessages lh="1.4" align="left" color="red-1">
                 {error}
             </ErrorMessages>
 
-            {contract_size && (
+            {contractSize && (
                 <ContractSizeWrapper lh="1.4" align="left">
-                    Contract size : {getCommaSeparatedNumber(contract_size)}
+                    Contract size : {getCommaSeparatedNumber(contractSize)}
                 </ContractSizeWrapper>
             )}
         </StyledDiv>
@@ -321,7 +321,7 @@ export const BottomLabel = ({ error, contract_size }) => {
 }
 
 BottomLabel.propTypes = {
-    contract_size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+    contractSize: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
     error: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
 }
 
@@ -333,7 +333,7 @@ const Dropdown = ({
     label,
     error,
     selected_option,
-    contract_size,
+    contractSize,
     ...props
 }) => {
     const [is_open, dropdown_ref, nodes, handleChange, toggleListVisibility] = useDropdown(onChange)
@@ -374,13 +374,13 @@ const Dropdown = ({
                     selected_option={selected_option}
                 />
             </DropdownContainer>
-            <BottomLabel contract_size={contract_size} error={error} />
+            <BottomLabel contractSize={contractSize} error={error} />
         </>
     )
 }
 
 Dropdown.propTypes = {
-    contract_size: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
+    contractSize: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
     default_option: PropTypes.any,
     error: PropTypes.oneOfType([PropTypes.string, PropTypes.object]),
     has_short_name: PropTypes.bool,
diff --git a/src/pages/trader-tools/margin-calculator/_margin-calculator.js b/src/pages/trader-tools/margin-calculator/_margin-calculator.js
index 3ad2a4a97ed..488a22a37ef 100644
--- a/src/pages/trader-tools/margin-calculator/_margin-calculator.js
+++ b/src/pages/trader-tools/margin-calculator/_margin-calculator.js
@@ -188,7 +188,7 @@ const MarginCalculator = () => {
                                         <DropdownSearch
                                             id="symbol"
                                             key={tab}
-                                            contract_size={values.contractSize}
+                                            contractSize={values.contractSize}
                                             default_item={optionItemDefault}
                                             error={touched.symbol && errors.symbol}
                                             items={values.optionList}
diff --git a/src/pages/trader-tools/swap-calculator/_swap-calculator.js b/src/pages/trader-tools/swap-calculator/_swap-calculator.js
index 44c576984c1..0d4eaaa1a3c 100644
--- a/src/pages/trader-tools/swap-calculator/_swap-calculator.js
+++ b/src/pages/trader-tools/swap-calculator/_swap-calculator.js
@@ -207,7 +207,7 @@ const SwapCalculator = () => {
                                                         )
                                                         setFieldValue('symbol', value)
                                                     }}
-                                                    contract_size={values.contractSize}
+                                                    contractSize={values.contractSize}
                                                     error={touched.symbol && errors.symbol}
                                                     onBlur={handleBlur}
                                                 />
@@ -516,6 +516,7 @@ const SwapCalculator = () => {
 
                                             <CalculatorBody>
                                                 <Dropdown
+                                                    mb="3.6rem"
                                                     default_option={optionItemDefault}
                                                     option_list={values.optionList}
                                                     label={localize('Symbol')}