Google Webfonts Workaround
@import doesn't work in Metro Publisher's CSS but Google Webfonts provides @import as a way to use their fonts.
A workaround just to visit the url that is referenced in the @import code and copy/paste the contents of that page. The unfortunate bit is that each browser results in different code. For the best results, you want to visit and grab code that loads Firefox, Chrome, and Safari.
Here is an example for Google's "Berkshire Swash" font:
@import url(http://fonts.googleapis.com/css?family=Berkshire+Swash);
Go here: http://fonts.googleapis.com/css?family=Berkshire+Swash and you'll see that it is referencing fonts via @font-face. You can copy and paste that right into your screen.css file.
From Firefox
@font-face {
font-family: 'Berkshire Swash';
font-style: normal;
font-weight: 400;
src: local('Berkshire Swash'), local('BerkshireSwash-Regular'), url(http://fonts.gstatic.com/s/berkshireswash/v4/4RZJjVRPjYnC2939hKCAigPd3B1x2G-B3iFVpRu072s.woff2) format('woff2'), url(http://fonts.gstatic.com/s/berkshireswash/v4/4RZJjVRPjYnC2939hKCAin6EbtqG7Ha48C3_z7erIWs.woff) format('woff');
}
From Chrome
/* latin-ext */
@font-face {
font-family: 'Berkshire Swash';
font-style: normal;
font-weight: 400;
src: local('Berkshire Swash'), local('BerkshireSwash-Regular'), url(http://fonts.gstatic.com/s/berkshireswash/v4/4RZJjVRPjYnC2939hKCAik2Mm8lZ4zSajD6SHeUiwCw.woff2) format('woff2');
unicode-range: U+0100-024F, U+1E00-1EFF, U+20A0-20AB, U+20AD-20CF, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Berkshire Swash';
font-style: normal;
font-weight: 400;
src: local('Berkshire Swash'), local('BerkshireSwash-Regular'), url(http://fonts.gstatic.com/s/berkshireswash/v4/4RZJjVRPjYnC2939hKCAigPd3B1x2G-B3iFVpRu072s.woff2) format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2212, U+2215, U+E0FF, U+EFFD, U+F000;
}
From Safari
@font-face {
font-family: 'Berkshire Swash';
font-style: normal;
font-weight: 400;
src: local('Berkshire Swash'), local('BerkshireSwash-Regular'), url(http://fonts.gstatic.com/s/berkshireswash/v4/4RZJjVRPjYnC2939hKCAim8OJWgNlz0mShVs-C-Kb9U.ttf) format('truetype');
}
Comments