feat: static my stays

components/MyPages/Blocks/Stays/EmptyUpcomingStays/emptyUpcomingStays.module.css

@@ -0,0 +1,26 @@
+.button {
+  background-color: var(--some-red-color, #ed2027);
+}
+
+.link {
+  text-decoration: none;
+}
+
+.redTitle {
+  color: var(--some-red-color, #ed2027);
+  display: block;
+}
+
+.container {
+  align-items: center;
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  min-height: 25rem;
+  gap: 2.5rem;
+  background-color: var(--some-grey-color, #f2f2f2);
+  border-radius: 0.8rem;
+  max-width: var(--max-width);
+  margin-bottom: 0.5rem;
+  padding: 0 2rem;
+}

components/MyPages/Blocks/Stays/EmptyUpcomingStays/index.tsx

@@ -0,0 +1,25 @@
+import Title from "@/components/MyPages/Title"
+import Button from "@/components/TempDesignSystem/Button"
+import styles from "./emptyUpcomingStays.module.css"
+import Link from "next/link"
+
+export default function EmptyUpcomingStaysBlock() {
+  return (
+    <section className={styles.container}>
+      <Title level="h3" as="h5" uppercase>
+        You have no upcoming stays.
+        <span className={styles.redTitle}> Where should you go next?</span>
+      </Title>
+      <Button
+        intent={"primary"}
+        className={styles.button}
+        asChild
+        type="button"
+      >
+        <Link className={styles.link} href={"#"} key={"getInspired"}>
+          Get inspired
+        </Link>
+      </Button>
+    </section>
+  )
+}