Material-UI Core Dropdowns
-Pro Component
We’ve decided to create this component to make it easier for it to be rendered both on responsive and desktop mode.
FREE
Navbar Dropdown
Check out our custom made dropdown for
Navbar
(AppBar
)
and
Sidebar
.
Copy
import React from "react";
// @material-ui/core components
// @material-ui/icons components
// core components
import NavbarDropdown from "components/Dropdowns/NavbarDropdown.js";
export default function Example() {
return (
<>
<NavbarDropdown />
</>
);
}
PRO
Apps Dropdown
Copy
import React from "react";
// @material-ui/core components
// @material-ui/icons components
// core components
import AppsDropdown from "components/Dropdowns/AppsDropdown.js";
export default function Example() {
return (
<>
<AppsDropdown />
</>
);
}
Apps Dropdown Alternative
Copy
import React from "react";
// @material-ui/core components
// @material-ui/icons components
// core components
import AppsDropdownAlternative from "components/Dropdowns/AppsDropdownAlternative.js";
export default function Example() {
return (
<>
<AppsDropdownAlternative />
</>
);
}
Notifications Dropdown
Copy
import React from "react";
// @material-ui/core components
// @material-ui/icons components
// core components
import NotificationsDropdown from "components/Dropdowns/NotificationsDropdown.js";
export default function Example() {
return (
<>
<NotificationsDropdown />
</>
);
}
Notifications Dropdown Alternative
Copy
import React from "react";
// @material-ui/core components
// @material-ui/icons components
// core components
import NotificationsDropdownAlternative from "components/Dropdowns/NotificationsDropdownAlternative.js";
export default function Example() {
return (
<>
<NotificationsDropdownAlternative />
</>
);
}
User Dropdown
Copy
import React from "react";
// @material-ui/core components
// @material-ui/icons components
// core components
import UserDropdown from "components/Dropdowns/UserDropdown.js";
export default function Example() {
return (
<>
<UserDropdown />
</>
);
}
User Dropdown Alternative
Copy
import React from "react";
// @material-ui/core components
// @material-ui/icons components
// core components
import UserDropdownAlternative from "components/Dropdowns/UserDropdownAlternative.js";
export default function Example() {
return (
<>
<UserDropdownAlternative />
</>
);
}
Props
We’ve made these components static, i.e. it does not come with props. We’ve done so, in order for our users to easily duplicate it and change it with their own props and specs.