0
|
1 @charset "UTF-8";
|
|
2
|
|
3 /// Generates an `@font-face` declaration. You can choose the specific file
|
|
4 /// formats you need to output; the mixin supports `eot`, `ttf`, `svg`, `woff2`
|
|
5 /// and `woff`. The mixin also supports usage with the Rails Asset Pipeline,
|
|
6 /// which you can enable per use, or globally in the `$bourbon()` settings.
|
|
7 ///
|
|
8 /// @argument {string} $font-family
|
|
9 ///
|
|
10 /// @argument {string} $file-path
|
|
11 ///
|
|
12 /// @argument {string} $asset-pipeline [false]
|
|
13 /// Set to `true` if you’re using the Rails Asset Pipeline (place the fonts
|
|
14 /// in `app/assets/fonts/`).
|
|
15 ///
|
|
16 /// @argument {string | list} $file-formats [("ttf", "woff2", "woff")]
|
|
17 /// Pass a list of file formats to support,
|
|
18 /// for example ("eot", "ttf", "svg", "woff2", "woff").
|
|
19 ///
|
|
20 /// @content
|
|
21 /// Any additional CSS properties that are included in the `@include`
|
|
22 /// directive will be output within the `@font-face` declaration, e.g. you can
|
|
23 /// pass in `font-weight`, `font-style` and/or `unicode-range`.
|
|
24 ///
|
|
25 /// @example scss
|
|
26 /// @include font-face(
|
|
27 /// "source-sans-pro",
|
|
28 /// "fonts/source-sans-pro-regular",
|
|
29 /// ("woff2", "woff")
|
|
30 /// ) {
|
|
31 /// font-style: normal;
|
|
32 /// font-weight: 400;
|
|
33 /// }
|
|
34 ///
|
|
35 /// // CSS Output
|
|
36 /// @font-face {
|
|
37 /// font-family: "source-sans-pro";
|
|
38 /// src: url("fonts/source-sans-pro-regular.woff2") format("woff2"),
|
|
39 /// url("fonts/source-sans-pro-regular.woff") format("woff");
|
|
40 /// font-style: normal;
|
|
41 /// font-weight: 400;
|
|
42 /// }
|
|
43 ///
|
|
44 /// @require {function} _font-source-declaration
|
|
45 ///
|
|
46 /// @require {function} _retrieve-bourbon-setting
|
|
47
|
|
48 @mixin font-face(
|
|
49 $font-family,
|
|
50 $file-path,
|
|
51 $file-formats: _retrieve-bourbon-setting("global-font-file-formats"),
|
|
52 $asset-pipeline: _retrieve-bourbon-setting("rails-asset-pipeline")
|
|
53 ) {
|
|
54
|
|
55 @font-face {
|
|
56 font-family: $font-family;
|
|
57 src: _font-source-declaration(
|
|
58 $font-family,
|
|
59 $file-path,
|
|
60 $asset-pipeline,
|
|
61 $file-formats
|
|
62 );
|
|
63 @content;
|
|
64 }
|
|
65 }
|