Topic: Hover color Navbar dropdown not same example???
Jeen Pholwat Sanpholkrang asked 6 years ago
Hi,
Hover color Navbar dropdown not same example, What about for issue ? Help me please.
Jakub Mandra staff premium answered 6 years ago
Hello,
Thanks for reporting, we'll fix the documentation.
Use color="primary" in MDBNavbar and add this prop to MDBDropdownMenu:
<MDBDropdownMenu color="primary">
Best,
Jakub
Jeen Pholwat Sanpholkrang answered 6 years ago
Hello, Thanks for reply me, from you example is not working for me. For now i get the same issue.
Jakub Mandra staff premium answered 6 years ago
Hey,
try this example code please:
import React, { Component } from "react";
import {
MDBNavbar, MDBNavbarBrand, MDBNavbarNav, MDBNavItem, MDBNavLink, MDBNavbarToggler, MDBCollapse, MDBFormInline,
MDBDropdown, MDBDropdownToggle, MDBDropdownMenu, MDBDropdownItem
} from "mdbreact";
class NavbarPage extends Component {
state = {
isOpen: false
};
toggleCollapse = () => {
this.setState({ isOpen: !this.state.isOpen });
}
render() {
return (
<MDBNavbar color="primary-color" dark expand="md">
<MDBNavbarBrand>
<strong className="white-text">Navbar</strong>
</MDBNavbarBrand>
<MDBNavbarToggler onClick={this.toggleCollapse} />
<MDBCollapse id="navbarCollapse3" isOpen={this.state.isOpen} navbar>
<MDBNavbarNav left>
<MDBNavItem active>
<MDBNavLink to="#!">Home</MDBNavLink>
</MDBNavItem>
<MDBNavItem>
<MDBNavLink to="#!">Features</MDBNavLink>
</MDBNavItem>
<MDBNavItem>
<MDBNavLink to="#!">Pricing</MDBNavLink>
</MDBNavItem>
<MDBNavItem>
<MDBDropdown>
<MDBDropdownToggle nav caret>
<span className="mr-2">Dropdown</span>
</MDBDropdownToggle>
<MDBDropdownMenu color="primary">
<MDBDropdownItem href="#!">Action</MDBDropdownItem>
<MDBDropdownItem href="#!">Another Action</MDBDropdownItem>
<MDBDropdownItem href="#!">Something else here</MDBDropdownItem>
<MDBDropdownItem href="#!">Something else here</MDBDropdownItem>
</MDBDropdownMenu>
</MDBDropdown>
</MDBNavItem>
</MDBNavbarNav>
<MDBNavbarNav right>
<MDBNavItem>
<MDBFormInline waves>
<div className="md-form my-0">
<input className="form-control mr-sm-2" type="text" placeholder="Search" aria-label="Search" />
</div>
</MDBFormInline>
</MDBNavItem>
</MDBNavbarNav>
</MDBCollapse>
</MDBNavbar>
);
}
}
export default NavbarPage;
Jakub Mandra staff premium answered 6 years ago
Ah and colorful Dropdown Menu with animations is available only in mdbreact PRO package.
Please check our docs here: https://mdbootstrap.com/docs/react/components/dropdowns/
Best,
Jakub
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- User: Free
- Premium support: No
- Technology: MDB React
- MDB Version: 4.13.0
- Device: macos
- Browser: google
- OS: High sierra
- Provided sample code: No
- Provided link: No