Modifications user guide (#5207)

- Modified layout and responsive
- Added remaining user guide cards
- Added new table of content:


https://github.com/twentyhq/twenty/assets/102751374/007118e5-60f2-4572-90cf-339c134f23c4

-Added fade-in:


https://github.com/twentyhq/twenty/assets/102751374/0669c06d-3eab-484c-a5b5-3857c68f42b5

---------

Co-authored-by: Ady Beraud <a.beraud96@gmail.com>

packages/twenty-website/src/app/_server-utils/get-posts.tsx

@@ -1,9 +1,7 @@
 import { ReactElement } from 'react';
-import { toc } from '@jsdevtools/rehype-toc';
 import fs from 'fs';
 import { compileMDX } from 'next-mdx-remote/rsc';
 import path from 'path';
-import rehypeSlug from 'rehype-slug';
 import gfm from 'remark-gfm';
 
 import ArticleEditContent from '@/app/_components/ui/layout/articles/ArticleEditContent';
@@ -103,7 +101,7 @@ async function parseFrontMatterAndCategory(
   return parsedDirectory;
 }
 
-export async function compileMDXFile(filePath: string, addToc = true) {
+export async function compileMDXFile(filePath: string) {
   const fileContent = fs.readFileSync(filePath, 'utf8');
   const compiled = await compileMDX<{ title: string; position?: number }>({
     source: fileContent,
@@ -123,7 +121,6 @@ export async function compileMDXFile(filePath: string, addToc = true) {
       mdxOptions: {
         development: process.env.NODE_ENV === 'development',
         remarkPlugins: [gfm],
-        rehypePlugins: [rehypeSlug, ...(addToc ? [toc] : [])],
       },
     },
   });
@@ -147,7 +144,7 @@ export async function getPost(
   if (!fs.existsSync(filePath)) {
     return null;
   }
-  const { content, frontmatter } = await compileMDXFile(filePath, true);
+  const { content, frontmatter } = await compileMDXFile(filePath);
 
   return {
     content,