Prefer custom WOFF2 fonts if the browser supports them

[ci skip]

app/assets/stylesheets/framework/fonts.scss

@@ -3,23 +3,39 @@
   font-family: 'Source Sans Pro';
   font-style: normal;
   font-weight: 300;
-  src: local('Source Sans Pro Light'), local('SourceSansPro-Light'), font-url('SourceSansPro-Light.ttf.woff');
+  src:
+    local('Source Sans Pro Light'),
+    local('SourceSansPro-Light'),
+    font-url('SourceSansPro-Light.ttf.woff2') format('woff2'),
+    font-url('SourceSansPro-Light.ttf.woff') format('woff');
 }
 @font-face {
   font-family: 'Source Sans Pro';
   font-style: normal;
   font-weight: 400;
-  src: local('Source Sans Pro'), local('SourceSansPro-Regular'), font-url('SourceSansPro-Regular.ttf.woff');
+  src:
+    local('Source Sans Pro'),
+    local('SourceSansPro-Regular'),
+    font-url('SourceSansPro-Regular.ttf.woff2') format('woff2'),
+    font-url('SourceSansPro-Regular.ttf.woff') format('woff');
 }
 @font-face {
   font-family: 'Source Sans Pro';
   font-style: normal;
   font-weight: 600;
-  src: local('Source Sans Pro Semibold'), local('SourceSansPro-Semibold'), font-url('SourceSansPro-Semibold.ttf.woff');
+  src:
+    local('Source Sans Pro Semibold'),
+    local('SourceSansPro-Semibold'),
+    font-url('SourceSansPro-Semibold.ttf.woff2') format('woff2'),
+    font-url('SourceSansPro-Semibold.ttf.woff') format('woff');
 }
 @font-face {
   font-family: 'Source Sans Pro';
   font-style: normal;
   font-weight: 700;
-  src: local('Source Sans Pro Bold'), local('SourceSansPro-Bold'), font-url('SourceSansPro-Bold.ttf.woff');
+  src:
+    local('Source Sans Pro Bold'),
+    local('SourceSansPro-Bold'),
+    font-url('SourceSansPro-Bold.ttf.woff2') format('woff2'),
+    font-url('SourceSansPro-Bold.ttf.woff') format('woff');
 }