docs: redesign cards (#8671)

* docs: redesign cards

* fix build error

www/apps/resources/app/recipes/subscriptions/examples/standard/page.mdx

@@ -29,15 +29,13 @@ By following this example, you’ll have a subscription commerce store with the
     href: "https://github.com/medusajs/examples/tree/main/subscription",
     title: "Subscription Example Repository",
     text: "Find the full code for this recipe example in this repository.",
-    startIcon: <Github />,
-    showLinkIcon: false
+    icon: Github,
   },
   {
     href: "https://res.cloudinary.com/dza7lstvk/raw/upload/v1721125608/OpenApi/Subscriptions_OpenApi_b371x4.yml",
     title: "OpenApi Specs for Postman",
     text: "Imported this OpenApi Specs file into tools like Postman.",
-    startIcon: <PlaySolid />,
-    showLinkIcon: false
+    icon: PlaySolid,
   },
 ]} />
 

www/apps/resources/app/recipes/subscriptions/page.mdx

@@ -36,15 +36,13 @@ You can link the subscription data model to models of other modules, such as the
     href: "!docs!/basics/modules-and-services",
     title: "Create a Module",
     text: "Learn how to create a module.",
-    startIcon: <AcademicCapSolid />,
-    showLinkIcon: false
+    icon: AcademicCapSolid,
   },
   {
     href: "!docs!/basics/data-models",
     title: "Create a Data Model",
     text: "Learn how to create a data model.",
-    startIcon: <AcademicCapSolid />,
-    showLinkIcon: false
+    icon: AcademicCapSolid,
   },
 ]} />
 
@@ -62,8 +60,7 @@ If you want to create subscriptions on the product level, you can link the subsc
   href="!docs!/advanced-development/modules/module-links"
   title="Define a Module Link"
   text="Learn how to define a module link."
-  startIcon={<AcademicCapSolid />}
-  showLinkIcon={false}
+  icon={AcademicCapSolid}
 />
 
 ---
@@ -87,15 +84,13 @@ Implementing the logic depends on your use case, but you'll mainly implement the
     href: "!docs!/basics/api-routes",
     title: "Create an API Route",
     text: "Learn how to create an API route.",
-    startIcon: <AcademicCapSolid />,
-    showLinkIcon: false
+    icon: AcademicCapSolid,
   },
   {
     href: "!docs!/basics/scheduled-jobs",
     title: "Create a Scheduled Job",
     text: "Learn how to create a scheduled job.",
-    startIcon: <AcademicCapSolid />,
-    showLinkIcon: false
+    icon: AcademicCapSolid,
   }
 ]} />
 
@@ -111,8 +106,7 @@ Although Medusa provides a Stripe module provider, it doesn't handle subscriptio
   href="/references/payment/provider"
   title="Create Payment Module Provider"
   text="Learn how to create a payment module provider."
-  startIcon={<AcademicCapSolid />}
-  showLinkIcon={false}
+  icon={AcademicCapSolid}
 />
 
 ---
@@ -128,15 +122,13 @@ Extend the Medusa Admin to add widgets to existing pages or add new pages.
     href: "!docs!/advanced-development/admin/widget",
     title: "Create Admin Widget",
     text: "Learn how to add widgets into existing admin pages.",
-    startIcon: <AcademicCapSolid />,
-    showLinkIcon: false
+    icon: AcademicCapSolid,
   },
   {
     href: "!docs!/advanced-development/admin/ui-routes",
     title: "Create Admin UI Routes",
     text: "Learn how to add new pages to your Medusa Admin.",
-    startIcon: <AcademicCapSolid />,
-    showLinkIcon: false
+    icon: AcademicCapSolid,
   }
 ]} />
 
@@ -151,14 +143,12 @@ Medusa provides a Next.js Starter. Since you've customized your Medusa project,
     href: "/nextjs-starter",
     title: "Option 1: Use Next.js Starter",
     text: "Install the Next.js Starter to customize it.",
-    startIcon: <AcademicCapSolid />,
-    showLinkIcon: false
+    icon: AcademicCapSolid,
   },
   {
     href: "/storefront-development",
     title: "Option 2: Build Custom Storefront",
     text: "Find guides for your storefront development.",
-    startIcon: <AcademicCapSolid />,
-    showLinkIcon: false
+    icon: AcademicCapSolid,
   }
 ]} />