Merge branch 'develop'

README.md

@@ -456,3 +456,17 @@ That will produce this css:
   unicode-range: U+0025-00FF;
 }
 ``````
+
+## Contributing
+
+Please make PRs against `develop` branch rather than `master` branch.
+
+### Writing tests
+
+Please make tests for your changes. Avoid modifying existing tests, it is better to make new ones (though this isn't always practical for `generator.test.scss`).
+
+Write tests for your changes in `tests/mixin/mixin.test.scss` and `tests/generator/generator.test.scss`.
+
+`npm i` to install packages, `npx gulp` to generate the CSS from the test scss files.
+
+Use git to compare the old CSS output with the new CSS output. If git identifies any changes, check that those changes are expected.

mixin.scss

@@ -31,7 +31,12 @@ $fonts-path: '../fonts' !default;
 	$src: (local('☺'));
 	$family-folder: str-replace($font-family, ' ', '-');
 	@each $type in $font-types {
-		$src: append($src, url('#{$fonts-path}/#{$font-family}/#{nth($font-file, 1)}.#{$type}') format('#{$type}'), 'comma');
+		$format-type: $type;
+		@if $type == 'ttf' {
+			//Allows ttf fonts to be correctly included in CSS
+			$format-type: 'truetype';
+		}
+		$src: append($src, url('#{$fonts-path}/#{$font-family}/#{nth($font-file, 1)}.#{$type}') format('#{$format-type}'), 'comma');
 	}
 	@return $src;
 }

package.json

@@ -1,6 +1,6 @@
 {
   "name": "font-face-generator",
-  "version": "1.1.1",
+  "version": "1.1.2",
   "description": "An @font-face code generator for SCSS",
   "main": "mixin.scss",
   "scripts": {

tests/generator/generator.test.css

@@ -1,36 +1,36 @@
 @charset "UTF-8";
 @font-face {
   font-family: "Open Sans";
-  src: local("☺"), url("/path/to/fonts/Open Sans/open-sans-light.woff2") format("woff2"), url("/path/to/fonts/Open Sans/open-sans-light.woff") format("woff");
+  src: local("☺"), url("/path/to/fonts/Open Sans/open-sans-light.woff2") format("woff2"), url("/path/to/fonts/Open Sans/open-sans-light.woff") format("woff"), url("/path/to/fonts/Open Sans/open-sans-light.ttf") format("truetype");
   font-weight: 300;
   font-style: normal; }
 
 @font-face {
   font-family: "Open Sans";
-  src: local("☺"), url("/path/to/fonts/Open Sans/open-sans-normal.woff2") format("woff2"), url("/path/to/fonts/Open Sans/open-sans-normal.woff") format("woff");
+  src: local("☺"), url("/path/to/fonts/Open Sans/open-sans-normal.woff2") format("woff2"), url("/path/to/fonts/Open Sans/open-sans-normal.woff") format("woff"), url("/path/to/fonts/Open Sans/open-sans-normal.ttf") format("truetype");
   font-weight: 400;
   font-style: normal; }
 
 @font-face {
   font-family: "Open Sans";
-  src: local("☺"), url("/path/to/fonts/Open Sans/open-sans-normal-italic.woff2") format("woff2"), url("/path/to/fonts/Open Sans/open-sans-normal-italic.woff") format("woff");
+  src: local("☺"), url("/path/to/fonts/Open Sans/open-sans-normal-italic.woff2") format("woff2"), url("/path/to/fonts/Open Sans/open-sans-normal-italic.woff") format("woff"), url("/path/to/fonts/Open Sans/open-sans-normal-italic.ttf") format("truetype");
   font-weight: 400;
   font-style: italic; }
 
 @font-face {
   font-family: "Open Sans";
-  src: local("☺"), url("/path/to/fonts/Open Sans/open-sans-semibold.woff2") format("woff2"), url("/path/to/fonts/Open Sans/open-sans-semibold.woff") format("woff");
+  src: local("☺"), url("/path/to/fonts/Open Sans/open-sans-semibold.woff2") format("woff2"), url("/path/to/fonts/Open Sans/open-sans-semibold.woff") format("woff"), url("/path/to/fonts/Open Sans/open-sans-semibold.ttf") format("truetype");
   font-weight: 600;
   font-style: normal; }
 
 @font-face {
   font-family: "Open Sans";
-  src: local("☺"), url("/path/to/fonts/Open Sans/open-sans-bold.woff2") format("woff2"), url("/path/to/fonts/Open Sans/open-sans-bold.woff") format("woff");
+  src: local("☺"), url("/path/to/fonts/Open Sans/open-sans-bold.woff2") format("woff2"), url("/path/to/fonts/Open Sans/open-sans-bold.woff") format("woff"), url("/path/to/fonts/Open Sans/open-sans-bold.ttf") format("truetype");
   font-weight: 700;
   font-style: normal; }
 
 @font-face {
   font-family: "Font Two";
-  src: local("☺"), url("/path/to/fonts/Font Two/font-two.woff2") format("woff2"), url("/path/to/fonts/Font Two/font-two.woff") format("woff");
+  src: local("☺"), url("/path/to/fonts/Font Two/font-two.woff2") format("woff2"), url("/path/to/fonts/Font Two/font-two.woff") format("woff"), url("/path/to/fonts/Font Two/font-two.ttf") format("truetype");
   font-weight: 400;
   font-style: normal; }

tests/generator/generator.test.scss

@@ -15,7 +15,7 @@ $fonts: (
   )
 );
 
-$font-file-types: 'woff2' 'woff';
+$font-file-types: 'woff2' 'woff' 'ttf';
 
 $fonts-path: '/path/to/fonts';
 

tests/mixin/mixin.test.css

@@ -59,6 +59,18 @@
   font-weight: 400;
   font-style: normal; }
 
+@font-face {
+  font-family: "TTF Font";
+  src: local("☺"), url("/global/path/to/fonts/TTF Font/ttf-normal.ttf") format("truetype");
+  font-weight: 400;
+  font-style: normal; }
+
+@font-face {
+  font-family: "TTF with backup Font";
+  src: local("☺"), url("/global/path/to/fonts/TTF with backup Font/ttf-normal.ttf") format("truetype"), url("/global/path/to/fonts/TTF with backup Font/ttf-normal.woff") format("woff");
+  font-weight: 400;
+  font-style: normal; }
+
 @font-face {
   font-family: "Open Sans";
   src: local("☺"), url("/path/to/fonts/Open Sans/open-sans-light.woff2") format("woff2"), url("/path/to/fonts/Open Sans/open-sans-light.woff") format("woff");

tests/mixin/mixin.test.scss

@@ -55,6 +55,26 @@ $fonts-path: '/global/path/to/fonts';
   $types: 'woff'
 );
 
+@include font-face(
+  $fonts: (
+    'TTF Font' : (
+      400 : 'ttf-normal'
+    )
+  ),
+  // overide the default file types setting
+  $types: 'ttf'
+);
+
+@include font-face(
+  $fonts: (
+    'TTF with backup Font' : (
+      400 : 'ttf-normal'
+    )
+  ),
+  // overide the default file types setting
+  $types: 'ttf' 'woff'
+);
+
 @include font-face(
   $fonts: (
     'Open Sans' : (