mirror of
https://github.com/RedHatOfficial/Overpass.git
synced 2026-01-13 10:49:27 +01:00
Add documentation
This commit is contained in:
@@ -1,5 +1,6 @@
|
||||
/* Overpass Mono */
|
||||
/* Overpass Mono helper mixins */
|
||||
|
||||
//-- This is a map of the current font weights, keyed on their file names
|
||||
$supported-weights: (
|
||||
light: 300,
|
||||
regular: 400,
|
||||
@@ -7,27 +8,34 @@ $supported-weights: (
|
||||
bold: 600
|
||||
);
|
||||
|
||||
//-- This simple mixin adds the overpass basic styles to a typography element
|
||||
@mixin _overpass-monostyles {
|
||||
font-family: 'overpass-mono';
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
//-- This mixins will dynamically print the font-face declarations based on your levels of support
|
||||
// * Weights can be limited to those your wish to incorporate in your styles; if left with defaults,
|
||||
// this will add support for all supported font variations
|
||||
// * The weight map can be customized if you wish to set your own values
|
||||
// Example: To use `font-weight: bolder` instead of `font-weight: 600`, we create a custom map
|
||||
// that maps the key bold to the value bolder -> `bold: bolder`
|
||||
// * The path to dist represents the location of the overpass font files relative to your architecture
|
||||
@mixin print-overpass-mono-font-face(
|
||||
$weights: (light regular semibold bold),
|
||||
$weights: map-keys($supported-weights),
|
||||
$weight-map: $supported-weights,
|
||||
$path_to_dist: './'
|
||||
) {
|
||||
@each $weight in $weights {
|
||||
@each $style in $styles {
|
||||
@font-face {
|
||||
font-family: 'overpass-mono';
|
||||
src: url("#{$path_to_dist}overpass-mono-#{$weight}.eot?");
|
||||
src: url("#{$path_to_dist}overpass-mono-#{$weight}.eot?#iefix") format("embedded-opentype"),
|
||||
url("#{$path_to_dist}overpass-mono-#{$weight}.woff?") format("woff"),
|
||||
url("#{$path_to_dist}overpass-mono-#{$weight}.ttf?") format("truetype");
|
||||
font-weight: map-get($supported-weights, $weight);
|
||||
font-style: normal;
|
||||
}
|
||||
}
|
||||
@font-face {
|
||||
font-family: 'overpass-mono';
|
||||
src: url("#{$path_to_dist}overpass-mono-#{$weight}.eot?");
|
||||
src: url("#{$path_to_dist}overpass-mono-#{$weight}.eot?#iefix") format("embedded-opentype"),
|
||||
url("#{$path_to_dist}overpass-mono-#{$weight}.woff?") format("woff"),
|
||||
url("#{$path_to_dist}overpass-mono-#{$weight}.ttf?") format("truetype");
|
||||
font-weight: map-get($weight-map, $weight);
|
||||
font-style: normal;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@@ -1,5 +1,6 @@
|
||||
/* Overpass */
|
||||
/* Overpass helper mixins */
|
||||
|
||||
//-- This is a map of the current font weights, keyed on their file names
|
||||
$supported-weights: (
|
||||
thin: 200,
|
||||
extralight: 300,
|
||||
@@ -11,15 +12,27 @@ $supported-weights: (
|
||||
heavy: 900
|
||||
);
|
||||
|
||||
//-- This is a list of the currently supported font styles
|
||||
$supported-styles: (normal italic);
|
||||
|
||||
//-- This simple mixin adds the overpass basic styles to a typography element
|
||||
@mixin _overpass-styles {
|
||||
font-family: 'overpass';
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
//-- This mixins will dynamically print the font-face declarations based on your levels of support
|
||||
// * Weight and style lists can be limited to those your wish to incorporate in your styles,
|
||||
// if left with defaults, it will add support for all overpass variations
|
||||
// * The weight map can be customized if you wish to set your own values
|
||||
// Example: To use `font-weight: bolder` instead of `font-weight: 800`, we create a custom map
|
||||
// that maps the key extrabold to the value bolder -> `extrabold: bolder`
|
||||
// * The path to dist represents the location of the overpass font files relative to your architecture
|
||||
@mixin print-overpass-font-face(
|
||||
$weights: (thin extralight light regular semibold bold extrabold heavy),
|
||||
$styles: (normal italic),
|
||||
$weights: map-keys($supported-weights),
|
||||
$styles: $supported-styles,
|
||||
$weight-map: $supported-weights,
|
||||
$path_to_dist: './'
|
||||
) {
|
||||
@each $weight in $weights {
|
||||
@@ -30,7 +43,7 @@ $supported-weights: (
|
||||
src: url("#{$path_to_dist}overpass-#{$weight}#{if($style != normal, #{-$style}, "")}.eot?#iefix") format("embedded-opentype"),
|
||||
url("#{$path_to_dist}overpass-#{$weight}#{if($style != normal, #{-$style}, "")}.woff?") format("woff"),
|
||||
url("#{$path_to_dist}overpass-#{$weight}#{if($style != normal, #{-$style}, "")}.ttf?") format("truetype");
|
||||
font-weight: map-get($supported-weights, $weight);
|
||||
font-weight: map-get($weight-map, $weight);
|
||||
font-style: $style;
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user