@gardenfi/garden-book 0.1.93 → 0.1.94

package/dist/ui.es.js

@@ -17151,7 +17151,7 @@ const placeholderUrl = "data:image/svg+xml,%3csvg%20width='384'%20height='216'%2
   date: i,
   title: n,
   className: s,
-  thumbnailClassName: a
+  description: a
 }) => {
   const [o, l] = useState(!1), [c, f] = useState(e ?? placeholderUrl);
   useEffect(() => {
@@ -17160,39 +17160,81 @@ const placeholderUrl = "data:image/svg+xml,%3csvg%20width='384'%20height='216'%2
   const u = () => {
     f(placeholderUrl);
   };
-  return /* @__PURE__ */ jsx(Opacity, { level: "semi-dark", className: "gf-rounded-2xl h-full", children: /* @__PURE__ */ jsxs("div", { className: cn(s, "gf-overflow-hidden gf-rounded-2xl"), children: [
-    /* @__PURE__ */ jsx(
-      "div",
-      {
-        className: cn(a, `${o ? "" : "gf-filter gf-blur-md"}`),
-        children: /* @__PURE__ */ jsx(
-          buildExports.LazyLoadImage,
-          {
-            alt: n,
-            effect: "blur",
-            src: c,
-            onLoad: () => l(!0),
-            onError: u
-          }
-        )
-      }
-    ),
-    /* @__PURE__ */ jsxs("div", { className: "gf-px-4 gf-pt-4 gf-pb-5 gf-md:px-5 gf-md:pb-11", children: [
-      /* @__PURE__ */ jsxs("div", { className: "gf-flex gf-justify-between gf-mb-3", children: [
-        /* @__PURE__ */ jsx(
-          Typography,
-          {
-            size: "h5",
-            weight: "medium",
-            className: "gf-bg-rose gf-px-3 gf-py-1 gf-rounded-full",
-            children: t
-          }
-        ),
-        /* @__PURE__ */ jsx(Typography, { size: "h5", weight: "medium", className: "gf-px-3 gf-py-1", children: i })
-      ] }),
-      /* @__PURE__ */ jsx(Typography, { size: "h3", weight: "bold", children: n })
-    ] })
-  ] }) });
+  return /* @__PURE__ */ jsx(
+    Opacity,
+    {
+      level: "semi-dark",
+      className: "gf-rounded-2xl gf-relative gf-w-[328px] sm:gf-w-fit md:gf-w-[792px]",
+      children: /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: cn(
+            s,
+            "gf-overflow-hidden gf-p-3 sm:gf-p-5 gf-flex gf-flex-col  gf-justify-between"
+          ),
+          children: /* @__PURE__ */ jsxs(
+            "div",
+            {
+              className: cn(
+                "gf-grid gf-grid-cols-[auto,auto] gf-grid-rows-[auto_auto] "
+              ),
+              children: [
+                /* @__PURE__ */ jsxs("div", { className: "gf-flex gf-flex-col sm:gf-pr-4 sm:gf-justify-between sm:gf-h-fit sm:gf-flex-row gf-gap-2 sm:gf-col-start-1 sm:gf-row-start-2 gf-w-full gf-pt-1.5 sm:gf-pt-6 gf-col-start-1 gf-row-start-1", children: [
+                  /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
+                    Typography,
+                    {
+                      size: "h5",
+                      weight: "medium",
+                      className: "gf-bg-rose gf-px-3 gf-py-1 gf-rounded-full",
+                      children: t
+                    }
+                  ) }),
+                  /* @__PURE__ */ jsx(
+                    Typography,
+                    {
+                      size: "h5",
+                      weight: "medium",
+                      className: "gf-px-3 gf-py-1 !gf-text-[#817A90]",
+                      children: i
+                    }
+                  )
+                ] }),
+                /* @__PURE__ */ jsx(
+                  "div",
+                  {
+                    className: `gf-col-start-2 gf-row-start-1 gf-row-end-2  gf-justify-self-end sm:gf-row-span-2 ${o ? "" : "gf-filter gf-blur-md"}`,
+                    children: /* @__PURE__ */ jsx(
+                      buildExports.LazyLoadImage,
+                      {
+                        alt: n,
+                        effect: "blur",
+                        src: c,
+                        onLoad: () => l(!0),
+                        onError: u,
+                        className: " gf-rounded-lg gf-h-[68px] gf-w-[120px] sm:gf-w-[234px] sm:gf-h-[132px] gf-object-cover"
+                      }
+                    )
+                  }
+                ),
+                /* @__PURE__ */ jsxs("div", { className: "gf-flex gf-flex-col gf-gap-2 sm:gf-pr-4  gf-pt-[2px] gf-col-start-1 gf-row-start-2 gf-col-span-2 sm:gf-col-start-1 sm:gf-row-start-1 sm:gf-col-span-1 gf-justify-items-end", children: [
+                  /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(Typography, { size: "h3", weight: "bold", className: "gf-h-6 sm:gf-text-xl", children: n }) }),
+                  a && /* @__PURE__ */ jsx(
+                    Typography,
+                    {
+                      size: "h4",
+                      weight: "medium",
+                      className: " !gf-text-[#817A90] gf-line-clamp-2 gf-overflow-hidden gf-leading-6 sm:gf-leading-5 sm:gf-pr-4",
+                      children: a
+                    }
+                  )
+                ] })
+              ]
+            }
+          )
+        }
+      )
+    }
+  );
 }, questCardStyles = cva(
   ["gf-w-full gf-max-w-96 gf-p-4 gf-pb-5 md:gf-p-6 md:gf-pb-8 gf-rounded-2xl"],
   {