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.

Sign up for GitHub

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

Jump to bottom

Print order of magnitude of each class/property in concentric icons #227

Open

tfrancart opened this issue Sep 21, 2021 · 2 comments

Labels

kind: Idea for later 💡

Contributor

tfrancart commented Sep 21, 2021

See ideas at https://www.google.com/search?q=concentric%20circles%20icons%20scale&tbm=isch&tbs=rimg:CatDloMSzOaoYegMFtXEOO8ksgIGCgIIABAA&client=ubuntu&hs=HLa&hl=fr&sa=X&ved=0CAIQrnZqFwoTCMj0svCRj_MCFQAAAAAdAAAAABAL&biw=1908&bih=968

5 levels to represent order of magnitude :

1-tens (up to 100)
2-hundreds (up to 1000)
3-thousands (up to 10000)
4-ten-thousands (up to 100000)
5-hundred-thousands (up to 1.000.000)

tfrancart added the kind: Idea for later 💡 label

Contributor Author

tfrancart commented Apr 23, 2023 •

edited

Loading

Note : Fontawesome has an API to print a counter next to the icon: https://fontawesome.com/docs/apis/javascript/methods#counter-content-params
Here are some tricks to make counter larger : FortAwesome/angular-fontawesome#165

Contributor Author

tfrancart commented Apr 23, 2023

See layer technique of font-awesome : https://fontawesome.com/docs/web/style/layer

:host ::ng-deep .fa-custom-counter {
  transform: scale(0.5) translateX(50%) translateY(-50%);
}

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment