igniteui-theming 1.4.2 → 1.4.3-beta.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (109) hide show
  1. package/index.js +3 -0
  2. package/json/colors/meta/multipliers.json +1 -1
  3. package/package.json +21 -14
  4. package/sass/animations/_easings.scss +23 -23
  5. package/sass/animations/entrances/_bounce.scss +3 -3
  6. package/sass/animations/entrances/_flicker.scss +10 -26
  7. package/sass/animations/exits/_bounce.scss +6 -6
  8. package/sass/animations/exits/_flicker.scss +12 -28
  9. package/sass/animations/exits/_flip.scss +8 -8
  10. package/sass/animations/exits/_puff.scss +11 -11
  11. package/sass/animations/exits/_roll.scss +4 -4
  12. package/sass/animations/exits/_rotate.scss +25 -25
  13. package/sass/animations/exits/_scale.scss +15 -15
  14. package/sass/animations/exits/_slide.scss +34 -34
  15. package/sass/animations/exits/_slit.scss +4 -4
  16. package/sass/animations/exits/_swing.scss +8 -8
  17. package/sass/animations/exits/_swirl.scss +18 -18
  18. package/sass/animations/generic/_flip.scss +4 -4
  19. package/sass/animations/generic/_rotate.scss +5 -5
  20. package/sass/animations/generic/_scale.scss +31 -31
  21. package/sass/animations/generic/_shadows.scss +12 -68
  22. package/sass/bem/_index.scss +9 -3
  23. package/sass/color/_charts.scss +1 -1
  24. package/sass/color/_functions.scss +22 -56
  25. package/sass/color/_multipliers.scss +14 -14
  26. package/sass/color/_types.scss +6 -1
  27. package/sass/color/presets/dark/_bootstrap.scss +1 -1
  28. package/sass/color/presets/dark/_fluent.scss +3 -3
  29. package/sass/color/presets/dark/_indigo.scss +1 -1
  30. package/sass/color/presets/dark/_material.scss +1 -1
  31. package/sass/color/presets/light/_bootstrap.scss +1 -1
  32. package/sass/color/presets/light/_extra.scss +2 -2
  33. package/sass/color/presets/light/_fluent.scss +3 -3
  34. package/sass/color/presets/light/_indigo.scss +1 -1
  35. package/sass/color/presets/light/_material.scss +1 -1
  36. package/sass/elevations/presets/_index.scss +1 -5
  37. package/sass/elevations/presets/_material.scss +1 -1
  38. package/sass/themes/_functions.scss +2 -12
  39. package/sass/themes/_index.scss +1 -0
  40. package/sass/themes/_mixins.scss +4 -5
  41. package/sass/themes/charts/_category-chart-theme.scss +15 -11
  42. package/sass/themes/charts/_data-chart-theme.scss +4 -7
  43. package/sass/themes/charts/_doughnut-chart-theme.scss +2 -2
  44. package/sass/themes/charts/_financial-chart-theme.scss +15 -11
  45. package/sass/themes/charts/_funnel-chart-theme.scss +22 -18
  46. package/sass/themes/charts/_gauge-theme.scss +8 -16
  47. package/sass/themes/charts/_geo-map-theme.scss +10 -11
  48. package/sass/themes/charts/_graph-theme.scss +3 -3
  49. package/sass/themes/charts/_pie-chart-theme.scss +21 -20
  50. package/sass/themes/charts/_shape-chart-theme.scss +15 -11
  51. package/sass/themes/charts/_sparkline-theme.scss +2 -2
  52. package/sass/themes/schemas/_index.scss +10 -33
  53. package/sass/themes/schemas/charts/light/_category-chart.scss +68 -24
  54. package/sass/themes/schemas/charts/light/_data-chart.scss +12 -3
  55. package/sass/themes/schemas/charts/light/_financial-chart.scss +1 -1
  56. package/sass/themes/schemas/charts/light/_gauge.scss +14 -5
  57. package/sass/themes/schemas/charts/light/_geo-map.scss +2 -2
  58. package/sass/themes/schemas/charts/light/_graph.scss +20 -5
  59. package/sass/themes/schemas/charts/light/_pie-chart.scss +4 -1
  60. package/sass/themes/schemas/charts/light/_shape-chart.scss +8 -2
  61. package/sass/themes/schemas/charts/light/_sparkline.scss +4 -1
  62. package/sass/themes/schemas/components/_index.scss +2 -0
  63. package/sass/themes/schemas/components/dark/_avatar.scss +46 -0
  64. package/sass/themes/schemas/components/dark/_button.scss +491 -0
  65. package/sass/themes/schemas/components/dark/_checkbox.scss +88 -0
  66. package/sass/themes/schemas/components/dark/_combo.scss +56 -0
  67. package/sass/themes/schemas/components/dark/_drop-down.scss +86 -0
  68. package/sass/themes/schemas/components/dark/_icon.scss +39 -0
  69. package/sass/themes/schemas/components/dark/_index.scss +120 -0
  70. package/sass/themes/schemas/components/dark/_input-group.scss +170 -0
  71. package/sass/themes/schemas/components/dark/_navbar.scss +27 -0
  72. package/sass/themes/schemas/components/dark/_radio.scss +144 -0
  73. package/sass/themes/schemas/components/dark/_rating.scss +29 -0
  74. package/sass/themes/schemas/components/dark/_select.scss +56 -0
  75. package/sass/themes/schemas/components/dark/_slider.scss +136 -0
  76. package/sass/themes/schemas/components/dark/_switch.scss +216 -0
  77. package/sass/themes/schemas/components/dark/_tabs.scss +65 -0
  78. package/sass/themes/schemas/components/dark/_tree.scss +132 -0
  79. package/sass/themes/schemas/components/elevation/_button.scss +63 -0
  80. package/sass/themes/schemas/components/elevation/_drop-down.scss +29 -0
  81. package/sass/themes/schemas/components/elevation/_input-group.scss +37 -0
  82. package/sass/themes/schemas/components/elevation/_navbar.scss +23 -0
  83. package/sass/themes/schemas/components/elevation/_switch.scss +15 -0
  84. package/sass/themes/schemas/components/light/_avatar.scss +69 -0
  85. package/sass/themes/schemas/components/light/_button.scss +1700 -0
  86. package/sass/themes/schemas/components/light/_checkbox.scss +285 -0
  87. package/sass/themes/schemas/components/light/_combo.scss +317 -0
  88. package/sass/themes/schemas/components/light/_drop-down.scss +376 -0
  89. package/sass/themes/schemas/components/light/_icon.scss +55 -0
  90. package/sass/themes/schemas/components/light/_index.scss +121 -0
  91. package/sass/themes/schemas/components/light/_input-group.scss +794 -0
  92. package/sass/themes/schemas/components/light/_navbar.scss +116 -0
  93. package/sass/themes/schemas/components/light/_radio.scss +279 -0
  94. package/sass/themes/schemas/components/light/_rating.scss +129 -0
  95. package/sass/themes/schemas/components/light/_select.scss +176 -0
  96. package/sass/themes/schemas/components/light/_slider.scss +362 -0
  97. package/sass/themes/schemas/components/light/_switch.scss +473 -0
  98. package/sass/themes/schemas/components/light/_tabs.scss +402 -0
  99. package/sass/themes/schemas/components/light/_tree.scss +288 -0
  100. package/sass/typography/_functions.scss +7 -5
  101. package/sass/typography/_mixins.scss +1 -3
  102. package/sass/typography/_types.scss +2 -16
  103. package/sass/typography/presets/_bootstrap.scss +24 -24
  104. package/sass/typography/presets/_fluent.scss +23 -23
  105. package/sass/typography/presets/_indigo.scss +24 -24
  106. package/sass/typography/presets/_material.scss +23 -23
  107. package/sass/utils/_css.scss +6 -1
  108. package/sass/utils/_map.scss +4 -8
  109. package/sass/utils/_string.scss +14 -6
package/sass/typography/_functions.scss CHANGED
@@ -112,7 +112,7 @@ $browser-context: 16px;
112
112
  $result: map.merge(
113
113
  $result,
114
114
  (
115
- $style: $value
115
+ $style: $value,
116
116
  )
117
117
  );
118
118
  }
@@ -153,9 +153,11 @@ $browser-context: 16px;
153
153
  @function type-scale($_theme: null, $args...) {
154
154
  $style_fn: meta.get-function('type-style');
155
155
  $categories: meta.keywords($args);
156
- $result: (_meta: (
157
- variant: $_theme
158
- ));
156
+ $result: (
157
+ _meta: (
158
+ variant: $_theme,
159
+ ),
160
+ );
159
161
 
160
162
  @each $category in types.$ITypeScale {
161
163
  $value: map.get($categories, $category);
@@ -167,7 +169,7 @@ $browser-context: 16px;
167
169
  $result: map.merge(
168
170
  $result,
169
171
  (
170
- $category: meta.call($style_fn, $value...)
172
+ $category: meta.call($style_fn, $value...),
171
173
  )
172
174
  );
173
175
  }
package/sass/typography/_mixins.scss CHANGED
@@ -105,9 +105,7 @@
105
105
  $mt: map.get($type-style, 'margin-top');
106
106
  $mb: map.get($type-style, 'margin-bottom');
107
107
 
108
- @include css-vars-from-theme((
109
- #{$name}: #{$fw $fz $ff},
110
- ), $prefix);
108
+ @include css-vars-from-theme((#{$name}: #{$fw $fz $ff}), $prefix);
111
109
  }
112
110
 
113
111
  /// Adds typography styles for h1-h6, paragraph and creates custom typography class selectors.
package/sass/typography/_types.scss CHANGED
@@ -6,21 +6,7 @@
6
6
  /// A list consisting of 13 different category type styles
7
7
  /// @type List
8
8
  /// @access private
9
- $ITypeScale: (
10
- h1,
11
- h2,
12
- h3,
13
- h4,
14
- h5,
15
- h6,
16
- subtitle-1,
17
- subtitle-2,
18
- body-1,
19
- body-2,
20
- button,
21
- caption,
22
- overline
23
- );
9
+ $ITypeScale: (h1, h2, h3, h4, h5, h6, subtitle-1, subtitle-2, body-1, body-2, button, caption, overline);
24
10
 
25
11
  /// A set of style rules for all categories
26
12
  /// @type Map
@@ -34,7 +20,7 @@ $ITypeStyle: (
34
20
  letter-spacing: normal,
35
21
  text-transform: none,
36
22
  margin-top: 0,
37
- margin-bottom: 0
23
+ margin-bottom: 0,
38
24
  );
39
25
 
40
26
  /// A list of all category type styles that can be maped to native elements
package/sass/typography/presets/_bootstrap.scss CHANGED
@@ -18,16 +18,16 @@ $h1: type-style(
18
18
  $line-height: rem(48px),
19
19
  $text-transform: none,
20
20
  $margin-top: 0,
21
- $margin-bottom: rem(8px)
21
+ $margin-bottom: rem(8px),
22
22
  );
23
23
  $h2: type-style(
24
24
  $font-size: rem(32px),
25
25
  $font-weight: 500,
26
- $letter-spacing: rem(-.5px),
26
+ $letter-spacing: rem(-0.5px),
27
27
  $line-height: rem(38.4px),
28
28
  $text-transform: none,
29
29
  $margin-top: 0,
30
- $margin-bottom: rem(8px)
30
+ $margin-bottom: rem(8px),
31
31
  );
32
32
  $h3: type-style(
33
33
  $font-size: rem(28px),
@@ -36,16 +36,16 @@ $h3: type-style(
36
36
  $line-height: rem(33.6px),
37
37
  $text-transform: none,
38
38
  $margin-top: 0,
39
- $margin-bottom: rem(8px)
39
+ $margin-bottom: rem(8px),
40
40
  );
41
41
  $h4: type-style(
42
42
  $font-size: rem(24px),
43
43
  $font-weight: 500,
44
- $letter-spacing: rem(.25px),
44
+ $letter-spacing: rem(0.25px),
45
45
  $line-height: rem(28.8px),
46
46
  $text-transform: none,
47
47
  $margin-top: 0,
48
- $margin-bottom: rem(8px)
48
+ $margin-bottom: rem(8px),
49
49
  );
50
50
  $h5: type-style(
51
51
  $font-size: rem(20px),
@@ -54,75 +54,75 @@ $h5: type-style(
54
54
  $line-height: rem(24px),
55
55
  $text-transform: none,
56
56
  $margin-top: 0,
57
- $margin-bottom: rem(8px)
57
+ $margin-bottom: rem(8px),
58
58
  );
59
59
  $h6: type-style(
60
60
  $font-size: rem(16px),
61
61
  $font-weight: 500,
62
- $letter-spacing: rem(.15px),
62
+ $letter-spacing: rem(0.15px),
63
63
  $line-height: rem(19.2px),
64
64
  $text-transform: none,
65
65
  $margin-top: 0,
66
- $margin-bottom: rem(8px)
66
+ $margin-bottom: rem(8px),
67
67
  );
68
68
  $body-1: type-style(
69
69
  $font-size: rem(16px),
70
70
  $font-weight: 400,
71
- $letter-spacing: rem(.5px),
71
+ $letter-spacing: rem(0.5px),
72
72
  $line-height: rem(24px),
73
73
  $text-transform: none,
74
74
  $margin-top: 0,
75
- $margin-bottom: 0
75
+ $margin-bottom: 0,
76
76
  );
77
77
  $body-2: type-style(
78
78
  $font-size: rem(14.4px),
79
79
  $font-weight: 400,
80
- $letter-spacing: rem(.25px),
80
+ $letter-spacing: rem(0.25px),
81
81
  $line-height: rem(24px),
82
82
  $text-transform: none,
83
83
  $margin-top: 0,
84
- $margin-bottom: 0
84
+ $margin-bottom: 0,
85
85
  );
86
86
  $subtitle-1: type-style(
87
87
  $font-size: rem(14px),
88
88
  $font-weight: 400,
89
- $letter-spacing: rem(.15px),
89
+ $letter-spacing: rem(0.15px),
90
90
  $line-height: rem(24px),
91
91
  $text-transform: none,
92
92
  $margin-top: 0,
93
- $margin-bottom: 0
93
+ $margin-bottom: 0,
94
94
  );
95
95
  $subtitle-2: type-style(
96
96
  $font-size: rem(14.4px),
97
97
  $font-weight: 400,
98
- $letter-spacing: rem(.1px),
98
+ $letter-spacing: rem(0.1px),
99
99
  $line-height: rem(21.6px),
100
100
  $text-transform: none,
101
101
  $margin-top: 0,
102
- $margin-bottom: 0
102
+ $margin-bottom: 0,
103
103
  );
104
104
  $button: type-style(
105
105
  $font-size: rem(16px),
106
106
  $font-weight: 500,
107
- $letter-spacing: rem(.75px),
107
+ $letter-spacing: rem(0.75px),
108
108
  $line-height: rem(24px),
109
109
  $text-transform: none,
110
110
  $margin-top: 0,
111
- $margin-bottom: 0
111
+ $margin-bottom: 0,
112
112
  );
113
113
  $caption: type-style(
114
114
  $font-size: rem(12px),
115
115
  $font-weight: 400,
116
- $letter-spacing: rem(.4px),
116
+ $letter-spacing: rem(0.4px),
117
117
  $line-height: rem(16px),
118
- $text-transform: none
118
+ $text-transform: none,
119
119
  );
120
120
  $overline: type-style(
121
121
  $font-size: rem(10px),
122
122
  $font-weight: 400,
123
123
  $letter-spacing: rem(1.5px),
124
124
  $line-height: rem(16px),
125
- $text-transform: uppercase
125
+ $text-transform: uppercase,
126
126
  );
127
127
  $bootstrap_weekday: type-style(
128
128
  $font-size: rem(13px),
@@ -130,7 +130,7 @@ $bootstrap_weekday: type-style(
130
130
  $line-height: normal,
131
131
  $text-transform: none,
132
132
  $margin-top: 0,
133
- $margin-bottom: 0
133
+ $margin-bottom: 0,
134
134
  );
135
135
  $_base-scale: type-scale(
136
136
  $_theme: 'bootstrap',
@@ -146,7 +146,7 @@ $_base-scale: type-scale(
146
146
  $subtitle-2: $subtitle-2,
147
147
  $button: $button,
148
148
  $caption: $caption,
149
- $overline: $overline
149
+ $overline: $overline,
150
150
  );
151
151
  $type-scale: extend(
152
152
  $_base-scale,
package/sass/typography/presets/_fluent.scss CHANGED
@@ -16,16 +16,16 @@ $h1: type-style(
16
16
  $line-height: rem(76px),
17
17
  $text-transform: none,
18
18
  $margin-top: 0,
19
- $margin-bottom: 0
19
+ $margin-bottom: 0,
20
20
  );
21
21
  $h2: type-style(
22
22
  $font-size: rem(42px),
23
23
  $font-weight: 700,
24
- $letter-spacing: rem(-.5px),
24
+ $letter-spacing: rem(-0.5px),
25
25
  $line-height: rem(52px),
26
26
  $text-transform: none,
27
27
  $margin-top: 0,
28
- $margin-bottom: 0
28
+ $margin-bottom: 0,
29
29
  );
30
30
  $h3: type-style(
31
31
  $font-size: rem(32px),
@@ -34,16 +34,16 @@ $h3: type-style(
34
34
  $line-height: rem(40px),
35
35
  $text-transform: none,
36
36
  $margin-top: 0,
37
- $margin-bottom: 0
37
+ $margin-bottom: 0,
38
38
  );
39
39
  $h4: type-style(
40
40
  $font-size: rem(28px),
41
41
  $font-weight: 400,
42
- $letter-spacing: rem(.25px),
42
+ $letter-spacing: rem(0.25px),
43
43
  $line-height: rem(36px),
44
44
  $text-transform: none,
45
45
  $margin-top: 0,
46
- $margin-bottom: 0
46
+ $margin-bottom: 0,
47
47
  );
48
48
  $h5: type-style(
49
49
  $font-size: rem(24px),
@@ -52,69 +52,69 @@ $h5: type-style(
52
52
  $line-height: rem(32px),
53
53
  $text-transform: none,
54
54
  $margin-top: 0,
55
- $margin-bottom: 0
55
+ $margin-bottom: 0,
56
56
  );
57
57
  $h6: type-style(
58
58
  $font-size: rem(20px),
59
59
  $font-weight: 400,
60
- $letter-spacing: rem(.15px),
60
+ $letter-spacing: rem(0.15px),
61
61
  $line-height: rem(28px),
62
62
  $text-transform: none,
63
63
  $margin-top: 0,
64
- $margin-bottom: 0
64
+ $margin-bottom: 0,
65
65
  );
66
66
  $body-1: type-style(
67
67
  $font-size: rem(16px),
68
68
  $font-weight: 400,
69
- $letter-spacing: rem(.5px),
69
+ $letter-spacing: rem(0.5px),
70
70
  $line-height: rem(22px),
71
71
  $text-transform: none,
72
72
  $margin-top: 0,
73
- $margin-bottom: 0
73
+ $margin-bottom: 0,
74
74
  );
75
75
  $body-2: type-style(
76
76
  $font-size: rem(14px),
77
77
  $font-weight: 400,
78
- $letter-spacing: rem(.25px),
78
+ $letter-spacing: rem(0.25px),
79
79
  $line-height: rem(20px),
80
80
  $text-transform: none,
81
81
  $margin-top: 0,
82
- $margin-bottom: 0
82
+ $margin-bottom: 0,
83
83
  );
84
84
  $subtitle-1: type-style(
85
85
  $font-size: rem(18px),
86
86
  $font-weight: 400,
87
- $letter-spacing: rem(.15px),
87
+ $letter-spacing: rem(0.15px),
88
88
  $line-height: rem(24px),
89
89
  $text-transform: none,
90
90
  $margin-top: 0,
91
- $margin-bottom: 0
91
+ $margin-bottom: 0,
92
92
  );
93
93
  $subtitle-2: type-style(
94
94
  $font-size: rem(14px),
95
95
  $font-weight: 600,
96
- $letter-spacing: rem(.1px),
96
+ $letter-spacing: rem(0.1px),
97
97
  $line-height: rem(20px),
98
98
  $text-transform: none,
99
99
  $margin-top: 0,
100
- $margin-bottom: 0
100
+ $margin-bottom: 0,
101
101
  );
102
102
  $button: type-style(
103
103
  $font-size: rem(14px),
104
104
  $font-weight: 400,
105
- $letter-spacing: rem(.75px),
105
+ $letter-spacing: rem(0.75px),
106
106
  $line-height: rem(14px),
107
107
  $text-transform: capitalize,
108
108
  $margin-top: 0,
109
- $margin-bottom: 0
109
+ $margin-bottom: 0,
110
110
  );
111
111
  $caption: type-style(
112
112
  $font-size: rem(12px),
113
113
  $font-weight: 400,
114
114
  $font-style: normal,
115
- $letter-spacing: rem(.4px),
115
+ $letter-spacing: rem(0.4px),
116
116
  $line-height: rem(16px),
117
- $text-transform: none
117
+ $text-transform: none,
118
118
  );
119
119
  $overline: type-style(
120
120
  $font-size: rem(10px),
@@ -123,7 +123,7 @@ $overline: type-style(
123
123
  $line-height: rem(14px),
124
124
  $text-transform: uppercase,
125
125
  $margin-top: 0,
126
- $margin-bottom: 0
126
+ $margin-bottom: 0,
127
127
  );
128
128
  $type-scale: type-scale(
129
129
  $_theme: 'fluent',
@@ -139,5 +139,5 @@ $type-scale: type-scale(
139
139
  $subtitle-2: $subtitle-2,
140
140
  $button: $button,
141
141
  $caption: $caption,
142
- $overline: $overline
142
+ $overline: $overline,
143
143
  );
package/sass/typography/presets/_indigo.scss CHANGED
@@ -16,16 +16,16 @@ $h1: type-style(
16
16
  $line-height: rem(112px),
17
17
  $text-transform: none,
18
18
  $margin-top: 0,
19
- $margin-bottom: 0
19
+ $margin-bottom: 0,
20
20
  );
21
21
  $h2: type-style(
22
22
  $font-size: rem(60px),
23
23
  $font-weight: 200,
24
- $letter-spacing: rem(-.5px),
24
+ $letter-spacing: rem(-0.5px),
25
25
  $line-height: rem(72px),
26
26
  $text-transform: none,
27
27
  $margin-top: 0,
28
- $margin-bottom: 0
28
+ $margin-bottom: 0,
29
29
  );
30
30
  $h3: type-style(
31
31
  $font-size: rem(48px),
@@ -34,16 +34,16 @@ $h3: type-style(
34
34
  $line-height: rem(56px),
35
35
  $text-transform: none,
36
36
  $margin-top: 0,
37
- $margin-bottom: 0
37
+ $margin-bottom: 0,
38
38
  );
39
39
  $h4: type-style(
40
40
  $font-size: rem(36px),
41
41
  $font-weight: 200,
42
- $letter-spacing: rem(.25px),
42
+ $letter-spacing: rem(0.25px),
43
43
  $line-height: rem(42px),
44
44
  $text-transform: none,
45
45
  $margin-top: 0,
46
- $margin-bottom: 0
46
+ $margin-bottom: 0,
47
47
  );
48
48
  $h5: type-style(
49
49
  $font-size: rem(24px),
@@ -52,79 +52,79 @@ $h5: type-style(
52
52
  $line-height: rem(28px),
53
53
  $text-transform: none,
54
54
  $margin-top: 0,
55
- $margin-bottom: 0
55
+ $margin-bottom: 0,
56
56
  );
57
57
  $h6: type-style(
58
58
  $font-size: rem(20px),
59
59
  $font-weight: 600,
60
- $letter-spacing: rem(.15px),
60
+ $letter-spacing: rem(0.15px),
61
61
  $line-height: rem(26px),
62
62
  $text-transform: none,
63
63
  $margin-top: 0,
64
- $margin-bottom: 0
64
+ $margin-bottom: 0,
65
65
  );
66
66
  $body-1: type-style(
67
67
  $font-size: rem(16px),
68
68
  $font-weight: 400,
69
- $letter-spacing: rem(.5px),
69
+ $letter-spacing: rem(0.5px),
70
70
  $line-height: rem(20px),
71
71
  $text-transform: none,
72
72
  $margin-top: 0,
73
- $margin-bottom: 0
73
+ $margin-bottom: 0,
74
74
  );
75
75
  $body-2: type-style(
76
76
  $font-size: rem(14px),
77
77
  $font-weight: 400,
78
- $letter-spacing: rem(.25px),
78
+ $letter-spacing: rem(0.25px),
79
79
  $line-height: rem(20px),
80
80
  $text-transform: none,
81
81
  $margin-top: 0,
82
- $margin-bottom: 0
82
+ $margin-bottom: 0,
83
83
  );
84
84
  $subtitle-1: type-style(
85
85
  $font-size: rem(16px),
86
86
  $font-weight: 600,
87
- $letter-spacing: rem(.15px),
87
+ $letter-spacing: rem(0.15px),
88
88
  $line-height: rem(22px),
89
89
  $text-transform: none,
90
90
  $margin-top: 0,
91
- $margin-bottom: 0
91
+ $margin-bottom: 0,
92
92
  );
93
93
  $subtitle-2: type-style(
94
94
  $font-size: rem(14px),
95
95
  $font-weight: 700,
96
- $letter-spacing: rem(.1px),
96
+ $letter-spacing: rem(0.1px),
97
97
  $line-height: rem(20px),
98
98
  $text-transform: none,
99
99
  $margin-top: 0,
100
- $margin-bottom: 0
100
+ $margin-bottom: 0,
101
101
  );
102
102
  $button: type-style(
103
103
  $font-size: rem(12px),
104
104
  $font-weight: 700,
105
- $letter-spacing: rem(.75px),
105
+ $letter-spacing: rem(0.75px),
106
106
  $line-height: normal,
107
107
  $text-transform: uppercase,
108
108
  $margin-top: 0,
109
- $margin-bottom: 0
109
+ $margin-bottom: 0,
110
110
  );
111
111
  $caption: type-style(
112
112
  $font-size: rem(12px),
113
113
  $font-weight: 400,
114
- $letter-spacing: rem(.4px),
114
+ $letter-spacing: rem(0.4px),
115
115
  $line-height: rem(16px),
116
116
  $text-transform: normal,
117
117
  $margin-top: 0,
118
- $margin-bottom: 0
118
+ $margin-bottom: 0,
119
119
  );
120
120
  $overline: type-style(
121
121
  $font-size: rem(10px),
122
122
  $font-weight: 700,
123
- $letter-spacing: rem(.2px),
123
+ $letter-spacing: rem(0.2px),
124
124
  $line-height: rem(14px),
125
125
  $text-transform: uppercase,
126
126
  $margin-top: 0,
127
- $margin-bottom: 0
127
+ $margin-bottom: 0,
128
128
  );
129
129
  $type-scale: type-scale(
130
130
  $_theme: 'indigo',
@@ -140,5 +140,5 @@ $type-scale: type-scale(
140
140
  $subtitle-2: $subtitle-2,
141
141
  $button: $button,
142
142
  $caption: $caption,
143
- $overline: $overline
143
+ $overline: $overline,
144
144
  );
package/sass/typography/presets/_material.scss CHANGED
@@ -17,17 +17,17 @@ $h1: type-style(
17
17
  $line-height: rem(112px),
18
18
  $text-transform: none,
19
19
  $margin-top: rem(28px),
20
- $margin-bottom: rem(56px)
20
+ $margin-bottom: rem(56px),
21
21
  );
22
22
  $h2: type-style(
23
23
  $font-size: rem(60px),
24
24
  $font-weight: 300,
25
25
  $font-style: normal,
26
- $letter-spacing: rem(-.5px),
26
+ $letter-spacing: rem(-0.5px),
27
27
  $line-height: rem(71px),
28
28
  $text-transform: none,
29
29
  $margin-top: rem(28px),
30
- $margin-bottom: rem(28px)
30
+ $margin-bottom: rem(28px),
31
31
  );
32
32
  $h3: type-style(
33
33
  $font-size: rem(48px),
@@ -37,17 +37,17 @@ $h3: type-style(
37
37
  $line-height: rem(57px),
38
38
  $text-transform: none,
39
39
  $margin-top: rem(28px),
40
- $margin-bottom: 0
40
+ $margin-bottom: 0,
41
41
  );
42
42
  $h4: type-style(
43
43
  $font-size: rem(34px),
44
44
  $font-weight: 400,
45
45
  $font-style: normal,
46
- $letter-spacing: rem(.25px),
46
+ $letter-spacing: rem(0.25px),
47
47
  $line-height: rem(40px),
48
48
  $text-transform: none,
49
49
  $margin-top: rem(28px),
50
- $margin-bottom: 0
50
+ $margin-bottom: 0,
51
51
  );
52
52
  $h5: type-style(
53
53
  $font-size: rem(24px),
@@ -57,67 +57,67 @@ $h5: type-style(
57
57
  $line-height: rem(28px),
58
58
  $text-transform: none,
59
59
  $margin-top: rem(28px),
60
- $margin-bottom: 0
60
+ $margin-bottom: 0,
61
61
  );
62
62
  $h6: type-style(
63
63
  $font-size: rem(20px),
64
64
  $font-weight: 600,
65
65
  $font-style: normal,
66
- $letter-spacing: rem(.15px),
66
+ $letter-spacing: rem(0.15px),
67
67
  $line-height: rem(24px),
68
68
  $text-transform: none,
69
69
  $margin-top: 0,
70
- $margin-bottom: 0
70
+ $margin-bottom: 0,
71
71
  );
72
72
  $body-1: type-style(
73
73
  $font-size: rem(16px),
74
74
  $font-weight: 400,
75
75
  $font-style: normal,
76
- $letter-spacing: rem(.5px),
76
+ $letter-spacing: rem(0.5px),
77
77
  $line-height: rem(28px),
78
78
  $text-transform: none,
79
79
  $margin-top: rem(28px),
80
- $margin-bottom: rem(16)
80
+ $margin-bottom: rem(16),
81
81
  );
82
82
  $body-2: type-style(
83
83
  $font-size: rem(14px),
84
84
  $font-weight: 400,
85
85
  $font-style: normal,
86
- $letter-spacing: rem(.25px),
86
+ $letter-spacing: rem(0.25px),
87
87
  $line-height: rem(20px),
88
- $text-transform: none
88
+ $text-transform: none,
89
89
  );
90
90
  $subtitle-1: type-style(
91
91
  $font-size: rem(16px),
92
92
  $font-weight: 400,
93
93
  $font-style: normal,
94
- $letter-spacing: rem(.15px),
94
+ $letter-spacing: rem(0.15px),
95
95
  $line-height: rem(24px),
96
- $text-transform: none
96
+ $text-transform: none,
97
97
  );
98
98
  $subtitle-2: type-style(
99
99
  $font-size: rem(14px),
100
100
  $font-weight: 600,
101
101
  $font-style: normal,
102
- $letter-spacing: rem(.1px),
102
+ $letter-spacing: rem(0.1px),
103
103
  $line-height: rem(24px),
104
- $text-transform: none
104
+ $text-transform: none,
105
105
  );
106
106
  $button: type-style(
107
107
  $font-size: rem(14px),
108
108
  $font-weight: 600,
109
109
  $font-style: normal,
110
- $letter-spacing: rem(.75px),
110
+ $letter-spacing: rem(0.75px),
111
111
  $line-height: rem(16px),
112
- $text-transform: uppercase
112
+ $text-transform: uppercase,
113
113
  );
114
114
  $caption: type-style(
115
115
  $font-size: rem(12px),
116
116
  $font-weight: 400,
117
117
  $font-style: normal,
118
- $letter-spacing: rem(.4px),
118
+ $letter-spacing: rem(0.4px),
119
119
  $line-height: rem(16px),
120
- $text-transform: none
120
+ $text-transform: none,
121
121
  );
122
122
  $overline: type-style(
123
123
  $font-size: rem(10px),
@@ -125,7 +125,7 @@ $overline: type-style(
125
125
  $font-style: normal,
126
126
  $letter-spacing: rem(1.5px),
127
127
  $line-height: rem(16px),
128
- $text-transform: uppercase
128
+ $text-transform: uppercase,
129
129
  );
130
130
  $type-scale: type-scale(
131
131
  $_theme: 'material',
@@ -141,5 +141,5 @@ $type-scale: type-scale(
141
141
  $subtitle-2: $subtitle-2,
142
142
  $button: $button,
143
143
  $caption: $caption,
144
- $overline: $overline
144
+ $overline: $overline,
145
145
  );
package/sass/utils/_css.scss CHANGED
@@ -30,7 +30,12 @@
30
30
 
31
31
  $key: list.nth(map.keys($props), $i);
32
32
  $value: list.nth($list, $n);
33
- $props: map.merge($props, ($key: $value));
33
+ $props: map.merge(
34
+ $props,
35
+ (
36
+ $key: $value,
37
+ )
38
+ );
34
39
  }
35
40
 
36
41
  @return $props;
package/sass/utils/_map.scss CHANGED
@@ -14,12 +14,7 @@
14
14
 
15
15
  @each $key, $value in $map {
16
16
  @if $value {
17
- $result: map.merge(
18
- $result,
19
- (
20
- #{$key}: $value
21
- )
22
- );
17
+ $result: map.merge($result, (#{$key}: $value));
23
18
  }
24
19
  }
25
20
 
@@ -58,8 +53,9 @@
58
53
  $result: map.merge(
59
54
  $result,
60
55
  (
61
- '#{$prefix}#{$separator}#{$key}': map.get($map, $key))
62
- );
56
+ '#{$prefix}#{$separator}#{$key}': map.get($map, $key),
57
+ )
58
+ );
63
59
  }
64
60
 
65
61
  @return $result;