diff --git a/index.d.ts b/index.d.ts
index 2018547620a3dad0d9b3aeac4c631129acb8087a..67022921762e0fd0d3fce6355924e820c5d883f1 100644
--- a/index.d.ts
+++ b/index.d.ts
@@ -148,7 +148,7 @@ interface IMenuMobile {}
export function MenuMobile(props: IMenu): JSX.Element
interface Ilogo {
- to?: string
+ url?: string
src?: string
title: string
image?: any
diff --git a/src/components/Events.tsx b/src/components/Events.tsx
index e50e6bf632207a34b477fc6472bd569031ea91fc..72d00800e21349413fb80faa8d47e84a4552a9f0 100644
--- a/src/components/Events.tsx
+++ b/src/components/Events.tsx
@@ -7,7 +7,7 @@ interface Props {
const Events = (props: Props) => {
const dataDirectus = useStaticQuery(graphql`
- query MyQuery {
+ query getEvents {
directusWithDatePos: directus {
events(filter: { date_start: { _gte: "now" } }, limit: 3) {
id
diff --git a/src/components/Footer.tsx b/src/components/Footer.tsx
index 6264834fe8466f1c6bc2d9c02a3115dc9eddbd6a..e8ff700b691bb4f3f420e830e21a6d610878633f 100644
--- a/src/components/Footer.tsx
+++ b/src/components/Footer.tsx
@@ -1,6 +1,6 @@
import React from "react"
-import { Link, Logo } from "@onegeo/gatsby-theme-onegeo"
-import image from "../../../gatsby-theme-onegeo/src/images/logo-egeo.png"
+import { Logo, Menu, Socials } from "@onegeo/gatsby-theme-onegeo"
+import { graphql, useStaticQuery } from "gatsby"
interface Props {
className?: string
@@ -8,65 +8,40 @@ interface Props {
const Footer = (props: Props) => {
const { className = "" } = props
- const url = '#'
+
+ const dataDirectus = useStaticQuery(graphql`
+ query getLogoFooter {
+ directus {
+ site {
+ logo {
+ id
+ }
+ }
+ }
+ }
+ `)
+
+ const idLogo = dataDirectus.directus.site.logo?.id
+
return (
<footer
- className={`fixed bottom-0 footer items-center p-4 bg-base-200 ${className}`}
+ className={`fixed bottom-0 footer items-center px-4 bg-base-200 ${className}`}
>
<div className="items-center grid-flow-col">
- <Logo
- title=""
- image={image}
- to={url}
- className="w-[150px]"
+ <Logo
+ title=""
+ image={`${process.env.DIRECTUS_URL}assets/${idLogo}`}
+ url="/"
+ className="w-10"
/>
</div>
- <div className="grid-flow-col md:justify-self-center">
- {/* <a className="link link-hover">Navbar</a> */}
- <Link to={url} activeClassName="link link-hover">
- Navbar
- </Link>
- </div>
- <div className="grid-flow-col md:justify-self-center">
- {/* <a className="link link-hover">Partners</a> */}
- <Link to={url} activeClassName="link link-hover">
- Partners
- </Link>
+ <div className="justify-self-center">
+ <Menu name="Footer" />
</div>
<div className="grid-flow-col gap-4 md:place-self-center md:justify-self-end">
- <Link to={url}>
- <svg
- xmlns="http://www.w3.org/2000/svg"
- width="24"
- height="24"
- viewBox="0 0 24 24"
- className="fill-current"
- >
- <path d="M24 4.557c-.883.392-1.832.656-2.828.775 1.017-.609 1.798-1.574 2.165-2.724-.951.564-2.005.974-3.127 1.195-.897-.957-2.178-1.555-3.594-1.555-3.179 0-5.515 2.966-4.797 6.045-4.091-.205-7.719-2.165-10.148-5.144-1.29 2.213-.669 5.108 1.523 6.574-.806-.026-1.566-.247-2.229-.616-.054 2.281 1.581 4.415 3.949 4.89-.693.188-1.452.232-2.224.084.626 1.956 2.444 3.379 4.6 3.419-2.07 1.623-4.678 2.348-7.29 2.04 2.179 1.397 4.768 2.212 7.548 2.212 9.142 0 14.307-7.721 13.995-14.646.962-.695 1.797-1.562 2.457-2.549z"></path>
- </svg>
- </Link>
- <Link to={url}>
- <svg
- xmlns="http://www.w3.org/2000/svg"
- width="24"
- height="24"
- viewBox="0 0 24 24"
- className="fill-current"
- >
- <path d="M19.615 3.184c-3.604-.246-11.631-.245-15.23 0-3.897.266-4.356 2.62-4.385 8.816.029 6.185.484 8.549 4.385 8.816 3.6.245 11.626.246 15.23 0 3.897-.266 4.356-2.62 4.385-8.816-.029-6.185-.484-8.549-4.385-8.816zm-10.615 12.816v-8l8 3.993-8 4.007z"></path>
- </svg>
- </Link>
- <Link to={url}>
- <svg
- xmlns="http://www.w3.org/2000/svg"
- width="24"
- height="24"
- viewBox="0 0 24 24"
- className="fill-current"
- >
- <path d="M9 8h-3v4h3v12h5v-12h3.642l.358-4h-4v-1.667c0-.955.192-1.333 1.115-1.333h2.885v-5h-3.808c-3.596 0-5.192 1.583-5.192 4.615v3.385z"></path>
- </svg>
- </Link>
+ <div className="flex gap-2 m-4">
+ <Socials layout="row" />
+ </div>
</div>
</footer>
)
diff --git a/src/components/Header.tsx b/src/components/Header.tsx
index 8ce9361255a37231d08228e38771302ea1179382..1765a8f39473e5fcc499ebb87e8de3bf4c909c24 100644
--- a/src/components/Header.tsx
+++ b/src/components/Header.tsx
@@ -1,9 +1,9 @@
import React from "react"
import Logo from "./core/Logo"
import Menu from "./core/Menu"
-import logoSig from "../images/logo-egeo.png"
import MenuMobile from "./core/MenuMobile"
import Profil from "./core/Profil"
+import { graphql, useStaticQuery } from "gatsby"
interface IHeader {
className?: string
@@ -11,6 +11,20 @@ interface IHeader {
}
const Header = (props: IHeader) => {
+ const dataDirectus = useStaticQuery(graphql`
+ query getLogoHeader {
+ directus {
+ site {
+ logo {
+ id
+ }
+ }
+ }
+ }
+ `)
+
+ const idLogo = dataDirectus.directus.site.logo?.id
+
const url = "#"
return (
<>
@@ -39,17 +53,17 @@ const Header = (props: IHeader) => {
</div>
{/*----------------- LOGO --------------------------*/}
<div className="flex-shrink-0 flex items-center">
- <Logo
- image={logoSig}
- to={url}
- className="w-[150px]"
+ <Logo
+ image={`${process.env.DIRECTUS_URL}assets/${idLogo}`}
+ url={url}
+ className="w-10"
/>
</div>
{/*-----------------END LOGO --------------------------*/}
</div>
{/* ---------------MENU------------------ */}
<div className="navbar-center hidden lg:flex">
- <Menu className="text-base-100"/>
+ <Menu name="header" className="text-base-100" />
</div>
{/* ---------------END MENU------------------ */}
<div className="navbar-end">
diff --git a/src/components/Partners.tsx b/src/components/Partners.tsx
index 83dd2bf2bd0b362ec560117a853c6f5f8a30413f..923797c53eef071b98bec97903b7176ff386b551 100644
--- a/src/components/Partners.tsx
+++ b/src/components/Partners.tsx
@@ -12,7 +12,7 @@ const Partners = (props: Props) => {
const { className = "", delay = 2000 } = props
const dataDirectus = useStaticQuery(graphql`
- query myQuery {
+ query getPartners {
directus {
partners {
id
diff --git a/src/components/Section.tsx b/src/components/Section.tsx
index 732de3aa056e00f84d3093b49d0f281b89578286..af976f1938ee44bd34684eca56d4cf23f732fad6 100644
--- a/src/components/Section.tsx
+++ b/src/components/Section.tsx
@@ -10,7 +10,7 @@ interface ISection {
}
const GRAPHQL_QUERY = graphql`
- query {
+ query getSections {
directus {
sections {
id
diff --git a/src/components/Socials.tsx b/src/components/Socials.tsx
index 2db29c0fe4a961f64b90ecc7eaa0a0cf0e55fb84..f3d44f763ec5ba88e988cd1cb61cbc1bfe79cfae 100644
--- a/src/components/Socials.tsx
+++ b/src/components/Socials.tsx
@@ -1,3 +1,4 @@
+import { graphql, useStaticQuery } from "gatsby"
import React from "react"
import Logo from "./core/Logo"
@@ -9,21 +10,44 @@ interface ISocials {
}
const Socials = (props: ISocials) => {
- const { layout, name, logo, url } = props
+ const dataDirectus = useStaticQuery(graphql`
+ query getSocials {
+ directus {
+ socials {
+ name
+ url
+ id
+ logo {
+ id
+ }
+ }
+ }
+ }
+ `)
+
+ const dataSocials = dataDirectus.directus.socials
+
+ const { layout } = props
return (
- <div
- className={`tooltip ${
- layout == "row" ? "tooltip-bottom" : "tooltip-right"
- } `}
- data-tip={name}
- >
- <Logo
- image={logo}
- to={url}
- className={"w-10 h-10"}
- classImg={" h-10 w-10"}
- />
+ <div className={`flex ${layout == "col" ? "flex-col w-8" : ""} gap-2`}>
+ {dataSocials.map((item: any, key: number) => {
+ return (
+ <div
+ className={`tooltip ${
+ layout == "row" ? "tooltip-top" : "tooltip-right"
+ } `}
+ data-tip={item.name}
+ key={key}
+ >
+ <Logo
+ image={`${process.env.DIRECTUS_URL}assets/${item.logo.id}`}
+ url={item.url}
+ className={"w-7 h-7"}
+ />
+ </div>
+ )
+ })}
</div>
)
}
diff --git a/src/components/core/Link.tsx b/src/components/core/Link.tsx
index 45cd33531e319cead67b2fb5bb908502a4604768..2da1a925e4e6c63a683ad16b342c74ba17ab1b12 100644
--- a/src/components/core/Link.tsx
+++ b/src/components/core/Link.tsx
@@ -39,7 +39,7 @@ const Link = ({
// Si "to" n'est pas dans la liste des pages, c'est un lien externe
// ignore le "/" Ã la fin du 'path' et de 'to'
const internal = data.allSitePage.nodes.find(
- ({ path }) => path.replace(/\/+$/, "") === to.replace(/\/+$/, "")
+ ({ path }) => path.replace(/\/+$/, "") === to?.replace(/\/+$/, "")
)
// Use Gatsby Link for internal links, and <a> for others
diff --git a/src/components/core/Logo.tsx b/src/components/core/Logo.tsx
index e649e5bd78f6dbfc4027308f2118a1d4a4b7524f..d38531845a249d5365cf7a8e8c954319beffa695 100644
--- a/src/components/core/Logo.tsx
+++ b/src/components/core/Logo.tsx
@@ -1,32 +1,30 @@
import { Link } from "@onegeo/gatsby-theme-onegeo"
import React from "react"
-import Image, {Iimage} from "./Image"
+import Image, { Iimage } from "./Image"
interface Ilogo extends Iimage {
- to?: string
+ url?: string
src?: string
title?: string
- image?:any,
- className?:string
+ image?: any
+ className?: string
}
const Logo = (props: Ilogo) => {
- const { to, title, image, className } = props
+ const { url, title, image, className } = props
return (
- <>
- <div
- className={`flex justify-center flex-col items-center ${className}`}
- >
- <Link to={to} className="">
- <Image image = {image} className=""/>
+ <div className={`flex justify-center flex-col items-center `}>
+ {url ? (
+ <Link to={url} className="">
+ <Image image={image} className={className} />
</Link>
- {
- title &&
- <div className="text-xs mt-2">{title}</div>
- }
- </div>
- </>
+ ) : (
+ <Image image={image} className={className} />
+ )}
+
+ {title && <div className="text-xs mt-2">{title}</div>}
+ </div>
)
}
diff --git a/src/pages-doc/doc/core/logo.tsx b/src/pages-doc/doc/core/logo.tsx
index e67276e3eb9915d2da8f6a6f0960a79432e1da13..a9c8b925ff66c50b35507a01c03999e1678ca46e 100644
--- a/src/pages-doc/doc/core/logo.tsx
+++ b/src/pages-doc/doc/core/logo.tsx
@@ -15,7 +15,7 @@ const logo = () => {
<pre>
<code>
{`interface Props {
- to?: string;
+ url?: string;
className: string;
src?: string;
title: string;
diff --git a/src/pages-doc/doc/socials.tsx b/src/pages-doc/doc/socials.tsx
index 6dba421c7bd27faced40e1c1d05fa98b0b33f87d..94cff14d34128fd17600f2d5c1277a79fee96fa4 100644
--- a/src/pages-doc/doc/socials.tsx
+++ b/src/pages-doc/doc/socials.tsx
@@ -1,19 +1,7 @@
-import React, { ReactElement } from "react"
-import { Socials,Link, Content } from "@onegeo/gatsby-theme-onegeo"
-import { graphql, PageProps } from "gatsby"
+import React from "react"
+import { Socials, Link, Content } from "@onegeo/gatsby-theme-onegeo"
-type Logo = {
- id: string
-}
-
-type Data = {
- directus: {
- partners: [id: string, name: string, logo: Logo]
- }
-}
-
-const socials = ({ data }: PageProps<Data>): ReactElement => {
- const dataList = data.directus.partners
+const socials = () => {
return (
<Content>
@@ -36,7 +24,7 @@ const socials = ({ data }: PageProps<Data>): ReactElement => {
query {
directus {
- partners(filter: {type: {_eq: "sociaux"}}) {
+ socials {
id
name
url
@@ -55,56 +43,15 @@ const socials = ({ data }: PageProps<Data>): ReactElement => {
<h2>Example</h2>
</div>
<h2>reseaux sociaux</h2>
- <div className="flex gap-2 m-4">
- {dataList.map((item: any) => {
- return (
- <div key={item.id}>
- <Socials
- name={item.name}
- url={item.url}
- logo={`${process.env.DIRECTUS_URL}assets/${item.logo.id}`}
- layout="row"
- />
- </div>
- )
- })}
- </div>
- <h2>reseaux sociaux</h2>
- <div className="flex flex-col gap-2 m-4">
- {dataList.map((item: any) => {
- return (
- <div key={item.id}>
- <Socials
- name={item.name}
- url={item.url}
- logo={`${process.env.DIRECTUS_URL}assets/${item.logo.id}`}
- layout="col"
- />
- </div>
- )
- })}
+ <div>
+ <Socials layout="row" />
+ </div>
+ <div className="mt-10">
+ <Socials layout="col" />
</div>
- {/* <div className="flex gap-6 m-4">
- <Socials dataList={dataList} layout="col" />
- </div> */}
</Content>
)
}
export default socials
-
-export const query = graphql`
- query {
- directus {
- partners {
- id
- name
- url
- logo {
- id
- }
- }
- }
- }
-`