Vendor fonts

No more spying, big G!

Gruntfile.coffee

@@ -11,6 +11,7 @@ middleware = (connect, options) ->
 		'svg'
 		'ttf'
 		'woff'
+		'woff2'
 		'otf'
 	]).join('|')
 
@@ -64,6 +65,7 @@ module.exports = (grunt) ->
 			'bower_components/ngDialog/css/ngDialog.css'
 			'bower_components/ngDialog/css/ngDialog-theme-default.css'
 			'bower_components/pure/pure-min.css'
+			'styles/fonts.css'
 			'styles/style.css'
 		]
 		test_scripts: [
@@ -181,6 +183,9 @@ module.exports = (grunt) ->
 					}}
 			}
 		}]
+		[ 'fonts', {
+			src: ['fonts/*']
+		}]
 		[ 'min', {
 			src: [ '.htaccess', 'tests/the_raven/*' ]
 			options: {
@@ -190,6 +195,10 @@ module.exports = (grunt) ->
 					}}
 			}
 		}]
+		[ 'min_fonts', {
+			src: ['fonts/*']
+			dest: 'build-min/'
+		}]
 		[ 'min_readme', {
 			cwd: ''
 			src: 'README-USAGE.md'
@@ -243,8 +252,8 @@ module.exports = (grunt) ->
 	grunt.loadNpmTasks('grunt-contrib-watch');
 
 	# Register tasks
-	grunt.registerTask 'default', [ 'coffee:main', 'copy:main', 'jade:main', 'stylus:main' ]
-	grunt.registerTask 'min', [ 'jade:min', 'copy:min', 'copy:min_readme', 'uglify:min', 'cssmin:min' ]
+	grunt.registerTask 'default', [ 'coffee:main', 'copy:main', 'copy:fonts', 'jade:main', 'stylus:main' ]
+	grunt.registerTask 'min', [ 'jade:min', 'copy:min', 'copy:min_readme', 'copy:min_fonts', 'uglify:min', 'cssmin:min' ]
 	grunt.registerTask 'test', [ 'default', 'connect:main', 'qunit' ]
 
 	grunt.registerTask 'serve', () ->

source/index.html.jade

@@ -5,8 +5,6 @@ html(ng-app="sideBySide" ng-controller="AppController")
 		title(ng-bind="title()") Side By Side viewer
 		meta(charset="utf-8")
 		meta(name="description", content="{{ description() }}")
-		link(rel="stylesheet", type="text/css", href="//fonts.googleapis.com/css?family=Alegreya:400,400italic,700&subset=latin,latin-ext,greek,greek-ext,cyrillic,cyrillic-ext,vietnamese")
-		link(rel="stylesheet", type="text/css", href="//fonts.googleapis.com/icon?family=Material+Icons")
 		if html5Mode == true
 			script.
 				html5Mode=true;

source/styles/fonts.css.styl

@@ -0,0 +1,35 @@
+/* Alegreya */
+@font-face {
+  font-family: 'Alegreya'; font-style: normal; font-weight: 400; font-display: swap;
+  src: url('../fonts/alegreya-v29-all-400.woff2') format('woff2');
+}
+@font-face {
+  font-family: 'Alegreya'; font-style: italic; font-weight: 400; font-display: swap;
+  src: url('../fonts/alegreya-v29-all-400i.woff2') format('woff2');
+}
+@font-face {
+  font-family: 'Alegreya'; font-style: normal; font-weight: 700; font-display: swap;
+  src: url('../fonts/alegreya-v29-all-700.woff2') format('woff2');
+}
+
+/* Material Icons */
+@font-face {
+  font-family: 'Material Icons'; font-style: normal; font-weight: 400; font-display: swap;
+  src: url('../fonts/material-icons.woff2') format('woff2');
+}
+
+.material-icons {
+  font-family: 'Material Icons';
+  font-weight: normal;
+  font-style: normal;
+  font-size: 24px;
+  line-height: 1;
+  letter-spacing: normal;
+  text-transform: none;
+  display: inline-block;
+  white-space: nowrap;
+  word-wrap: normal;
+  direction: ltr;
+  -webkit-font-feature-settings: 'liga';
+  -webkit-font-smoothing: antialiased;
+}