From 0aafc0da30cc9653c4ebe3f399d7c73f13294de4 Mon Sep 17 00:00:00 2001
From: Arnaud <arnaud@status.im>
Date: Mon, 4 Nov 2024 16:40:24 +0100
Subject: [PATCH] Fix welcome background position

---
 src/components/Welcome/WelcomeCard.tsx | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/src/components/Welcome/WelcomeCard.tsx b/src/components/Welcome/WelcomeCard.tsx
index 00b26f7..ee92998 100644
--- a/src/components/Welcome/WelcomeCard.tsx
+++ b/src/components/Welcome/WelcomeCard.tsx
@@ -7,6 +7,7 @@ import { DiscordIcon } from "./DiscordIcon";
 import { Alert } from "@codex-storage/marketplace-ui-components";
 import { AlertIcon } from "../AlertIcon/AlertIcon";
 import { useEffect, useRef } from "react";
+import { classnames } from "../../utils/classnames";
 
 export function WelcomeCard() {
   const ref = useRef<HTMLDivElement>(null);
@@ -32,8 +33,15 @@ export function WelcomeCard() {
     };
   }, [ref.current]);
 
+  const clientWidth = ref.current?.clientWidth || 0;
+
   return (
-    <div className="welcome-card card" ref={ref}>
+    <div
+      className={classnames(
+        ["welcome-card card"],
+        ["welcome-card card--tiny", clientWidth <= 800]
+      )}
+      ref={ref}>
       <div className="card">
         <header>
           <div>