Experimental book page layout.
[wolnelektury.git] / src / wolnelektury / static / 2021 / css / utils / bourbon / library / _font-face.scss
diff --git a/src/wolnelektury/static/2021/css/utils/bourbon/library/_font-face.scss b/src/wolnelektury/static/2021/css/utils/bourbon/library/_font-face.scss
new file mode 100644 (file)
index 0000000..34143bc
--- /dev/null
@@ -0,0 +1,65 @@
+@charset "UTF-8";
+
+/// Generates an `@font-face` declaration. You can choose the specific file
+/// formats you need to output; the mixin supports `eot`, `ttf`, `svg`, `woff2`
+/// and `woff`. The mixin also supports usage with the Rails Asset Pipeline,
+/// which you can enable per use, or globally in the `$bourbon()` settings.
+///
+/// @argument {string} $font-family
+///
+/// @argument {string} $file-path
+///
+/// @argument {string} $asset-pipeline [false]
+///   Set to `true` if you’re using the Rails Asset Pipeline (place the fonts
+///   in `app/assets/fonts/`). Can also be set globally using the
+///   `rails-asset-pipeline` key in the Bourbon settings.
+///
+/// @argument {string | list} $file-formats [("ttf", "woff2", "woff")]
+///   List of the font file formats to include. Can also be set globally using
+///   the `global-font-file-formats` key in the Bourbon settings.
+///
+/// @content
+///   Any additional CSS properties that are included in the `@include`
+///   directive will be output within the `@font-face` declaration, e.g. you can
+///   pass in `font-weight`, `font-style` and/or `unicode-range`.
+///
+/// @example scss
+///   @include font-face(
+///     "source-sans-pro",
+///     "fonts/source-sans-pro-regular",
+///     ("woff2", "woff")
+///   ) {
+///     font-style: normal;
+///     font-weight: 400;
+///   }
+///
+///   // CSS Output
+///   @font-face {
+///     font-family: "source-sans-pro";
+///     src: url("fonts/source-sans-pro-regular.woff2") format("woff2"),
+///          url("fonts/source-sans-pro-regular.woff") format("woff");
+///     font-style: normal;
+///     font-weight: 400;
+///   }
+///
+/// @require {function} _font-source-declaration
+///
+/// @require {function} _fetch-bourbon-setting
+
+@mixin font-face(
+  $font-family,
+  $file-path,
+  $file-formats: _fetch-bourbon-setting("global-font-file-formats"),
+  $asset-pipeline: _fetch-bourbon-setting("rails-asset-pipeline")
+) {
+  @font-face {
+    font-family: $font-family;
+    src: _font-source-declaration(
+      $font-family,
+      $file-path,
+      $asset-pipeline,
+      $file-formats
+    );
+    @content;
+  }
+}