Add some padding to web boxes (#368)

Left-on-Read · Sep 9, 2022 · e0036eb · e0036eb · vercel · Sep 9, 2022
1 parent 0c48298
commit e0036eb
Show file tree

Hide file tree

Showing 2 changed files with 15 additions and 7 deletions.
diff --git a/web/src/components/sections/Download.tsx b/web/src/components/sections/Download.tsx
@@ -35,15 +35,15 @@ export function Download({
             flexDirection: 'column',
             alignItems: 'center',
             width: '100%',
-            marginTop: 40,
+            marginTop: 80,
           }}
         >
-          <Box style={{ display: 'flex', alignItems: 'center', marginTop: 80 }}>
+          <Box style={{ display: 'flex', alignItems: 'center' }}>
             {/* <Image src={'/ICON.png'} height={70} width={70} /> */}
             <Text
               fontSize={{
-                base: '5xl',
-                md: '6xl',
+                base: '4xl',
+                md: '5xl',
                 lg: '7xl',
               }}
               fontWeight="extrabold"
@@ -59,7 +59,7 @@ export function Download({
               display: 'flex',
               flexDirection: 'column',
               alignItems: 'center',
-              marginBottom: 60,
+              marginBottom: 80,
             }}
           >
             <Text
@@ -91,7 +91,6 @@ export function Download({
           <Box
             style={{
               backgroundColor: 'white',
-              padding: '5%',
               borderRadius: 32,
               display: 'flex',
               justifyContent: 'space-between',
@@ -101,6 +100,11 @@ export function Download({
               base: '0',
               lg: '8%',
             }}
+            padding={{
+              base: '10%',
+              md: '5%',
+              lg: '5%',
+            }}
             bgGradient="linear(to-br, yellow.500, yellow.700)"
             flexDirection={{
               base: 'column',

diff --git a/web/src/components/sections/Security.tsx b/web/src/components/sections/Security.tsx
@@ -16,11 +16,15 @@ export function Security() {
         <Box
           style={{
             backgroundColor: 'white',
-            padding: '5%',
             borderRadius: 32,
             display: 'flex',
             justifyContent: 'space-between',
           }}
+          padding={{
+            base: '10%',
+            md: '5%',
+            lg: '5%',
+          }}
           margin={{
             base: '0',
             lg: '3%',