Fix mobile section

ChainSafe · Dec 14, 2023 · 9c40fa2 · 9c40fa2
1 parent fb6ce2c
commit 9c40fa2
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 6 deletions.
diff --git a/src/app/globals.css b/src/app/globals.css
@@ -36,5 +36,5 @@ body {
 }
 
 .btn-link {
-  @apply cursor-pointer mr-2 transition-all rounded-full border-[1px] px-8 py-1 text-lg font-medium shadow-sm hover:brightness-[80%]
+  @apply cursor-pointer mr-2 transition-all rounded-full border-[1px] px-8 py-1 text-lg font-medium shadow-sm hover:brightness-[80%] mt-2 w-full md:w-auto md:mt-0 text-center md:-text-left
 }
diff --git a/src/app/page.tsx b/src/app/page.tsx
@@ -7,7 +7,7 @@ import Binaries from '@/sections/Binaries'
 import Contributors from '@/sections/Contributors'
 import Documentation from '@/sections/Documentation'
 import Downloads from '@/sections/Downloads'
-import Hero3 from '@/sections/Hero3'
+import Hero from '@/sections/Hero'
 import LearnMore from '@/sections/LearnMore'
 import RunningNode from '@/sections/RunningNode'
 import SpecsTable2 from '@/sections/SpecsTable2'
@@ -18,7 +18,7 @@ export default function Home() {
   return (
     <main className="flex flex-col bg-[#0f0f0f]">
       <Navbar />
-      <Hero3 />
+      <Hero />
       <WithForestYouCan2 />
       <BetaTesters />
       <SpecsTable2 />

diff --git a/src/sections/Hero3/index.tsx → src/sections/Hero/index.tsx b/src/sections/Hero3/index.tsx → src/sections/Hero/index.tsx
@@ -3,18 +3,18 @@
 
 import { Link } from 'react-scroll';
 
-export default function Hero3() {
+export default function Hero() {
   return (
     <div className="relative h-screen w-full px-4 md:px-8 bg-no-repeat bg-cover bg-multi-gradient">
-      <div className="relative flex flex-col max-w-7xl py-48">
+      <div className="relative flex flex-col max-w-7xl mt-[40%] md:mt-0 md:py-48">
         <img className='max-w-[60%]' src="full-mark.png" alt="" />
         <div className='mt-10 flex flex-col sm:flex-row justify-start items-start'>
           <h1 className="md:max-w-[700px]  text-6xl text-neutral-100">
             Rust implementation of the Filecoin Protocol
           </h1>
           <div className='flex flex-col'>
             <h3 className='md:max-w-[500px] mt-3 text-2xl text-neutral-400 '>Run Forest to access Filecoin, the decentralized storage network.</h3>
-            <div className="py-4 flex items-center">
+            <div className="py-4 flex flex-col  md:mt-0 md:flex-row items-center">
               <Link smooth offset={40} className="btn-link border-brand-400 text-brand-400"  to="download">Download</Link>
               <a href="https://share.hsforms.com/1DrMrWob7QM-C2RRL7HW0hQ4kcdm" target="_blank" rel="noopener noreferrer" className='btn-link border-gray-700 text-neutral-200' >Reach the Team</a>
             </div>