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
.
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
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
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
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
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
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
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.