update components with theme property

src/components/Collections/CollectionOptions.tsx

@@ -174,12 +174,13 @@ const CollectionOptions = (props: CollectionOptionsProps) => {
                 MenuListProps={{
                     'aria-labelledby': 'collection-options',
                 }}>
-                <Paper sx={{ borderRadius: '10px' }}>
+                <Paper
+                    sx={{ borderRadius: (theme) => theme.sizes.borderRadius }}>
                     <MenuList
                         sx={{
                             padding: 0,
                             border: 'none',
-                            borderRadius: '8px',
+                            borderRadius: (theme) => theme.sizes.borderRadius,
                         }}>
                         <MenuItem>
                             <ListItem onClick={showRenameCollectionModal}>

src/components/RecoveryKeyModal.tsx

@@ -60,7 +60,7 @@ function RecoveryKeyModal({ somethingWentWrong, ...props }: Props) {
             }}>
             <p>{constants.RECOVERY_KEY_DESCRIPTION}</p>
             <Box
-                borderRadius={'8px'}
+                borderRadius={(theme) => theme.sizes.borderRadius}
                 border={'1px dashed'}
                 borderColor={'grey.A700'}>
                 <CodeBlock code={recoveryKey} />

src/components/Sidebar/SubscriptionDetails.tsx

@@ -21,7 +21,7 @@ export default function SubscriptionDetails({ userDetails }: Iprops) {
             flexDirection={'column'}
             height={160}
             bgcolor="accent.main"
-            borderRadius={'8px'}
+            borderRadius={(theme) => theme.sizes.borderRadius}
             position={'relative'}>
             {userDetails ? (
                 <>
@@ -61,7 +61,7 @@ export default function SubscriptionDetails({ userDetails }: Iprops) {
                         position={'relative'}
                         zIndex="100"
                         height="64px"
-                        borderRadius={'0 0 8px 8px'}
+                        borderRadius={(theme) => theme.sizes.borderRadius}
                         bgcolor="accent.dark"
                         padding="16px">
                         <LinearProgress