MDBootstrap – Navbar issue

  1. MDB Home Page
  2. Support Main Page
  3. MDB Angular
Topic: MDBootstrap – Navbar issue

Shashank Gour asked 7 years ago

Hello,

I already install the MDBootsrap  for my angular project . I copied the Navbar code from Basic example

from this link : ' https://mdbootstrap.com/angular/components/navbars ' but the code is not working

properly  as  it seems to be work on the same page whose link i have mentioned. Please help me with the

issue , the main problem is with dropdown items, onhover they does not show any wave effect. and when

i resize the width of the page to check the responsiveness there is the problem in the right side

 

<!--Navbar-->
<mdb-navbar SideClass="navbar navbar-expand-lg navbar-dark black">

<!-- Navbar brand -->
<logo><aclass="navbar-brand"href="#">Navbar</a></logo>
<!-- Collapsible content -->
<links>
<!-- Links -->
<ulclass="navbar-nav mr-auto">
<liclass="nav-item ">
<aclass="nav-link waves-light"mdbRippleRadius>Home<spanclass="sr-only">(current)</span></a>
</li>
<liclass="nav-item">
<aclass="nav-link waves-light"mdbRippleRadius>Features</a>
</li>
<liclass="nav-item">
<aclass="nav-link waves-light"mdbRippleRadius>Pricing</a>
</li>
<!-- Dropdown -->
<liclass="nav-item dropdown"dropdown>
<adropdownTogglemdbRippleRadiustype="button"class="nav-link dropdown-toggle waves-light"mdbRippleRadiusstyle="background-color:black">
Basic dropdown<span class="caret"></span></a>
<div *dropdownMenuclass="dropdown-menu dropdown dropdown-primary"role="menu">
<aclass="dropdown-item waves-light"mdbRippleRadiushref="#">Action</a>
<aclass="dropdown-item waves-light"mdbRippleRadiushref="#">Another action</a>
<aclass="dropdown-item waves-light"mdbRippleRadiushref="#">Something else here</a>
<divclass="divider dropdown-divider"></div>
<aclass="dropdown-item waves-light"mdbRippleRadiushref="#">Separated link</a>
</div>
</li>
</ul>
<!-- Links -->
<!-- Search form -->

</links>
<!-- Collapsible content -->
</mdb-navbar>
<!--/.Navbar-->

Damian Gemza staff answered 7 years ago

Dear Shashank Gour, There's no waves-effect on hover. You have to click to see waves. the i resize the width of the page to check the responsiveness there is the problem in the right side What's wrong there? Please describe your problem or provide me some screenshots. Best Regards, Damian

Shashank Gour commented 7 years ago

PFA <a href="https://drive.google.com/file/d/1Ku48MfV2AtMIU3PmDo_g1OLwXbDODJt_/view?usp=sharing">https://drive.google.com/file/d/1Ku48MfV2AtMIU3PmDo_g1OLwXbDODJt_/view?usp=sharing</a> <a href="https://drive.google.com/file/d/1X10RRLc0FsI2lz0LPLUKI7MTrWGw6PZ5/view?usp=sharing" rel="nofollow">https://drive.google.com/file/d/1X10RRLc0FsI2lz0LPLUKI7MTrWGw6PZ5/view?usp=sharing</a> <a href="https://drive.google.com/file/d/1FZFJR0PUz84fwvsb6co8YHWn5G9fiVTc/view?usp=sharing" rel="nofollow">https://drive.google.com/file/d/1FZFJR0PUz84fwvsb6co8YHWn5G9fiVTc/view?usp=sharing</a> i am beginner I installed the MDB accordingly as mention in this link ' <a href="https://mdbootstrap.com/angular/5min-quickstart/" rel="nofollow">https://mdbootstrap.com/angular/5min-quickstart/</a> ' My dropdown items are not working the way it is shown in basic example (<a href="https://mdbootstrap.com/angular/components/navbars/" rel="nofollow">https://mdbootstrap.com/angular/components/navbars/</a>) . Please help me in this   Regards, Shashank

Damian Gemza staff commented 7 years ago

This problems will be fixed in today's release. You can now download it from dev branch at github. Best Regards, Damian

Shashank Gour commented 7 years ago

Can you please share me the link of that???

Damian Gemza staff commented 7 years ago

Firstly: How did you installed MDB? via npm or you downloaded package and unpack it ? If from npm - you have to wait until we finish release procedure, because new npm package isn't prepared yet. If from package, you have to download package from dev branch instead of from master: https://github.com/mdbootstrap/Angular-Bootstrap-with-Material-Design/tree/dev and then type npm install one more time. Best Regards, Damian

Shashank Gour commented 7 years ago

I have installed MDB via npm . I will wait for the next release but can you tell me how much time will it take ?

Damian Gemza staff commented 7 years ago

Today it should be live :) Please be patient. But if you want to fix this ASAP, you can download MDB Angular from github branch dev, and copy typescript and scss files from this package to your project /node_modules/angular-bootstrap-md . Best Regards, Damian

Shashank Gour commented 7 years ago

No thanks , I will wait :D Regards, Shashank
Write
Create snippet
Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Status

Answered

Specification of the issue
  • User: Free
  • Premium support: No
  • Technology: MDB Angular
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: Yes
About author
Shashank Gour
-9Support score
5Questions 0Answers
0Snippets likes 0Snippets