User guide layout (#5016)

- Modified CSS: font-size, colors, margins...

- Added an ArticleContent Component that will be used for the changelog
and user guide articles, which contains the styles for each titles,
paragraphs, images etc.

- Added link to User Guide in footer

- Added a UserGuideWarning Component: 

<img width="332" alt="Screenshot 2024-04-17 at 18 14 48"
src="https://github.com/twentyhq/twenty/assets/102751374/0f5c601b-a2c0-4c63-baeb-1990d65fc332">

- Added a UserGuideEditContent Component:

<img width="394" alt="Screenshot 2024-04-17 at 18 16 24"
src="https://github.com/twentyhq/twenty/assets/102751374/6c7c3bd4-c5bb-4d02-8f93-bd99bc30ce7b">

- Added a UserGuideLink Component (for usage in MDX to allow links to
open in new tab)

- Fixed table of content

- Made responsive

---------

Co-authored-by: Ady Beraud <a.beraud96@gmail.com>
Co-authored-by: Félix Malfait <felix.malfait@gmail.com>

packages/twenty-website/src/app/releases/get-releases.tsx

@@ -2,7 +2,6 @@ import { JSXElementConstructor, ReactElement } from 'react';
 import fs from 'fs';
 import matter from 'gray-matter';
 import { compileMDX } from 'next-mdx-remote/rsc';
-import remarkBehead from 'remark-behead';
 import gfm from 'remark-gfm';
 
 import { ReleaseNote } from '@/app/releases/api/route';
@@ -60,7 +59,7 @@ export async function getMdxReleasesContent(
         parseFrontmatter: true,
         mdxOptions: {
           development: process.env.NODE_ENV === 'development',
-          remarkPlugins: [gfm, [remarkBehead, { depth: 2 }]],
+          remarkPlugins: [gfm],
         },
       },
     });