Closed sasivarnan closed 9 years ago
Isn't this a duplicate of https://github.com/zavoloklom/material-design-iconic-font/issues/10?
Hi @mjaverto. Yup I haven't noticed that issue #10. So I made a fork of it with the solution that I have suggested. You can find that here. https://github.com/sasivarnan/material-design-iconic-font
by using less / sass, you have the ability to change the default md
prefix to anything you want
.../scss/material-design-iconic-font.scss
to a local project file_variables.scss
a new line that overrides $md-css-prefix
_md-icons.scss (change from md
to mdi
)
@import "../../lib/material-design-iconic-font/scss/variables";
$md-css-prefix: mdi;
$md-font-path: "../../lib/material-design-iconic-font/fonts";
@import "../../lib/material-design-iconic-font/scss/mixins";
@import "../../lib/material-design-iconic-font/scss/path";
@import "../../lib/material-design-iconic-font/scss/core";
@import "../../lib/material-design-iconic-font/scss/sizes";
@import "../../lib/material-design-iconic-font/scss/border";
@import "../../lib/material-design-iconic-font/scss/pulled";
@import "../../lib/material-design-iconic-font/scss/spinned";
@import "../../lib/material-design-iconic-font/scss/rotated";
@import "../../lib/material-design-iconic-font/scss/icons";
and this is the result:
I am trying to use this material design iconic font in a project with Material Angular JS. Both Material Angular and material design iconic font elements having classes starting with "md-". But due to the way that this CSS is implemented, styles in this [class*=" md-"],[class^=md-] gets applied to Material Angular components too.
Kindly fix it to be compatible with that too.
Suggested fix: Change your existing CSS to i[class=" md-"], i[class^=md-] instead of [class=" md-"],[class^=md-], as the icons are embedded using tag.
Thanks in advance.