Placement of '@import url"

Hello,

I need to import the below in my app, when i put in within the tag outside template, is show’s on the webpage as content.

App is not compiling on putting it in a css file.

Not sure where to put?Could not find any doc explaining it. Any pointer would help.

@import url(https://fonts.googleapis.com/css?family=Raleway:500,700,800);
@import url(https://fonts.googleapis.com/css?family=Maven+Pro:400,700);

I think you have to put it in a CSS-file in /public/.

Why not put <link href='http://fonts.googleapis.com/css?family=Raleway:500,700,800|Maven+Pro:400,700' rel='stylesheet' type='text/css'> in the <head>?

1 Like

I just added those @import lines to my project’s .css file and it worked.

# meteor create google-fonts
google-fonts: created.                        

To run your new app:                          
cd google-fonts                             
meteor                                      
# cat >> google-fonts/google-fonts.css 
@import url(https://fonts.googleapis.com/css?family=Raleway:500,700,800);
@import url(https://fonts.googleapis.com/css?family=Maven+Pro:400,700);
^D

Thanks. The issue was in the file loading order, when meteor combines all the css the import statement is not getting at the top of the combined css page.

Solved it by having a file with name beginning a “a_” which is loaded first and the import gets to the top of page.

Jay