products and product/slug page done

components/pages/products/slug/features.tsx

@@ -0,0 +1,27 @@
+export function Features({ features }: { features: string[] }) {
+  return (
+    <table className="w-full rounded-xl overflow-hidden">
+      <thead>
+        <tr className="border-b border-gray-700 bg-black">
+          <th className="px-4 py-4 md:px-6 text-left text-sm md:text-base font-semibold text-white">
+            Feature
+          </th>
+        </tr>
+      </thead>
+      <tbody>
+        {features.map((feature, index) => (
+          <tr
+            key={index}
+            className={` border-gray-700 transition-colors hover:bg-opacity-80 ${
+              index % 2 === 0 ? "bg-[#323232]" : "bg-black/20"
+            }`}
+          >
+            <td className="px-4 py-4 md:px-6 text-sm md:text-base text-white font-medium">
+              {feature}
+            </td>
+          </tr>
+        ))}
+      </tbody>
+    </table>
+  );
+}