Do you want to convert your menu to responsive? just wrap it with react-responsive-menu-hook!
It gives full control over the menu ui as well as the design of ellipsis
lineldcosta / react-responsive-menu-hook
Simple flexible hook to convert any menu links into responsive links.
react-responsive-menu-hook
Features
- Headless
- Responsive
- Extensible
Installation
yarn add react-responsive-menu-hook
# or
npm i -s react-responsive-menu-hook
Basic Usage
import React from 'react'
import ReactResponsiveMenu from 'react-responsive-menu-hook'
function App() {
return (
<ReactResponsiveMenu>
{({ getMenuProps, showEllipsis, children, open, toggle }) => {
return (
<React.Fragment>
<div {...getMenuProps({ id: 'home', style })}>Home</div>
<div {...getMenuProps({ id: 'contactUs', style })}>Contact Us</div>
<div {...getMenuProps({ id: 'aboutUs', style })}>About Us</div>
<div {...getMenuProps({ id: 'registration', style })}>Registration</div>
<div {...getMenuProps(
…To install run
npm install react-responsive-menu-hook
Demo
https://codesandbox.io/s/sharp-leavitt-w08wn?file=/src/index.js
Happy coding...! drop a comment if you have any issues!
Top comments (0)