feat: clone product card and create design UI to map with json file

2025-12-22 14:12:43 +07:00
parent a2e5b56eb8
commit 6912f2605c
11 changed files with 399 additions and 11 deletions
@@ -211,6 +211,41 @@
      }
    }
  },
+  {
+    "VtFeaturedProducts": {
+      "config": {
+        "title": "best-seller",
+        "styles": {
+          "container": "content-container py-12 px-[100px] small:py-24",
+          "header": {
+            "container": "flex justify-between mb-8",
+            "title": "txt-xlarge",
+            "link": ""
+          },
+          "list": "grid grid-cols-2 small:grid-cols-3 gap-x-6 gap-y-24 small:gap-y-36",
+          "productCard": {
+            "className": "relative overflow-hidden rounded-2xl border border-[#285A86] bg-ui-bg-base shadow-elevation-card-rest h-full flex flex-col",
+            "badge": {
+              "container": "p-4",
+              "text": "z-20 px-3 py-1 border-[0.5px] rounded bg-[#c9e0f5] txt-compact-small-plus shadow-borders-base text-[#285A86]"
+            },
+            "thumbnail": {
+              "className": "rounded-none h-[240px]",
+              "size": "full"
+            },
+            "content": "flex flex-col flex-1 justify-between p-4",
+            "title": "text-ui-fg-subtle text-[18px]",
+            "price": "flex items-center gap-x-1 text-[#285A86] font-bold",
+            "button": {
+              "addToCart": "w-full h-[40px] bg-black text-white rounded-md",
+              "moreInfo": "w-full h-[40px] border border-[#285A86] text-[#285A86] rounded-md"
+            }
+          }
+        }
+      }
+    }
+  },
+  
  {
    "CartMismatchBanner": {
      "config": {