first commit

src/pages/Trending/TrendingSmallGrid.jsx

@@ -0,0 +1,54 @@
+// import TrendingCard from "./TrendingCard";
+
+// const smallTrendingData = [
+//   { title: "Sarees", img: "/hero1.jpg", href: "/sarees" },
+//   { title: "Lehengas", img: "/hero2.jpg", href: "/lehenga" },
+//   { title: "Kurtas", img: "/hero3.jpg", href: "/kurtas" },
+//   { title: "Patola", img: "/hero1.jpg", href: "/patola" },
+// ];
+
+// const TrendingSmallGrid = () => {
+//   return (
+//     <section>
+//       <h2 className="text-xl font-bold text-gray-900 px-3 mb-3">
+//         Trending Categories
+//       </h2>
+
+//       <div className="grid grid-cols-2 gap-3 px-3">
+//         {smallTrendingData.map((item, i) => (
+//           <TrendingCard key={i} {...item} />
+//         ))}
+//       </div>
+//     </section>
+//   );
+// };
+
+// export default TrendingSmallGrid;
+
+
+
+
+import TrendingCard from "./TrendingCard";
+
+const smallTrendingData = [
+  { title: "Sarees", img: "/hero1.jpg", href: "/sarees" },
+  { title: "Lehengas", img: "/hero2.jpg", href: "/lehenga" },
+  { title: "Kurtas", img: "/hero3.jpg", href: "/kurtas" },
+  { title: "Patola", img: "/hero1.jpg", href: "/patola" },
+];
+
+const TrendingSmallGrid = () => {
+  return (
+    <section className="py-6 px-4 md:px-10">
+      <h2 className="text-2xl font-bold text-gray-900 mb-5">Trending Categories</h2>
+
+      <div className="grid grid-cols-2 sm:grid-cols-3 md:grid-cols-4 gap-4">
+        {smallTrendingData.map((item, i) => (
+          <TrendingCard key={i} {...item} />
+        ))}
+      </div>
+    </section>
+  );
+};
+
+export default TrendingSmallGrid;