Jonas
Jonas

Reputation: 7885

Angular Material doesn't apply text styling to html text elements?

Is it normal, that Angular Material doesn't apply styling to normal html text elements such as h1 and p?

    <h1>Hallo</h1>

    <p>Test paragaph</p>

    <button mat-raised-button>Click me!</button>

Looks like this for me:

enter image description here:

Even though I'm using the a theme, my styles.scss looks like this:

@import "~@angular/material/prebuilt-themes/indigo-pink.css";

How do make text elements look like material elements?

Upvotes: 0

Views: 472

Answers (3)

RSJ
RSJ

Reputation: 41

if you cannot imported the file .css or .scss file than you can add the css link in index.html and use all over the project.

<head>
     <link href="material/prebuilt-themes/indigo-pink.css" rel="stylesheet"> 
</head>

text you can apply your css on bellow text elements.

<input id="name" name="name" placeholder="Enter to text" type="text">

Upvotes: 0

Arun Purewal
Arun Purewal

Reputation: 457

You might need to import the font via the link or by importing it into your .css or .scss file. It is not always done automatically unless you've added Angular material via the ' ng add ' method.

Upvotes: 0

Wandrille
Wandrille

Reputation: 6811

By 'look like material elements', I presume you want the roboto font.

Have you in your style.css:

body { 
  font-family: Roboto, Arial, sans-serif;
}

Upvotes: 2

Related Questions