search

djibe / material

Material Design 2 for Bootstrap 4 (active fork of Daemonite Material)
https://djibe.github.io/material/
MIT License
68 stars 11 forks source link

Fix IE11 material icons issue #25

Closed lgemeinhardt closed 3 years ago

lgemeinhardt commented 3 years ago

IE11 does not show material icons, because material font is included via var (not supported in IE11) - use sass to direct include the value

Fixes: #24

djibe commented 3 years ago

Hi, thanks for this cool PR.

I have some thoughts about it: I used CSS vars because I am afraid of the space that these code repetitions will generate. Could we use a [class*='material-icons']{font-family: #{inspect($material-icon-font-family)};} fallback to declare it once instead ?

I will work soon on removing all Material icons from Material UI and replace the core ones with svg.

What do you think ?

Have a good day and thanks again for your participation.

lgemeinhardt commented 3 years ago

Thanks for the quick feedback and all the effort you spent to build/improve it!

I know that code repetitions are not nice :-( And as far as I see, the [class*='material-icons']{font-family: #{inspect($material-icon-font-family)};} change is the important one - the other changes in the utilities (material-icons-outlined, material-icons-round, material-icons-two-tone and material-icons-sharp) are more optional.

Should I adapt the PR to only have the mixings changed?

Replacing them with SVGs is for sure also an option :-)

djibe commented 3 years ago

Ok, thanks for feedback.

I'm testing it locally. I'll do the commit thanks to you.

djibe commented 3 years ago

Code is available in master. I see some bugs with IE11. I'll explore those.

By the way, how did you learn about Material UI ?

lgemeinhardt commented 3 years ago

Thank you very much! :-)

I found Material UI via google - looking for Material Design for Bootstrap - your tool was the best match (very nice showcase / samples, active and with good quality) - I compared it with https://mdbootstrap.github.io/bootstrap-material-design (looks outdated and has a custom js replacement) and http://daemonite.github.io/material/ (is your base and looks outdated and is missing features like the ripple effect)

djibe commented 3 years ago

I fixed card-img by the way: https://github.com/djibe/material/commit/a2af20b84b038fbc87973a6ed7c1739fcf22e5e4

All your feedbacks are welcome. Thanks for helping me. I'll do the closest bug ASAP.