#Angular Cards styling different from those in documentation.
28 messages · Page 1 of 1 (latest)
That's because your system font is different from the font on the material's website.
This is the font used by material
https://fonts.google.com/specimen/Roboto
Roboto is imported by defalt when installing Angular Material. Isn't it?
Did you follow initial guide to setup your material environment?
In particular for your case:
https://material.angular.io/guide/typography
Yep, already tried it at least 3 times in separate projects
Which font is used when you inspect your project page?
Are you really sure you follow the rest of initial setup for theming too?
Well this guide is more about customizing the typography. I want to use the one thats included without any changes
I suspect you're missing entirely or in big part Material theming.
Why your card background is grey?
That's a good question I don't have an answer to. All I did was follow the installer after typing in the npm add @angular/material command
ng add, not npm.
But npm has no add command, so I'm sure you confused its name now that you posted.
Did you select a theme as explained in the guide?
Oh right, ng. My bad
Anyhow, I selected the pink-bluegrey theme, selected yes for global typography and added Animations module
Did you get prompted with selection of theme, typography and animations?
Yep.
Do you have your project on a public repo?
Sure, this is the branch with latest version
https://github.com/Floppy-code/MySkin/tree/dev/myskin-spa
Would you create a Stackblitz for that?
Will try
You can simply connect your repo, if you don't wanna copy manually its files.
For some reason the @angular/materal dependency wasn't installed though
It does not run.
It eerors out about css imports.
Now that's something. Will take a look at it in the morning. Same code runs on localhost
Had to redo a the stackblitz upload so it can work again.
https://stackblitz.com/edit/node-bp7uf3