diff --git a/index.d.ts b/index.d.ts
index 06457ba9587599a614eb4a4ccde44f4012749fc4..6dec1e3072f75fbf58ed9da710a6b1e45e108ed7 100644
--- a/index.d.ts
+++ b/index.d.ts
@@ -143,14 +143,11 @@ interface ISocials {
export function Socials(props: ISocials): JSX.Element
interface IMenu {
- classname?: string
+ className?: string
name?: string
}
export function Menu(props: IMenu): JSX.Element
-interface IMenuMobile {}
-export function MenuMobile(props: IMenu): JSX.Element
-
interface Ilogo {
url?: string
src?: string
diff --git a/index.js b/index.js
index 6d156c481e49219f610f972d5928b87764b2e5ff..771317cc665dfac0fc0b56a3fbadc81d1e8a4167 100644
--- a/index.js
+++ b/index.js
@@ -39,9 +39,6 @@ export { default as Cookies } from "./src/components/Cookies"
// Menu components
export { default as Menu } from "./src/components/core/Menu"
-// Menu components
-export { default as MenuMobile } from "./src/components/core/MenuMobile"
-
// Header components
export { default as Header } from "./src/components/Header"
diff --git a/src/components/Header.tsx b/src/components/Header.tsx
index 1765a8f39473e5fcc499ebb87e8de3bf4c909c24..e794c753eb47d28ca9db6dd1885287d21759745b 100644
--- a/src/components/Header.tsx
+++ b/src/components/Header.tsx
@@ -1,7 +1,6 @@
import React from "react"
import Logo from "./core/Logo"
import Menu from "./core/Menu"
-import MenuMobile from "./core/MenuMobile"
import Profil from "./core/Profil"
import { graphql, useStaticQuery } from "gatsby"
@@ -48,7 +47,7 @@ const Header = (props: IHeader) => {
</svg>
</label>
{/* ---------------MENU MOBILE------------------ */}
- <MenuMobile />
+ <Menu name="header" className="menu menu-compact dropdown-content mt-3 p-2 shadow bg-base-100 rounded-box w-52 z-50" />
{/* ---------------END MENU MOBILE------------------ */}
</div>
{/*----------------- LOGO --------------------------*/}
@@ -63,7 +62,7 @@ const Header = (props: IHeader) => {
</div>
{/* ---------------MENU------------------ */}
<div className="navbar-center hidden lg:flex">
- <Menu name="header" className="text-base-100" />
+ <Menu name="header" className="menu menu-horizontal p-0 text-base-100" />
</div>
{/* ---------------END MENU------------------ */}
<div className="navbar-end">
diff --git a/src/components/core/Menu.tsx b/src/components/core/Menu.tsx
index ec7ab5e7628f1fa1d95b26d56527a16a00bc0b3b..ef493391cfb04901cf3c3b2d50a351dd37a93a9f 100644
--- a/src/components/core/Menu.tsx
+++ b/src/components/core/Menu.tsx
@@ -72,7 +72,7 @@ const Menu = (props: Imenu) => {
return (
<>
{/* MENU standart */}
- <ul className={`menu menu-horizontal p-0 ${className}`}>
+ <ul className={className}>
{menu?.map((item: any, key: number) => {
return (
<li key={key}>
diff --git a/src/components/core/MenuMobile.tsx b/src/components/core/MenuMobile.tsx
deleted file mode 100644
index 45acd05b5d064d13b27853f17f634fc65e386d7e..0000000000000000000000000000000000000000
--- a/src/components/core/MenuMobile.tsx
+++ /dev/null
@@ -1,104 +0,0 @@
-import { Link } from "@onegeo/gatsby-theme-onegeo"
-import { graphql, useStaticQuery } from "gatsby"
-import React from "react"
-
-const MenuMobile = () => {
-
- const data = useStaticQuery(graphql`
- fragment MenuItem on DirectusData_menus {
- name
- url
- page {
- slug
- }
- }
-
- fragment MenusRecursive on DirectusData_menus {
- children {
- ...MenuItem
- children {
- ...MenuItem
- children {
- ...MenuItem
- }
- }
- }
- }
-
- query {
- directus {
- menus(
- filter: {
- status: { _eq: "published" }
- }
- ) {
- name
- ...MenusRecursive
- }
- }
- }
- `)
-
- const menuContent = data.directus.menus
-
- const header = menuContent.filter((head:any) => {
- return head.name == "Header"
- })
-
- const menu = header[0].children
-
- const items = (item:any) => {
- return (
- <ul className="p-2 z-50 bg-base-100 shadow-md">
- {item.children.map((itemChild: any, idx: number) => {
- return (
- <li key={idx}>
- <Link
- to={(itemChild.url) ? itemChild.url : ( (itemChild.page?.slug) ? itemChild.page?.slug : "#" )}
- activeClassName=" hover:bg-submenu active:bg-allsubmenu z-50"
- >
- {itemChild.name}
- </Link>
- {(itemChild?.children.length > 0) && items(itemChild)}
- </li>
- )
- })}
- </ul>
- )
- }
-
- return (
- <>
- {/* MENU Mobile */}
- <ul
- tabIndex={0}
- className="menu menu-compact dropdown-content mt-3 p-2 shadow bg-base-100 rounded-box w-52 z-50"
- >
- {menu.map((item: any, key: number) => {
- return (
- <li key={key}>
- <Link to={(item.url) ? item.url : ((item.page?.slug) ? item.page?.slug : "#")}>
- {item.name}
- {(item?.children.length > 0) && (
- <svg
- className="fill-current"
- xmlns="http://www.w3.org/2000/svg"
- width="24"
- height="24"
- viewBox="0 0 24 24"
- >
- <path d="M8.59,16.58L13.17,12L8.59,7.41L10,6L16,12L10,18L8.59,16.58Z" />
- </svg>
- )}
- </Link>
- {item?.children.length > 0 && items(item)}
- </li>
- )
- })}
- </ul>
- {/* END MENU Mobile */}
- </>
- )
-}
-
-export default MenuMobile
diff --git a/src/pages-doc/doc/core/menu.tsx b/src/pages-doc/doc/core/menu.tsx
index dea62b1a38511f7b8663e3081eaed8e9ae99888b..780f9cc6e9953def686a11feacfc19dbefebed9c 100644
--- a/src/pages-doc/doc/core/menu.tsx
+++ b/src/pages-doc/doc/core/menu.tsx
@@ -1,6 +1,6 @@
import React from "react"
import { Content } from "@onegeo/gatsby-theme-onegeo"
-import { Menu, MenuMobile, Link } from "@onegeo/gatsby-theme-onegeo"
+import { Menu, Link } from "@onegeo/gatsby-theme-onegeo"
const menu = () => {
return (
@@ -57,14 +57,14 @@ const menu = () => {
<div className="mt-5">
<h3 className="underline underline-offset-1">Menu Header</h3>
<div className="flex gap-6 m-4">
- <Menu name='Header'/>
+ <Menu name="header" className="menu menu-horizontal p-0" />
</div>
</div>
<div>
<h3 className="underline underline-offset-1">Menu mobile</h3>
<div className="flex gap-6 m-4">
- <MenuMobile />
+ <Menu name='Header' className="menu menu-compact dropdown-content mt-3 p-2 shadow bg-base-100 rounded-box w-52 z-50"/>
</div>
</div>