Experiments page.
[wolnelektury.git] / src / wolnelektury / static / 2022 / styles / utils / bourbon / library / _font-face.scss
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/`). Can also be set globally using the
15 ///   `rails-asset-pipeline` key in the Bourbon settings.
16 ///
17 /// @argument {string | list} $file-formats [("ttf", "woff2", "woff")]
18 ///   List of the font file formats to include. Can also be set globally using
19 ///   the `global-font-file-formats` key in the Bourbon settings.
20 ///
21 /// @content
22 ///   Any additional CSS properties that are included in the `@include`
23 ///   directive will be output within the `@font-face` declaration, e.g. you can
24 ///   pass in `font-weight`, `font-style` and/or `unicode-range`.
25 ///
26 /// @example scss
27 ///   @include font-face(
28 ///     "source-sans-pro",
29 ///     "fonts/source-sans-pro-regular",
30 ///     ("woff2", "woff")
31 ///   ) {
32 ///     font-style: normal;
33 ///     font-weight: 400;
34 ///   }
35 ///
36 ///   // CSS Output
37 ///   @font-face {
38 ///     font-family: "source-sans-pro";
39 ///     src: url("fonts/source-sans-pro-regular.woff2") format("woff2"),
40 ///          url("fonts/source-sans-pro-regular.woff") format("woff");
41 ///     font-style: normal;
42 ///     font-weight: 400;
43 ///   }
44 ///
45 /// @require {function} _font-source-declaration
46 ///
47 /// @require {function} _fetch-bourbon-setting
48
49 @mixin font-face(
50   $font-family,
51   $file-path,
52   $file-formats: _fetch-bourbon-setting("global-font-file-formats"),
53   $asset-pipeline: _fetch-bourbon-setting("rails-asset-pipeline")
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 }