diff --git a/src/layouts/layout.tsx b/src/layouts/layout.tsx
index 93b6292aaa31c2a01f95349694a7b7eef74ba51c..2b41f3f576bb71254cdec1861bb3841b26123547 100644
--- a/src/layouts/layout.tsx
+++ b/src/layouts/layout.tsx
@@ -18,11 +18,17 @@ interface Props {
  * @returns {JSX.Element} The complete page
  */
 const Layout = ({ children }: Props): JSX.Element => {
-    const query = useStaticQuery(graphql`
-        query LayoutQuery {
-            site {
-                siteMetadata {
-                    icon
+    const data = useStaticQuery(graphql`
+        query {
+            directus {
+                site {
+                    icon {
+                        id
+                        imageFile {
+                            id
+                            publicURL
+                        }
+                    }
                 }
             }
         }
@@ -33,7 +39,7 @@ const Layout = ({ children }: Props): JSX.Element => {
             <Helmet>
                 <link
                     rel="icon"
-                    href={query.site.siteMetadata.icon}
+                    href={data.directus.site?.icon?.imageFile?.publicURL}
                     type="image/png"
                 />
             </Helmet>
diff --git a/src/layouts/seo.tsx b/src/layouts/seo.tsx
index 895f77d209b3c2499ffc6baca57e06eb8dbedfea..41ba2cd8e6f247d17a4673e0f5c11ed5ce0166b5 100644
--- a/src/layouts/seo.tsx
+++ b/src/layouts/seo.tsx
@@ -1,67 +1,66 @@
-import React from "react";
-import { Helmet } from "react-helmet";
-import { useStaticQuery, graphql } from "gatsby";
+import React from "react"
+import { Helmet } from "react-helmet"
+import { useStaticQuery, graphql } from "gatsby"
 
 const SEO = () => {
-  const query = useStaticQuery(
-    graphql`
-      query SeoQuery {
-        site {
-          siteMetadata {
-            title
-            description
-            author
-            theme
-          }
+    const data = useStaticQuery(graphql`
+        query {
+            directus {
+                site {
+                    id
+                    theme
+                    title
+                    description
+                    author
+                }
+            }
         }
-      }
-    `
-  );
-  const dt = query.site.siteMetadata;
+    `)
+    const dt = data.directus.site
 
-  return (
-    <Helmet
-      htmlAttributes={{
-        lang: `fr`,
-        "data-theme": dt.theme,
-      }}
-      title={dt.title}
-      meta={[
-        {
-          name: `description`,
-          content: dt.description,
-        },
-        {
-          property: `og:title`,
-          content: dt.title,
-        },
-        {
-          property: `og:description`,
-          content: dt.description,
-        },
-        {
-          property: `og:type`,
-          content: `website`,
-        },
-        {
-          name: `twitter:card`,
-          content: `summary`,
-        },
-        {
-          name: `twitter:creator`,
-          content: dt.author,
-        },
-        {
-          name: `twitter:title`,
-          content: dt.title,
-        },
-        {
-          name: `twitter:description`,
-          content: dt.description,
-        },
-      ]}
-    />
-  );
-};
+    return (
+        <Helmet
+            htmlAttributes={{
+                lang: `fr`,
+                "data-theme": dt?.theme,
+            }}
+            title={dt?.title}
+            meta={[
+                {
+                    name: `description`,
+                    content: dt?.description,
+                },
+                {
+                    property: `og:title`,
+                    content: dt?.title,
+                },
+                {
+                    property: `og:description`,
+                    content: dt?.description,
+                },
+                {
+                    property: `og:type`,
+                    content: `website`,
+                },
+                {
+                    name: `twitter:card`,
+                    content: `summary`,
+                },
+                {
+                    name: `twitter:creator`,
+                    content: dt?.author,
+                },
+                {
+                    name: `twitter:title`,
+                    content: dt?.title,
+                },
+                {
+                    name: `twitter:description`,
+                    content: dt?.description,
+                },
+            ]}
+        />
+    )
+}
 
-export default SEO;
+export default SEO
diff --git a/src/pages-doc/doc/core/menu.tsx b/src/pages-doc/doc/core/menu.tsx
index 780f9cc6e9953def686a11feacfc19dbefebed9c..2ba74ea66c90e64d5c3147cf3d034ab5556f54c7 100644
--- a/src/pages-doc/doc/core/menu.tsx
+++ b/src/pages-doc/doc/core/menu.tsx
@@ -71,7 +71,7 @@ const menu = () => {
             <div>
                 <h3 className="underline underline-offset-1">Menu Footer</h3>
                 <div className="flex gap-6 m-4">
-                    <Menu name='Footer'/>
+                    <Menu name='Footer' className="menu menu-horizontal p-0"/>
                 </div>
             </div>
         </Content>