creativetimofficial/material-dashboard

in Dropdowns there are square boxes due to invalid hsx codes, and simillar situation is with chevron.

harshad-pindoriya opened this issue · 3 comments

in Dropdowns there are square boxes due to invalid hsx codes, and simillar situation is with chevron.

@infinitietech05 this issue was automatically closed because it did not follow the bellow rules:

IMPORTANT: Please use the following link to create a new issue:

https://www.creative-tim.com/new-issue/material-dashboard

**If your issue was not created using the app above, it will be closed immediately.**



Love Creative Tim? Do you need Angular, React, Vuejs or HTML? You can visit:
👉  https://www.creative-tim.com/bundles
👉  https://www.creative-tim.com


@infinitietech05 thank you for pointing out. Font Awesome became a Paid service so the solution would be to have the Official Bootstrap Icons itegrated: https://icons.getbootstrap.com/

We will integrate them in the next release.

Till then:

  1. Replace the code from
    <script src="https://kit.fontawesome.com/42d5adcbca.js" crossorigin="anonymous"></script> with <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css">

  2. Replace the icons where you have them <i class="fas fa-search" aria-hidden="true"></i> with <i class="bi bi-search"></i>

More icons istallation can be found here: https://icons.getbootstrap.com/#install

@dragosct @marqbeniamin please note this for future updates and we also need to check other products and replace the icons.

Best,
Alex

@alexandru-paduraru sir, I managed to solve this using the following method:

.dropdown .dropdown-toggle:after,
.dropup .dropdown-toggle:after,
.dropstart .dropdown-toggle:after,
.dropend .dropdown-toggle:after {
content: "\25BE";
}