Buggy display of Security Score in mobile version (#2751)

Fixes #2747

ui/marketplace/AppSecurityReport.tsx

@@ -87,7 +87,7 @@ const AppSecurityReport = ({
         wrapperProps={ triggerWrapperProps }
         { ...buttonProps }
       />
-      <PopoverContent w={{ base: 'calc(100vw - 48px)', lg: '328px' }} mx={{ base: 3, lg: 0 }} { ...popoverContentProps }>
+      <PopoverContent w={{ base: 'calc(100vw - 48px)', lg: '328px' }} mx={{ base: 3, lg: 0 }} overflowY="auto" { ...popoverContentProps }>
         <PopoverBody px="26px" py="20px" textStyle="sm">
           <Text fontWeight="500" textStyle="xs" mb={ 2 } color="text.secondary">Smart contracts info</Text>
           <Flex alignItems="center" justifyContent="space-between" py={ 1.5 }>

ui/marketplace/ContractSecurityReport.tsx

@@ -41,7 +41,7 @@ const ContractSecurityReport = ({ securityReport }: Props) => {
         score={ parseFloat(securityScore) }
         onClick={ handleClick }
       />
-      <PopoverContent>
+      <PopoverContent zIndex="modal2" w={{ base: 'calc(100vw - 48px)', lg: '328px' }} overflowY="auto">
         <PopoverBody>
           <Box mb={ 5 }>
             The security score was derived from evaluating the smart contracts of a protocol on the { config.chain.name } network  by { ' ' }