diff --git a/docs/src/modules/components/overview/CommunityOrPro.tsx b/docs/src/modules/components/overview/CommunityOrPro.tsx
index 7e6dcbf3de21..835491349883 100644
--- a/docs/src/modules/components/overview/CommunityOrPro.tsx
+++ b/docs/src/modules/components/overview/CommunityOrPro.tsx
@@ -40,7 +40,7 @@ export default function CommunityOrPro() {
 
           <Button
             size="small"
-            href="/x/introduction/licensing"
+            href="/x/introduction/licensing/"
             endIcon={<ArrowForwardIcon />}
             sx={{ width: 'fit-content' }}
           >
@@ -60,7 +60,7 @@ export default function CommunityOrPro() {
                 'Free forever under an MIT license. Includes Date Pickers, Time Pickers, and Date Time Pickers.',
               ]}
               backgroundColor="subtle"
-              link="/pricing"
+              link="/pricing/"
             />
           </Box>
           <Box sx={{ flexBasis: '50%' }}>
@@ -71,7 +71,7 @@ export default function CommunityOrPro() {
                 'Requires a commercial license. Includes all Community components plus the Date and Time Range Pickers.',
               ]}
               backgroundColor="subtle"
-              link="/pricing"
+              link="/pricing/"
             />
           </Box>
         </Stack>
diff --git a/docs/src/modules/components/overview/InfoCard.tsx b/docs/src/modules/components/overview/InfoCard.tsx
index aaaebb419a61..c13bbfec8cd4 100644
--- a/docs/src/modules/components/overview/InfoCard.tsx
+++ b/docs/src/modules/components/overview/InfoCard.tsx
@@ -6,23 +6,24 @@ import Stack from '@mui/material/Stack';
 import Paper from '@mui/material/Paper';
 
 type InfoCardProps = {
-  title: string;
-  description?: string | string[];
-  icon?: React.ReactNode;
-  onClick?: () => void;
   active?: boolean;
   backgroundColor?: 'gradient' | 'subtle';
+  description?: string | string[];
+  icon?: React.ReactNode;
   link?: string;
+  onClick?: () => void;
+  title: string;
 };
-export default function InfoCard({
-  title,
-  description,
-  icon: Icon,
-  onClick,
-  active,
-  backgroundColor = 'gradient',
-  link,
-}: InfoCardProps) {
+export default function InfoCard(props: InfoCardProps) {
+  const {
+    active,
+    backgroundColor = 'gradient',
+    description,
+    icon: Icon,
+    link,
+    onClick,
+    title,
+  } = props;
   const clickable = Boolean(onClick);
 
   return (
@@ -78,7 +79,11 @@ export default function InfoCard({
         }),
       })}
     >
-      <Stack direction="row" spacing={2} sx={{ mb: description ? 2 : 0, width: '100%' }}>
+      <Stack
+        direction="row"
+        spacing={2}
+        sx={{ mb: description ? 2 : 0, width: '100%', alignItems: 'center' }}
+      >
         {Icon}
         <Typography
           gutterBottom