style: covering images

Author: NoeTerrier

app/src/components/DirectusImage.tsx

@@ -13,10 +13,12 @@ export default function DirectusImage({
   img,
   name,
   className,
+  cover,
 }: {
   img?: string | components["schemas"]["Files"] | null;
   name?: string;
   className?: string;
+  cover?: boolean;
 }) {
   if (img) {
     return (
@@ -25,7 +27,7 @@ export default function DirectusImage({
           loader={imageLoader}
           src={typeof img === "string" ? img : img.filename_disk || ""}
           fill
-          style={{ objectFit: "contain" }}
+          style={{ objectFit: cover ? "cover" : "contain" }}
           alt={name || "image"}
         />
       </div>

app/src/components/NewsCard.tsx

@@ -15,6 +15,7 @@ export default function NewsCard({ news }: { news: News }) {
         img={translation.banner}
         name={translation.title || ""}
         className={styles.picture}
+        cover={true}
       />
 
       <div>

app/src/styles/globals.scss

@@ -30,7 +30,7 @@ a {
 
 .CLICLogo {
   width: 100%;
-  height: 30rem;
+  height: 15rem;
   fill: white;
   margin: auto;
   margin-top: 30vh;