Navbar shadow and Transparent navbar

  1. MDB Home Page
  2. Support Main Page
  3. MDB Angular
Topic: Navbar shadow and Transparent navbar

abdillah mursyid asked 7 years ago

anyone can help?

first, I can't remove the navbar shadow.
second, when i removed "fixed-top", the navbar background changed to white, not transparent.

here is my code

index.html

<mdb-navbar SideClass="navbar navbar-expand-lg fixed-top">
<logo>
<a class="logo navbar-brand" mdbRippleRadius href="#"><img src="https://preview.ibb.co/m6t2e7/Untitled_1.png" height="40" alt=""> </a>
</logo>
</mdb-navbar>

style.scss

.top-nav-collapse {
background-color: #7d8488 !important;
}
.navbar:not(.top-nav-collapse) {
background: transparent !important;
}
@media (max-width: 768px) {
.navbar:not(.top-nav-collapse) {
background: #7d8488 !important;
}
}

Damian Gemza staff commented 7 years ago

Dear Abdillah, Please check this link: https://mdbootstrap.com/angular/layout/navigation/#i-f-t-n . Here you can find examples of fixed-top navbar with transparent background. Is this what you're looking for? Please let me know. Best Regards, Damian

abdillah mursyid commented 7 years ago

thank you damian.. any solution for the drop shadow?

Damian Gemza staff commented 7 years ago

Try to use class z-depth-0 on your element.

abdillah mursyid commented 7 years ago

thank you damian,
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

Resolved

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