fix margins

ui/marketplace/Banner/FeaturedApp.tsx

@@ -65,6 +65,7 @@ const FeaturedApp = ({
         padding={ 5 }
         background={ backgroundColor }
         mb={ 2 }
+        mt={ 6 }
       >
         <Skeleton
           isLoaded={ !isLoading }

ui/marketplace/Banner/FeaturedAppMobile.tsx

@@ -43,6 +43,7 @@ const FeaturedAppMobile = ({
       padding={{ base: 3, sm: '20px' }}
       role="group"
       background={ useColorModeValue('purple.50', 'whiteAlpha.100') }
+      mt={ 6 }
     >
       <Flex
         flexDirection="row"

ui/marketplace/Banner/IframeBanner.tsx

@@ -22,6 +22,7 @@ const IframeBanner = ({ contentUrl, linkUrl }: { contentUrl: string; linkUrl: st
       w="100%"
       borderRadius="md"
       mb={{ base: 0, sm: 2 }}
+      mt={ 6 }
       overflow="hidden"
     >
       <Link

ui/pages/Marketplace.pw.tsx

@@ -1,3 +1,4 @@
+import { Box } from '@chakra-ui/react';
 import React from 'react';
 
 import { apps as appsMock } from 'mocks/apps/apps';
@@ -55,7 +56,15 @@ test.describe('mobile', () => {
   test.use({ viewport: devices['iPhone 13 Pro'].viewport });
 
   test('base view', async({ render }) => {
-    const component = await render(<Marketplace/>);
+    const component = await render(
+      <Box>
+        { /* Added a fake header because without the ActionBar works incorrectly without it */ }
+        <Box h="100px" backgroundColor="#dbdbdb" p={ 1 }>
+          Header
+        </Box>
+        <Marketplace/>
+      </Box>,
+    );
 
     await expect(component).toHaveScreenshot();
   });

ui/pages/Marketplace.tsx

@@ -136,6 +136,7 @@ const Marketplace = () => {
     <>
       <PageTitle
         title="DAppscout"
+        mb={ 2 }
         contentAfter={ (isMobile && links.length > 1) ? (
           <Menu>
             <MenuButton