Merge pull request #40 from elijames-codecov/eli/fixes-3

fixes

src/pages/companies.astro

@@ -16,7 +16,7 @@ const seoMetaData = {
 
 <Layout title="Fair Source Companies" seo={seoMetaData}>
   <header class="relative flex flex-wrap justify-center items-center">
-    <div class="container w-12/12 pt-[3rem] px-[0.5rem] sm:px-[1rem] md:px-[1.5rem] lg:w-8/12 text-center lg:pt-[12.19rem] z-10">
+    <div class="container w-8/12 pt-[3rem] px-[0.5rem] sm:px-[1rem] md:px-[1.5rem] lg:w-8/12 text-center lg:pt-[12.19rem] z-10">
       <h1>Fair Source Companies</h1>
       <p class="mb-[1.5rem] text-[1.75rem] text-black font-[500] leading-[130%] tracking-[-0.035rem]">
         Read in their own words what companies have to say about joining Fair Source.
@@ -59,9 +59,9 @@ const seoMetaData = {
           <div class="absolute bg-[url('/images/background-images/companiesWantTo-left.svg')] bg-contain bg-no-repeat bg-left-bottom min-h-[15rem] w-1/3 lg:w-1/2 left-0 bottom-0"></div>
           <div class="absolute bg-[url('/images/background-images/companiesWantTo-right.svg')] hidden md:block bg-no-repeat bg-contain bg-right-bottom h-[20rem] lg:h-full w-1/2 right-0 bottom-0"></div>
         </div>
-        <div class="flex-col w-12/12 max-w-[25rem] md:w-10/12 lg:w-8/12 lg:max-w-none text-center justify-center lg:py-[12rem] z-10">
+        <div class="flex-col mx-auto w-4/12 pt-[10rem] lg:w-8/12 lg:max-w-none text-center justify-center lg:py-[12rem] z-10">
           <h2>Want to list your company?</h2>
-          <div class="justify-center flex">
+          <div class="justify-center flex pt-10">
             <Button url="/join" type="secondary" color="black" cta="Join Fair Source"></Button>
           </div>
         </div>

src/pages/join.astro

@@ -6,6 +6,7 @@ import { Image } from 'astro:assets';
 import auditForSecretsImage from '../assets/adopt/auditforsecrets.png';
 import publishYourRepoImage from '../assets/adopt/publishyourrepo.png';
 import adoptHeroImage from '../assets/adopt/adoptHeroImage.png';
+import adoptHeroImageDesktop from '../assets/adopt/adoptHeroImageDesktop.png';
 
 const mobileSectionCommonClasses = 'z-0 pb-0 pt-[12.31rem] sm:pt-[9.12rem] sm:pb-[1.56rem] sm:px-[3rem] md:pt-[6.69rem] md:pb-[7.44rem]';
 const mobileSectionBackgroundImageClasses = 'h-[12.31rem] top-0 left-0 sm:bottom-0 sm:h-auto md:top-[1rem] md:bottom-[1rem] md:left-[1rem] md:w-auto md:h-auto';
@@ -19,7 +20,10 @@ const seoMetaData = {
 ---
 <Layout title="Join Fair Source" seo={seoMetaData}>
   <header class="container relative mx-auto flex flex-wrap 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] pb-[0.5rem] pb-[1rem]">
-    <div class="relative block lg:absolute lg:right-[2rem] lg:bottom-0 lg:top-0 lg:w-1/2 xl:right-[2rem] 2xl:right-[3.62rem] 3xl:right-[6.62rem]">
+    <div class="hidden relative lg:block lg:absolute lg:right-[2rem] lg:bottom-0 lg:top-0 lg:w-1/2 xl:right-[2rem] 2xl:right-[3.62rem] 3xl:right-[6.62rem]">
+      <Image src={adoptHeroImageDesktop} alt="How to adopt fair source" densities={[1, 2, 3]} class="w-[100%] h-auto"/>
+    </div>
+    <div class="block relative lg:hidden lg:absolute lg:right-[2rem] lg:bottom-0 lg:top-0 lg:w-1/2 xl:right-[2rem] 2xl:right-[3.62rem] 3xl:right-[6.62rem]">
       <Image src={adoptHeroImage} alt="How to adopt fair source" densities={[1, 2, 3]} class="w-[100%] h-auto"/>
     </div>
     <div class="w-12/12 py-[3rem] lg:w-5/12 lg:py-[8rem] xl:pb-[15.25rem] xl:pt-[12.38rem]">

src/pages/licenses.astro

@@ -27,7 +27,7 @@ const cardTitleClasses = `font-sans text-[1.375rem] font-[500] color-black leadi
       <Image src={HeroImage} alt="How to adopt fair source" densities={[1, 2, 3]}/>
     </div>
     <div class="relative flex">
-      <div class="w-12/12 py-[7rem] 2xl:pt-[12rem] 2xl:pb-[17.56rem] lg:w-4/12">
+      <div class="w-12/12 py-[2rem] lg:py-[7rem] 2xl:pt-[12rem] 2xl:pb-[17.56rem] lg:w-4/12">
         <h1>Fair Source Licenses</h1>
       </div>
     </div>