How to import Google Fonts on a Stylus file?

fegemo picture fegemo · Aug 20, 2014 · Viewed 7.9k times · Source

I'd like to know how can I import Google Fonts from a stylus (.styl) file. I tried:

@import url(http://fonts.googleapis.com/css?family=Overlock:400,700,400italic,700italic|Calligraffitti)

...but it failed on my console when compiling with the following error:

Potentially unhandled rejection [2] ParseError: C:\Users\Coutinho\Documents\GitHub\bespoke-theme-fancy\lib\theme.styl:5
   1| // Bespoke Classes: https://github.com/markdalgleish/bespoke-classes
   2| // Stylus: http://learnboost.github.io/stylus
   3|
   4| @import 'normalizecss/normalize.css'
 > 5| @import url(http://fonts.googleapis.com/css?family=Overlock:400,700,400italic,700italic|Calligraffitti)
   6|
   7| $font-family-serif 'Calligraffitti', cursive
   8| $font-family-sans 'Overlock', Helvetica, sans-serif

expected ")", got "selector |Calligraffitti)"

Thanks!

Answer

Panya picture Panya · Aug 20, 2014

Wrap the url in quotes: @import url('http://fonts.googleapis.com/css?family=Overlock:400,700,400italic,700italic|Calligraffitti')