Docusaurus: make parallel blocks functional

docusaurus.config.ts

@@ -97,42 +97,75 @@ const config: Config = {
       style: 'dark',
       links: [
         {
-          title: 'Docs',
+          title: 'Products',
           items: [
             {
-              label: 'Tutorial',
-              to: '/docs/intro',
+              label: 'Client',
+              href: 'https://prisma.io/client',
+            },
+            {
+              label: 'Migrate',
+              href: 'https://prisma.io/migrate',
+            },
+            {
+              label: 'Accelerate',
+              href: 'https://prisma.io/accelerate',
+            },
+            {
+              label: 'Pulse',
+              href: 'https://prisma.io/pulse',
+            },
+            {
+              label: 'Pricing',
+              href: 'https://prisma.io/pricing',
             },
           ],
         },
         {
-          title: 'Community',
+          title: 'Developers',
           items: [
             {
-              label: 'Stack Overflow',
-              href: 'https://stackoverflow.com/questions/tagged/docusaurus',
+              label: 'Docs',
+              to: '/',
+            },
+            {
+              label: 'Get Started',
+              to: '/getting-started',
             },
             {
-              label: 'Discord',
-              href: 'https://discordapp.com/invite/docusaurus',
+              label: 'Prisma Examples',
+              href: 'https://github.com/prisma/prisma-examples',
             },
+          ],
+        },
+        {
+          title: 'Use Cases',
+          items: [
             {
-              label: 'Twitter',
-              href: 'https://twitter.com/docusaurus',
+              label: 'Customer Stories',
+              href: 'https://www.prisma.io/showcase',
+            },
+            {
+              label: 'Enterprise',
+              href: 'https://www.prisma.io/enterprise',
             },
           ],
         },
         {
-          title: 'More',
+          title: 'Company',
           items: [
             {
-              label: 'GitHub',
-              href: 'https://github.com/facebook/docusaurus',
+              label: 'About',
+              href: 'https://prisma.io/about',
+            },
+            {
+              label: 'Blog',
+              to: 'https://prisma.io/blog',
             },
           ],
         },
       ],
-      copyright: `Copyright © ${new Date().getFullYear()} My Project, Inc. Built with Docusaurus.`,
+      copyright: `Copyright © ${new Date().getFullYear()} Prisma Data, Inc. Built with Docusaurus.`,
     },
     prism: {
       theme: prismThemes.github,

src/theme/MDXComponents.tsx

@@ -27,9 +27,25 @@ const SwitchTech: React.FC<React.PropsWithChildren> = ({ children }) => {
   return <p>{children}</p>
 }
 
-// TODO: we should fix this
 const ParallelBlocks: React.FC<React.PropsWithChildren> = ({ children }) => {
-  return <>{children}</>
+  const childArray = React.Children.toArray(children).map(child => {
+    if (React.isValidElement(child)) {
+      return <div className='col col--6'>
+        <b>{child.props.content}</b>
+        <div>{child}</div>
+      </div>
+    } else {
+      return <div className='col col--6'>
+        <div>{child}</div>
+      </div>
+    }
+  });
+
+  return <div className='container'>
+    <div className='row'>
+      {childArray}
+    </div>
+  </div>
 }
 
 type ButtonColor = 'red' | 'green' | 'grey' | 'grey-bg' | 'dark'