me
/
glitchier-soc
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
Branches Tags
${ item.name }
Create tag ${ searchTerm }
Create branch ${ searchTerm }
from '9bf4c34919'
${ noResults }
glitchier-soc/app/assets/stylesheets/fonts/roboto-mono.scss

153 lines
5.6 KiB
Raw Normal View History Unescape

Move the fonts from Google Fonts to local assets Currently we have two problems that are resolved by this change. The first is that we have a dependency on Google Fonts, which means that should it ever go down, or it have issues we would also have issues. This will resolve this by moving the dependencies we load from there to the local server. The second issue is that Google Fonts is currently returning the `local()` css font source. This causes a problem where the users browser fails to fallback to a missing glyph, resulting in many unusual characters displaying the failure glyph. This will resolve this by creating a font-family definition that does not use the `local()` source. I did not update the error pages with local fonts, they still use the remote google fonts api, so they're a self contained page that does not use the asset pipeline. This resolves tootsuite/mastodon#531 and tootsuite/mastodon#12
8 years ago
@font-face {
font-family: 'Roboto Mono';
src: font-url('roboto-mono/robotomono-bold-webfont.eot');
src: font-url('roboto-mono/robotomono-bold-webfont.eot?#iefix') format('embedded-opentype'),
font-url('roboto-mono/robotomono-bold-webfont.woff2') format('woff2'),
font-url('roboto-mono/robotomono-bold-webfont.woff') format('woff'),
font-url('roboto-mono/robotomono-bold-webfont.ttf') format('truetype'),
font-url('roboto-mono/robotomono-bold-webfont.svg#roboto_monobold') format('svg');
font-weight: bold;
font-style: normal;
}
@font-face {
font-family: 'Roboto Mono';
src: font-url('roboto-mono/robotomono-bolditalic-webfont.eot');
src: font-url('roboto-mono/robotomono-bolditalic-webfont.eot?#iefix') format('embedded-opentype'),
font-url('roboto-mono/robotomono-bolditalic-webfont.woff2') format('woff2'),
font-url('roboto-mono/robotomono-bolditalic-webfont.woff') format('woff'),
font-url('roboto-mono/robotomono-bolditalic-webfont.ttf') format('truetype'),
font-url('roboto-mono/robotomono-bolditalic-webfont.svg#roboto_monobold_italic') format('svg');
font-weight: bold;
font-style: italic;
}
@font-face {
font-family: 'Roboto Mono';
src: font-url('roboto-mono/robotomono-italic-webfont.eot');
src: font-url('roboto-mono/robotomono-italic-webfont.eot?#iefix') format('embedded-opentype'),
font-url('roboto-mono/robotomono-italic-webfont.woff2') format('woff2'),
font-url('roboto-mono/robotomono-italic-webfont.woff') format('woff'),
font-url('roboto-mono/robotomono-italic-webfont.ttf') format('truetype'),
font-url('roboto-mono/robotomono-italic-webfont.svg#roboto_monoitalic') format('svg');
font-weight: normal;
font-style: italic;
}
@font-face {
font-family: 'Roboto Mono';
src: font-url('roboto-mono/robotomono-light-webfont.eot');
src: font-url('roboto-mono/robotomono-light-webfont.eot?#iefix') format('embedded-opentype'),
font-url('roboto-mono/robotomono-light-webfont.woff2') format('woff2'),
font-url('roboto-mono/robotomono-light-webfont.woff') format('woff'),
font-url('roboto-mono/robotomono-light-webfont.ttf') format('truetype'),
font-url('roboto-mono/robotomono-light-webfont.svg#roboto_monolight') format('svg');
font-weight: 300;
font-style: normal;
}
@font-face {
font-family: 'Roboto Mono';
src: font-url('roboto-mono/robotomono-lightitalic-webfont.eot');
src: font-url('roboto-mono/robotomono-lightitalic-webfont.eot?#iefix') format('embedded-opentype'),
font-url('roboto-mono/robotomono-lightitalic-webfont.woff2') format('woff2'),
font-url('roboto-mono/robotomono-lightitalic-webfont.woff') format('woff'),
font-url('roboto-mono/robotomono-lightitalic-webfont.ttf') format('truetype'),
font-url('roboto-mono/robotomono-lightitalic-webfont.svg#roboto_monolight_italic') format('svg');
font-weight: 300;
font-style: italic;
}
@font-face {
font-family: 'Roboto Mono';
src: font-url('roboto-mono/robotomono-medium-webfont.eot');
src: font-url('roboto-mono/robotomono-medium-webfont.eot?#iefix') format('embedded-opentype'),
font-url('roboto-mono/robotomono-medium-webfont.woff2') format('woff2'),
font-url('roboto-mono/robotomono-medium-webfont.woff') format('woff'),
font-url('roboto-mono/robotomono-medium-webfont.ttf') format('truetype'),
font-url('roboto-mono/robotomono-medium-webfont.svg#roboto_monomedium') format('svg');
font-weight: 500;
font-style: normal;
}
@font-face {
font-family: 'Roboto Mono';
src: font-url('roboto-mono/robotomono-mediumitalic-webfont.eot');
src: font-url('roboto-mono/robotomono-mediumitalic-webfont.eot?#iefix') format('embedded-opentype'),
font-url('roboto-mono/robotomono-mediumitalic-webfont.woff2') format('woff2'),
font-url('roboto-mono/robotomono-mediumitalic-webfont.woff') format('woff'),
font-url('roboto-mono/robotomono-mediumitalic-webfont.ttf') format('truetype'),
font-url('roboto-mono/robotomono-mediumitalic-webfont.svg#roboto_monomedium_italic') format('svg');
font-weight: 500;
font-style: italic;
}
@font-face {
font-family: 'Roboto Mono';
src: font-url('roboto-mono/robotomono-regular-webfont.eot');
src: font-url('roboto-mono/robotomono-regular-webfont.eot?#iefix') format('embedded-opentype'),
font-url('roboto-mono/robotomono-regular-webfont.woff2') format('woff2'),
font-url('roboto-mono/robotomono-regular-webfont.woff') format('woff'),
font-url('roboto-mono/robotomono-regular-webfont.ttf') format('truetype'),
font-url('roboto-mono/robotomono-regular-webfont.svg#roboto_monoregular') format('svg');
font-weight: 400;
font-style: normal;
}
@font-face {
font-family: 'Roboto Mono';
src: font-url('roboto-mono/robotomono-thin-webfont.eot');
src: font-url('roboto-mono/robotomono-thin-webfont.eot?#iefix') format('embedded-opentype'),
font-url('roboto-mono/robotomono-thin-webfont.woff2') format('woff2'),
font-url('roboto-mono/robotomono-thin-webfont.woff') format('woff'),
font-url('roboto-mono/robotomono-thin-webfont.ttf') format('truetype'),
font-url('roboto-mono/robotomono-thin-webfont.svg#roboto_monothin') format('svg');
font-weight: 200;
font-style: normal;
}
@font-face {
font-family: 'Roboto Mono';
src: font-url('roboto-mono/robotomono-thinitalic-webfont.eot');
src: font-url('roboto-mono/robotomono-thinitalic-webfont.eot?#iefix') format('embedded-opentype'),
font-url('roboto-mono/robotomono-thinitalic-webfont.woff2') format('woff2'),
font-url('roboto-mono/robotomono-thinitalic-webfont.woff') format('woff'),
font-url('roboto-mono/robotomono-thinitalic-webfont.ttf') format('truetype'),
font-url('roboto-mono/robotomono-thinitalic-webfont.svg#roboto_monothin_italic') format('svg');
font-weight: 200;
font-style: italic;
}