Merge pull request #30 from elijames-codecov/STAT-898-about-hero

about hero fixes
elijames-codecov · Aug 5, 2024 · e4e279a · e4e279a
2 parents 864f4e3 + e2b7a53
commit e4e279a
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 13 deletions.
diff --git a/public/images/background-images/geo-left.svg b/public/images/background-images/geo-left.svg
diff --git a/public/images/background-images/geo-right.svg b/public/images/background-images/geo-right.svg
diff --git a/src/pages/about.astro b/src/pages/about.astro
@@ -15,13 +15,13 @@ const seoMetaData = {
 <Layout title="About Fair Source" seo={seoMetaData}>
   <header class="w-full relative overflow-x-clip z-0">
     <div class="flex flex-wrap justify-center container mx-auto z-10 relative px-[0.5rem] sm:px-[1rem] md:px-[1.5rem] lg:px-[2rem] xl:px-[1.5rem] 2xl:px-[3.62rem] 3xl:px-[6.62rem]">
-      <div class="w-10/12 lg:w-9/12 xl:w-8/12 py-[3rem] lg:py-[6rem] 2xl:pt-[12.19rem] 2xl:pb-[18.06rem] 3xl:pt-[8rem] 3xl:pb-[12rem] flex-col justify-center text-center z-1">
+      <div class="w-10/12 lg:w-9/12 xl:w-8/12 py-[3rem] lg:py-[6rem] 2xl:pt-[12.19rem] 2xl:pb-[8rem] 3xl:pt-[8rem] flex-col justify-center text-center z-1">
         <h1>About Fair Source</h1>
         <p class="text-[1.75rem] font-[500] leading-[130%] tracking-[-0.035rem] mb-[1.5rem]">Learn the what, why, and who of Fair Source Software.</p>
       </div>
     </div>
-    <div class="image z-0 w-auto absolute md:top-[11rem] md:bottom-[-12rem] md:left-[-2rem] md:right-0 lg:top-[14rem] lg:top-[-14rem] lg:left:-[-6rem] lg:right-0 xl:top-[20rem] xl:bottom-[-40rem] xl:left-[-8.56rem] xl:right-0 3xl:top-[14rem] 3xl:left-[-4rem] 3xl:right-0 3xl:bottom-[-8rem]">
-      <div class="flex items-top justify-center w-[100%] relative mx-auto columns-2 gap-[4rem] z-0 xl:max-h-[30rem] 2xl:max-h-[40rem] 3xl:max-h-[60rem] overflow-clip">
+    <div class="image z-0 w-auto hidden sm:block absolute top-[10rem] left-0 right-0 bottom-[5rem] sm:top-[6rem] md:top-[6rem] md:bottom-[-12rem] md:left-[-2rem] md:right-0 lg:top-[5rem] lg:top-[-14rem] lg:left:-0 lg:right-0 xl:bottom-[-40rem] xl:left-0 xl:right-0 2xl:top-[15rem] 3xl:top-[8rem] 3xl:left-0 3xl:right-0 3xl:bottom-[-8rem]">
+      <div class="flex items-top justify-center w-[100%] relative mx-auto columns-2 md:gap-[4rem] z-0 xl:max-h-[30rem] 2xl:max-h-[40rem] 3xl:max-h-[60rem] overflow-clip">
         <div class="w-6/12 pt-[2rem]">
           <Fragment set:html={GeoLeft} />
         </div>