compliments font problem

[mizban]

hi guys. here is my custom css, but it dosent work, plz help!

@font-face {
font-family: nazanin;
src:local (“nazanin”),
url(“/home/pi/MagicMirror/fonts/nazanin/nazanin.woff”)format(“WOFF”);
font-weight: 100;
font-style: normal;

}
.compliments {
font-family: nazanin;
}

[pjkoeleman]

@mizban In your custom.css put the following line with your font as the first line of the custom.css.
When there is a space in the filename replace it with a ´+'.

/* Font for compliments, needs to be the first line !!! */
@import url('https://fonts.googleapis.com/css?family=Allerta+Stencil');

In the settings for your compliments, in the custom.css, set the fonts with the following line, together with other settings like font-size etc.

font-family				: 'Allerta Stencil', serif;	

Thats how I do it with a google font.

[mizban]

@pjkoeleman said in compliments font problem:

@import url(‘https://fonts.googleapis.com/css?family=Allerta+Stencil’);

i tried below, result: it works only for calendar not for newsfeed and compliments??? why?

@import url(‘https://fonts.googleapis.com/css?family=Allerta+Stencil’);
body{
margin: 20px;
position: absolute;
height: calc(100% - 20px);
width: calc(100% - 20px);
line-height: 1.5em;
-webkit-font-smoothing: antialiased;
}
.calendar {
font-family: ‘allerta stencil’, serif;
}
.compliments {
font-family: ‘allerta stencil’, serif;
}
.newsfeed {
font-family: ‘allerta stencil’, serif;
}

[pjkoeleman]

@mizban When you want your compliments in this font try;

/* Compliments */
.compliments .xlarge {
  font-family	: 'Allerta Stencil', serif;
}

This works for me

[mizban]

thank you very much pjkoeleman, for help! i tried:
.compliments div {…} and it works.