added 3 new onboarding scenes

packages/fakeyou.com/src/components/common/Card/Card.scss

@@ -8,6 +8,26 @@
   transition: 0.2s;
   position: relative;
 
+  .card-bg {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+    z-index: 1;
+    transition: all 0.2s;
+
+    &:hover {
+      cursor: pointer;
+      transform: scale(1.04);
+    }
+
+    &.card-bg-hover {
+      transform: scale(1.05);
+    }
+  }
+
   .card-img {
     width: 100%;
     transition: 0.4s ease;

packages/fakeyou.com/src/components/common/Card/Card.tsx

@@ -41,9 +41,13 @@ export default function Card({
           textHovered ? "bottom-text-hover" : ""
         }`.trim()}
         style={{
-          backgroundImage: `url(${backgroundImage})`,
-          backgroundSize: "cover",
-          backgroundPosition: "center",
+          // ...(backgroundImage
+          //   ? {
+          //       backgroundImage: `url(${backgroundImage})`,
+          //       backgroundSize: "cover",
+          //       backgroundPosition: "center",
+          //     }
+          //   : {}),
           height: height || "auto",
           borderWidth: borderWidth || "1px",
           borderStyle: "solid",
@@ -54,6 +58,13 @@ export default function Card({
         onMouseLeave={onMouseLeave}
       >
         {children}
+        {backgroundImage && (
+          <img
+            src={backgroundImage}
+            alt="Thumbnail"
+            className={`card-bg ${textHovered ? "card-bg-hover" : ""}`}
+          />
+        )}
       </div>
       {bottomText && (
         <h6

packages/fakeyou.com/src/v2/view/pages/landing/storyteller/OnboardingSelection/OnboardingSelection.tsx

@@ -10,31 +10,34 @@ export default function OnboardingSelection(props: OnboardingSelectionProps) {
 
   const cards = [
     {
-      text: "Room Scene",
+      text: "Room",
       backgroundImage: "/images/landing/onboarding/room-scene-thumbnail.webp",
       onClick: () => {
         history.push("/studio-intro/m_ejhs95fc5aybp36h4a79k7523ds6an");
       },
     },
     {
-      text: "Scene 2",
-      backgroundImage: "",
+      text: "Pirate Island",
+      backgroundImage:
+        "/images/landing/onboarding/pirate-island-scene-thumbnail.webp",
       onClick: () => {
-        history.push("/studio-intro");
+        history.push("/studio-intro/m_0tmgwem7x4k47w4cq96ja8psnvnaw5");
       },
     },
     {
-      text: "Scene 3",
-      backgroundImage: "",
+      text: "Spaceship",
+      backgroundImage:
+        "/images/landing/onboarding/spaceship-scene-thumbnail.webp",
       onClick: () => {
-        history.push("/studio-intro");
+        history.push("/studio-intro/m_16cc8b0dtp5fmjgb3yh85hnxyd695c");
       },
     },
     {
-      text: "Scene 4",
-      backgroundImage: "",
+      text: "Hanashi",
+      backgroundImage:
+        "/images/landing/onboarding/hanashi-scene-thumbnail.webp",
       onClick: () => {
-        history.push("/studio-intro");
+        history.push("/studio-intro/m_r4025m9dq0hppqzh8t6tmpmxv47yyv");
       },
     },
   ];