source: trip-planner-front/node_modules/@angular/material/core/typography/_typography-utils.scss@ e29cc2e

Last change on this file since e29cc2e was 6a3a178, checked in by Ema <ema_spirova@…>, 3 years ago

initial commit

  • Property mode set to 100644
File size: 3.9 KB
Line 
1@use 'sass:list';
2@use 'sass:map';
3@use 'sass:math';
4@use 'sass:meta';
5@use 'sass:string';
6@use '../style/private';
7
8
9// Utility for fetching a nested value from a typography config.
10@function _mat-get-type-value($config, $level, $name) {
11 @return map.get(map.get($config, $level), $name);
12}
13
14/// Gets the font size for a level inside a typography config.
15/// @param {Map} $config A typography config.
16/// @param {Map} $level A typography level.
17@function font-size($config, $level) {
18 @return _mat-get-type-value($config, $level, font-size);
19}
20
21/// Gets the line height for a level inside a typography config.
22/// @param {Map} $config A typography config.
23/// @param {Map} $level A typography level.
24@function line-height($config, $level) {
25 @return _mat-get-type-value($config, $level, line-height);
26}
27
28/// Gets the font weight for a level inside a typography config.
29/// @param {Map} $config A typography config.
30/// @param {Map} $level A typography level.
31@function font-weight($config, $level) {
32 @return _mat-get-type-value($config, $level, font-weight);
33}
34
35/// Gets the letter spacing for a level inside a typography config.
36/// @param {Map} $config A typography config.
37/// @param {Map} $level A typography level.
38@function letter-spacing($config, $level) {
39 @return _mat-get-type-value($config, $level, letter-spacing);
40}
41
42/// Gets the font-family from a typography config and removes the quotes around it.
43/// @param {Map} $config A typography config.
44/// @param {Map} $level A typography level.
45@function font-family($config, $level: null) {
46 $font-family: map.get($config, font-family);
47
48 @if $level != null {
49 $font-family: _mat-get-type-value($config, $level, font-family);
50 }
51
52 // Guard against unquoting non-string values, because it's deprecated.
53 @return if(meta.type-of($font-family) == string, string.unquote($font-family), $font-family);
54}
55
56/// Outputs the shorthand `font` CSS property, based on a set of typography values. Falls back to
57/// the individual properties if a value that isn't allowed in the shorthand is passed in.
58/// @param {String} $font-size The font-size value.
59/// @param {String | Number} $font-weight The font-weight value.
60/// @param {String | Number} $line-height The line-height value.
61/// @param {String} $font-family The font-family value.
62/// @returns {String} The `font` shorthand value combining the given parts.
63@mixin font-shorthand($font-size, $font-weight, $line-height, $font-family) {
64 // If any of the values are set to `inherit`, we can't use the shorthand
65 // so we fall back to passing in the individual properties.
66 @if ($font-size == inherit or
67 $font-weight == inherit or
68 $line-height == inherit or
69 $font-family == inherit or
70 $font-size == null or
71 $font-weight == null or
72 $line-height == null or
73 $font-family == null) {
74
75 font-size: $font-size;
76 font-weight: $font-weight;
77 line-height: $line-height;
78 font-family: $font-family;
79 }
80 @else {
81 // Otherwise use the shorthand `font`, because it's the least amount of bytes. Note
82 // that we need to use `list.slash` for `font-size/line-height` in order to prevent
83 // Sass from dividing the two values.
84 font: $font-weight private.private-slash($font-size, $line-height) $font-family;
85 }
86}
87
88/// Emits CSS styles for the given typography level.
89/// @param {Map} $config A typography config.
90/// @param {Map} $level A typography level.
91@mixin typography-level($config, $level) {
92 $font-size: font-size($config, $level);
93 $font-weight: font-weight($config, $level);
94 $line-height: line-height($config, $level);
95 $font-family: font-family($config, $level);
96
97 @include font-shorthand($font-size, $font-weight, $line-height, $font-family);
98 letter-spacing: letter-spacing($config, $level);
99}
100
101/// Coerce a value to `em` if it is a unitless number, otherwise returns
102/// the value provided.
103@function private-coerce-unitless-to-em($value) {
104 @return if(math.is-unitless($value), 1em * $value, $value);
105}
Note: See TracBrowser for help on using the repository browser.