Topic: social floating buttons did not look like mdb style
Expected behavior
*Resources (screenshots, code snippets etc.)
This code may actually cause this error in this case. Try this solution:
ngAfterViewInit() {
const buttons = this.elRef.nativeElement.querySelectorAll('.btn-floating');
buttons.forEach((el: any) => {
this.renderer.removeClass(el, 'btn-floating');
this.renderer.addClass(el, 'px-3');
this.renderer.addClass(el.firstElementChild, 'fa-3x');
});
}
Rehab Othman free commented 3 years ago
still have same issue after used your code
Grzegorz Bujański staff commented 3 years ago
Your code for buttons and carousel is in the same component? Try to isolate the carousel as a separate component.
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Answered
- ForumUser: Free
- Premium support: No
- Technology: MDB Angular
- MDB Version: 10.0.0
- Device: labtop
- Browser: chrome
- OS: windows 10 pro
- Provided sample code: No
- Provided link: Yes
Grzegorz Bujański staff commented 3 years ago
Hi. How can we recreate this issue? Please provide the code that causes the malfunction.
Rehab Othman free commented 3 years ago
I added code in .ts file cause this issue and once I removed it every thing is ok.
This code I removed was for mdb component (Multi-item carousel gallery) so if I need to use both in same page I can not. so can u check please this section what I am talking about: ngAfterViewInit() { const buttons = document.querySelectorAll('.btn-floating'); buttons.forEach((el: any) => { this.renderer.removeClass(el, 'btn-floating'); this.renderer.addClass(el, 'px-3'); this.renderer.addClass(el.firstElementChild, 'fa-3x'); }); }