Roboto font not displaying

SOLVE
Occasional Contributor

So I am trying to get our COS pages to reflect the look of our current site but the fonts aren't showing up.

 

I have this in the main CSS file:

@import url('https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i|PT+Sans:400,400i,700,700i|Raleway:100,100i,200,200i,300,300i,400,400i,500,500i,600,600i,700,700i,800,800i,900,900i');

@import url('https://fonts.googleapis.com/css?family=Roboto:100,100i,300,300i,400,400i,500,500i,700,700i,900,900i');

@font-face {
font-family: 'Roboto';
src: url('https://fonts.googleapis.com/css?family=Roboto');
}

{% set baseFontFamily    = "Roboto, PT Sans, Sans-Serif" %} 

Reply
0 Upvotes
1 Accepted solution

Accepted Solutions
Highlighted
Advisor | Gold Partner

@Kauri since you're using google fonts, you don't need to use the @font-face in your styles. Remove that and then of course make sure you are using the baseFontFamily variable on the body or wherever you need the font changed. For example:

body {
  font-family: {{ baseFontFamily }};
}

 

--
Stefen Phelps
Web Developer / Co-founder
Kelp Creative Agency
Twitter — @stefen
Reply
0 Upvotes
1 Reply 1
Highlighted
Advisor | Gold Partner

@Kauri since you're using google fonts, you don't need to use the @font-face in your styles. Remove that and then of course make sure you are using the baseFontFamily variable on the body or wherever you need the font changed. For example:

body {
  font-family: {{ baseFontFamily }};
}

 

--
Stefen Phelps
Web Developer / Co-founder
Kelp Creative Agency
Twitter — @stefen
Reply
0 Upvotes