Make <Background /> component responsive (#4767)

- Adjusted the height of the background image to fit every possible
screen
- Added the proper rotation degree to the background
- Refactored gradient colour stop into CONST to make sure each
background image starts at the same level

**To be noted :** 
I had to use Javascript and useEffect to make the div take the entire
height of the page (turn it into a "use client" component). This was
necessary because absolute positioning by default makes the element's
sizing relative to its nearest positioned ancestor, not the entire
document.

---------

Co-authored-by: Ady Beraud <a.beraud96@gmail.com>

packages/twenty-website/src/app/contributors/page.tsx

@@ -43,13 +43,12 @@ const Contributors = async () => {
     .filter((contributor) => contributor.pullRequestCount > 0);
 
   return (
-    <>
-      <Background />
+    <Background>
       <ContentContainer>
         <Header />
         <AvatarGrid users={fitlerContributors as Contributor[]} />
       </ContentContainer>
-    </>
+    </Background>
   );
 };