feat: ajust css rules & add cover background

apps/website/components/home-section-cards-header/home-section-cards-header.tsx

@@ -14,7 +14,7 @@ export function HomeSectionCardsHeader(props: HomeSectionCardsHeaderProps) {
   return (
     <>
       <main className="container relative max-w-screen-xl mx-auto relative flex flex-col mb-10">
-        <section className="relative max-w-6xl w-full mx-auto lg:h-[200px] sm:grid sm:grid-cols-3 sm:gap-4 sm:-top-10">
+        <section className="relative max-w-6xl w-full mx-auto lg:h-[200px] sm:grid sm:grid-cols-3 sm:gap-4 sm:-top-10 sm:px-4 xl:px-0">
           <div className="block p-6 border rounded-lg shadow h-full my-2 mx-2 sm:my-0 sm:mx-0
           bg-white border-gray-200
           hover:bg-gray-100

apps/website/components/home-section-comments/home-section-comments.tsx

@@ -11,7 +11,7 @@ export function HomeSectionComments(props: HomeSectionCommentsProps) {
             Ce que nos étudiants en pense
           </h3>
 
-          <div className="w-full grid md:grid-cols-3 gap-5">
+          <div className="w-full grid md:grid-cols-3 md:px-4 xl:px-0 gap-5">
             <div className="bg-gray-100 rounded-lg p-7 mx-5 md:mx-0">
               <header>
                 <div className="flex items-center">

apps/website/components/home/home.tsx

@@ -12,7 +12,7 @@ export interface HomeProps {
 export function HomeContent(props: HomeProps) {
   return (
     <div className={styles['container']}>
-      <header className="w-full min-h-[75vh] bg-gray-500"></header>
+      <header className="w-full hidden sm:block min-h-[40vh] md:min-h-[50vh] lg:min-h-[75vh] bg-gray-500 bg-cover bg-no-repeat" style={{backgroundImage: 'url(/images/home.jpeg)'}}></header>
       <HomeSectionCardsHeader />
       <HomeSectionGrid />
       <HomeSectionVideo />

apps/website/components/layout/layout.module.scss

@@ -11,7 +11,7 @@
 
   .app-content {
     position: relative;
-    padding-top: 75.5px;
+    padding-top: 58px;
     min-height: calc(100vh - 189px);
   }
 }