Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support material symbols #56

Open
epictecch opened this issue Feb 22, 2023 · 1 comment
Open

Support material symbols #56

epictecch opened this issue Feb 22, 2023 · 1 comment

Comments

@epictecch
Copy link

In our project we used material icons and now we want to switch to the new material symbols.
By default, the <mat-icon> tag - as it is used by the fab-menu project - uses material icons. However, we would like to get rid of the material icons in our project.
It would be nice if users of the fab-menu were able to use material symbols.

I think there are several ways how you can specify that the <mat-icon> tag shall use material symbols and whether you want to use the outlined, rounded or sharp version. One possibility is to use CSS classes. E.g. <mat-icon class="material-symbols-outlined">edit</mat-icon>.

One solution approach might be to offer a new @Input in the MatFabMenuComponent which allows users to pass one (or several?) CSS classes which are then applied to the <mat-icon> tags in mat-fab-menu.component.html and mat-mini-fab-menu.component.html. I think this could also enable further customization for other use cases.

@epictecch
Copy link
Author

Just came across another component which offers a very nice solution for the same problem.
ngx-mat-select-search offers the possibility to pass a whole item which is then used as replacement for the default icon like this: https://github.com/bithost-gmbh/ngx-mat-select-search/blob/a6f5776f1e9b98eb45cbad84332649bd8e3590c2/src/app/mat-select-search/mat-select-search.component.html#L47

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant