@onemrvapublic/design-system-theme 18.1.0-develop.1 → 18.1.1-develop.1

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 (30) hide show
  1. package/components/_autocomplete.scss +2 -3
  2. package/components/_badge.scss +3 -3
  3. package/components/_bottom-sheet.scss +3 -3
  4. package/components/_button-toggle.scss +16 -12
  5. package/components/_choice-chips.scss +4 -4
  6. package/components/_datepicker.scss +2 -2
  7. package/components/_dialogs.scss +15 -12
  8. package/components/_divider.scss +3 -3
  9. package/components/_drag-and-drop.scss +6 -6
  10. package/components/_expansion.scss +9 -12
  11. package/components/_fab.scss +1 -3
  12. package/components/_grid-list.scss +1 -3
  13. package/components/_icon-button.scss +4 -6
  14. package/components/_icon.scss +31 -12
  15. package/components/_progress-bar.scss +4 -4
  16. package/components/_select.scss +5 -4
  17. package/components/_sidenav.scss +28 -28
  18. package/components/_slider.scss +5 -10
  19. package/components/_snack-bar.scss +8 -8
  20. package/components/_sort.scss +1 -3
  21. package/components/_stepper.scss +6 -8
  22. package/components/_tabs.scss +5 -5
  23. package/components/_toolbar.scss +11 -7
  24. package/components/_tree.scss +1 -3
  25. package/package.json +1 -1
  26. package/utilities/_grid.scss +17 -13
  27. package/utilities/_media.scss +26 -26
  28. package/utilities/_palettes.scss +210 -210
  29. package/utilities/_spacing.scss +34 -14
  30. package/utilities/_utilities.scss +97 -89
package/components/_autocomplete.scss CHANGED
@@ -1,8 +1,7 @@
1
- @use "@angular/material" as mat;
2
- @use "sass:map";
1
+ @use '@angular/material' as mat;
2
+ @use 'sass:map';
3
3
 
4
4
  @mixin theme($theme) {
5
-
6
5
  @include mat.autocomplete-base($theme);
7
6
  @include mat.autocomplete-theme($theme);
8
7
 
package/components/_badge.scss CHANGED
@@ -1,7 +1,7 @@
1
- @use "@angular/material" as mat;
2
- @use "sass:map";
1
+ @use '@angular/material' as mat;
2
+ @use 'sass:map';
3
3
 
4
4
  @mixin theme($theme) {
5
5
  @include mat.badge-base($theme);
6
6
  @include mat.badge-theme($theme);
7
- }
7
+ }
package/components/_bottom-sheet.scss CHANGED
@@ -1,7 +1,7 @@
1
- @use "@angular/material" as mat;
2
- @use "sass:map";
1
+ @use '@angular/material' as mat;
2
+ @use 'sass:map';
3
3
 
4
4
  @mixin theme($theme) {
5
5
  @include mat.bottom-sheet-base($theme);
6
6
  @include mat.bottom-sheet-theme($theme);
7
- }
7
+ }
package/components/_button-toggle.scss CHANGED
@@ -1,26 +1,30 @@
1
- @use "@angular/material" as mat;
2
- @use "sass:map";
3
- @use "./µ";
4
- @import "../utilities/variables";
1
+ @use '@angular/material' as mat;
2
+ @use 'sass:map';
3
+ @use './µ';
4
+ @import '../utilities/variables';
5
5
 
6
6
  @mixin theme($theme) {
7
-
8
7
  @include mat.button-toggle-base($theme);
9
8
  @include mat.button-toggle-theme($theme);
10
9
 
11
- $spacer: map-get($theme, "spacer");
10
+ $spacer: map-get($theme, 'spacer');
12
11
  $accent400: µ.accent($theme, 400);
13
12
  $accent500: µ.accent($theme, 500);
14
13
 
15
14
  mat-button-toggle-group {
16
-
17
- --mat-standard-button-toggle-shape : #{$onemrva-button-border-radius};
15
+ --mat-standard-button-toggle-shape: #{$onemrva-button-border-radius};
18
16
  --mat-standard-button-toggle-divider-color: #{µ.grayscale($theme, 300)};
19
- --mat-standard-button-toggle-selected-state-background-color: #{µ.primary($theme, 500)};
20
- --mat-standard-button-toggle-selected-state-text-color: #{µ.accent($theme, "500-contrast")};
17
+ --mat-standard-button-toggle-selected-state-background-color: #{µ.primary(
18
+ $theme,
19
+ 500
20
+ )};
21
+ --mat-standard-button-toggle-selected-state-text-color: #{µ.accent(
22
+ $theme,
23
+ '500-contrast'
24
+ )};
21
25
 
22
26
  mat-button-toggle {
23
- font: mat.get-theme-typography($theme,'button');
27
+ font: mat.get-theme-typography($theme, 'button');
24
28
  // padding: $spacer 2 * $spacer;
25
29
  font-weight: 600;
26
30
  color: µ.grayscale($theme, 900);
@@ -34,4 +38,4 @@
34
38
  }
35
39
  }
36
40
  }
37
- }
41
+ }
package/components/_choice-chips.scss CHANGED
@@ -1,10 +1,10 @@
1
- @use "@angular/material" as mat;
2
- @use "sass:map";
3
- @use "./µ";
1
+ @use '@angular/material' as mat;
2
+ @use 'sass:map';
3
+ @use './µ';
4
4
 
5
5
  @mixin theme($theme) {
6
6
  .mat-mdc-checkbox.onemrva-choice-btn {
7
- font: mat.get-theme-typography($theme,'button');
7
+ font: mat.get-theme-typography($theme, 'button');
8
8
  border: 1px solid µ.primary($theme);
9
9
  border-radius: 500px;
10
10
  color: µ.primary($theme);
package/components/_datepicker.scss CHANGED
@@ -1,5 +1,5 @@
1
- @use "@angular/material" as mat;
2
- @use "sass:map";
1
+ @use '@angular/material' as mat;
2
+ @use 'sass:map';
3
3
 
4
4
  @mixin theme($theme) {
5
5
  @include mat.datepicker-base($theme);
package/components/_dialogs.scss CHANGED
@@ -1,14 +1,13 @@
1
- @use "./µ";
2
- @use "sass:map";
3
- @use "@angular/material" as mat;
4
- @import "../utilities/variables";
1
+ @use './µ';
2
+ @use 'sass:map';
3
+ @use '@angular/material' as mat;
4
+ @import '../utilities/variables';
5
5
 
6
6
  @mixin theme($theme) {
7
-
8
7
  @include mat.dialog-base($theme);
9
8
  @include mat.dialog-theme($theme);
10
9
 
11
- $spacer: map-get($theme, "spacer");
10
+ $spacer: map-get($theme, 'spacer');
12
11
 
13
12
  .mdc-dialog__title::before {
14
13
  height: auto;
@@ -28,7 +27,7 @@
28
27
 
29
28
  .mat-mdc-dialog-title {
30
29
  //styleName: Title/H4/Default;
31
- font-family: mat.get-theme-typography($theme,'headline-1', font-family);
30
+ font-family: mat.get-theme-typography($theme, 'headline-1', font-family);
32
31
  font-size: 18px;
33
32
  font-weight: 700;
34
33
  letter-spacing: 0;
@@ -88,8 +87,12 @@
88
87
  &:before {
89
88
  display: inline;
90
89
  //noinspection CssNoGenericFontName
91
- font-family: "Material Icons";
92
- font-variation-settings: "FILL" 1, "wght" 700, "GRAD" 0, "opsz" 20;
90
+ font-family: 'Material Icons';
91
+ font-variation-settings:
92
+ 'FILL' 1,
93
+ 'wght' 700,
94
+ 'GRAD' 0,
95
+ 'opsz' 20;
93
96
  font-size: 24px;
94
97
  top: 5px;
95
98
  margin: 0 8px 0 0;
@@ -101,7 +104,7 @@
101
104
  .mat-mdc-dialog-title {
102
105
  color: µ.error($theme);
103
106
  &:before {
104
- content: "\e000";
107
+ content: '\e000';
105
108
  }
106
109
  }
107
110
  }
@@ -109,7 +112,7 @@
109
112
  .mat-mdc-dialog-title {
110
113
  color: µ.success($theme, 600);
111
114
  &:before {
112
- content: "\e86c";
115
+ content: '\e86c';
113
116
  }
114
117
  }
115
118
  }
@@ -117,7 +120,7 @@
117
120
  .mat-mdc-dialog-title {
118
121
  color: µ.warn($theme, 600);
119
122
  &:before {
120
- content: "\e002";
123
+ content: '\e002';
121
124
  }
122
125
  }
123
126
  }
package/components/_divider.scss CHANGED
@@ -1,7 +1,7 @@
1
- @use "@angular/material" as mat;
2
- @use "sass:map";
1
+ @use '@angular/material' as mat;
2
+ @use 'sass:map';
3
3
 
4
4
  @mixin theme($theme) {
5
5
  @include mat.divider-base($theme);
6
6
  @include mat.divider-theme($theme);
7
- }
7
+ }
package/components/_drag-and-drop.scss CHANGED
@@ -1,6 +1,6 @@
1
- @use "@angular/material" as mat;
2
- @use "sass:map";
3
- @use "./µ";
1
+ @use '@angular/material' as mat;
2
+ @use 'sass:map';
3
+ @use './µ';
4
4
 
5
5
  @mixin theme($theme) {
6
6
  .cdk-drag:not(.mat-mdc-chip) {
@@ -19,8 +19,8 @@
19
19
  top: 0;
20
20
  left: 0;
21
21
  bottom: 0;
22
- font-family: "Material Icons";
23
- content: "\e945";
22
+ font-family: 'Material Icons';
23
+ content: '\e945';
24
24
  align-items: center;
25
25
  display: inline-flex;
26
26
  padding: 15px 10px 15px 14px; // THe icon is slightly narrower than in the DS so it's shifted to the left so as to be centered
@@ -37,7 +37,7 @@
37
37
  overflow: hidden;
38
38
  box-sizing: border-box;
39
39
  padding-top: 19px;
40
- font-family: "Source Sans Pro";
40
+ font-family: 'Source Sans Pro';
41
41
  box-shadow: 0px 2px 6px #00000026;
42
42
  }
43
43
 
package/components/_expansion.scss CHANGED
@@ -1,16 +1,13 @@
1
- @use "./µ";
2
- @use "sass:map";
3
- @use "@angular/material" as mat;
4
-
1
+ @use './µ';
2
+ @use 'sass:map';
3
+ @use '@angular/material' as mat;
5
4
 
6
5
  @mixin theme($theme) {
7
-
8
6
  @include mat.expansion-base($theme);
9
7
  @include mat.expansion-theme($theme);
10
8
 
11
9
  .mat-expansion-panel {
12
-
13
- &:not([class*="mat-elevation-z"]) {
10
+ &:not([class*='mat-elevation-z']) {
14
11
  box-shadow: none;
15
12
  }
16
13
 
@@ -40,7 +37,7 @@
40
37
  margin: 0;
41
38
  }
42
39
  &:after {
43
- content: "";
40
+ content: '';
44
41
  width: 130px;
45
42
  height: 1px;
46
43
  background: µ.grayscale($theme, 300);
@@ -49,8 +46,8 @@
49
46
  }
50
47
  .mat-expansion-indicator {
51
48
  &::after {
52
- font-family: "Material Icons" !important;
53
- content: "\e5cf" !important;
49
+ font-family: 'Material Icons' !important;
50
+ content: '\e5cf' !important;
54
51
  border: none !important;
55
52
  transform: none !important;
56
53
  font-size: 30px !important;
@@ -60,7 +57,7 @@
60
57
  }
61
58
  }
62
59
  &:not(.mat-expanded)
63
- .mat-expansion-panel-header:hover:not([aria-disabled="true"]) {
60
+ .mat-expansion-panel-header:hover:not([aria-disabled='true']) {
64
61
  &:hover {
65
62
  background: none;
66
63
  }
@@ -69,4 +66,4 @@
69
66
  padding: 0;
70
67
  }
71
68
  }
72
- }
69
+ }
package/components/_fab.scss CHANGED
@@ -1,8 +1,6 @@
1
- @use "@angular/material" as mat;
1
+ @use '@angular/material' as mat;
2
2
 
3
3
  @mixin theme($theme) {
4
-
5
4
  @include mat.fab-base($theme);
6
5
  @include mat.fab-theme($theme);
7
-
8
6
  }
package/components/_grid-list.scss CHANGED
@@ -1,8 +1,6 @@
1
- @use "@angular/material" as mat;
1
+ @use '@angular/material' as mat;
2
2
 
3
3
  @mixin theme($theme) {
4
-
5
4
  @include mat.grid-list-base($theme);
6
5
  @include mat.grid-list-theme($theme);
7
-
8
6
  }
package/components/_icon-button.scss CHANGED
@@ -1,11 +1,9 @@
1
- @use "@angular/material" as mat;
2
- @use "./µ";
3
- @use "sass:map";
4
- @import "../utilities/variables";
1
+ @use '@angular/material' as mat;
2
+ @use './µ';
3
+ @use 'sass:map';
4
+ @import '../utilities/variables';
5
5
 
6
6
  @mixin theme($theme) {
7
-
8
7
  @include mat.icon-button-base($theme);
9
8
  @include mat.icon-button-theme($theme);
10
-
11
9
  }
package/components/_icon.scss CHANGED
@@ -1,19 +1,22 @@
1
- @use "@angular/material" as mat;
2
- @use "./µ";
3
- @use "sass:map";
4
- @import "../utilities/variables";
1
+ @use '@angular/material' as mat;
2
+ @use './µ';
3
+ @use 'sass:map';
4
+ @import '../utilities/variables';
5
5
 
6
6
  @mixin theme($theme) {
7
-
8
7
  @include mat.icon-base($theme);
9
8
  @include mat.icon-theme($theme);
10
-
9
+
11
10
  mat-icon {
12
11
  $xsmallsize: 12px;
13
12
  $smallsize: 16px;
14
13
  $largesize: 24px;
15
14
  $xlargesize: 48px;
16
- font-variation-settings: "FILL" 0, "wght" 300, "GRAD" 0, "opsz" 20;
15
+ font-variation-settings:
16
+ 'FILL' 0,
17
+ 'wght' 300,
18
+ 'GRAD' 0,
19
+ 'opsz' 20;
17
20
 
18
21
  height: $largesize;
19
22
  width: $largesize;
@@ -24,14 +27,22 @@
24
27
  line-height: $xsmallsize;
25
28
  height: $xsmallsize;
26
29
  width: $xsmallsize;
27
- font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 12;
30
+ font-variation-settings:
31
+ 'FILL' 0,
32
+ 'wght' 400,
33
+ 'GRAD' 0,
34
+ 'opsz' 12;
28
35
  }
29
36
  &.small {
30
37
  font-size: $smallsize;
31
38
  line-height: $smallsize;
32
39
  height: $smallsize;
33
40
  width: $smallsize;
34
- font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 16;
41
+ font-variation-settings:
42
+ 'FILL' 0,
43
+ 'wght' 400,
44
+ 'GRAD' 0,
45
+ 'opsz' 16;
35
46
  }
36
47
  &.large {
37
48
  font-size: $largesize;
@@ -39,14 +50,22 @@
39
50
  height: $largesize;
40
51
  width: $largesize;
41
52
 
42
- font-variation-settings: "FILL" 0, "wght" 400, "GRAD" 0, "opsz" 24;
53
+ font-variation-settings:
54
+ 'FILL' 0,
55
+ 'wght' 400,
56
+ 'GRAD' 0,
57
+ 'opsz' 24;
43
58
  }
44
59
  &.xlarge {
45
60
  font-size: $xlargesize;
46
61
  line-height: $xlargesize;
47
62
  height: $xlargesize;
48
63
  width: $xlargesize;
49
- font-variation-settings: "FILL" 0, "wght" 300, "GRAD" 0, "opsz" 40;
64
+ font-variation-settings:
65
+ 'FILL' 0,
66
+ 'wght' 300,
67
+ 'GRAD' 0,
68
+ 'opsz' 40;
50
69
  }
51
70
  &.mat-success {
52
71
  color: µ.success($theme);
@@ -65,7 +84,7 @@
65
84
  }
66
85
 
67
86
  &.filled {
68
- font-variation-settings: "FILL" 1;
87
+ font-variation-settings: 'FILL' 1;
69
88
  }
70
89
  }
71
90
  }
package/components/_progress-bar.scss CHANGED
@@ -1,6 +1,6 @@
1
- @use "@angular/material" as mat;
2
- @use "sass:map";
3
- @use "./µ";
1
+ @use '@angular/material' as mat;
2
+ @use 'sass:map';
3
+ @use './µ';
4
4
 
5
5
  @mixin theme($theme) {
6
6
  @include mat.progress-bar-base($theme);
@@ -10,7 +10,7 @@
10
10
  .mat-mdc-progress-bar {
11
11
  border-radius: 500px;
12
12
 
13
- &[aria-valuenow="100"] {
13
+ &[aria-valuenow='100'] {
14
14
  .mdc-linear-progress__bar-inner {
15
15
  background-color: µ.success($theme);
16
16
  }
package/components/_select.scss CHANGED
@@ -1,6 +1,6 @@
1
- @use "@angular/material" as mat;
2
- @use "sass:map";
3
- @use "./µ";
1
+ @use '@angular/material' as mat;
2
+ @use 'sass:map';
3
+ @use './µ';
4
4
 
5
5
  @mixin theme($theme) {
6
6
  @include mat.select-base($theme);
@@ -12,7 +12,8 @@
12
12
  .mat-mdc-select {
13
13
  padding: 0;
14
14
  --mat-select-invalid-arrow-color: #{µ.error($theme, 500)};
15
- .mat-mdc-text-field-wrapper.mdc-text-field--outlined .mat-mdc-form-field-infix {
15
+ .mat-mdc-text-field-wrapper.mdc-text-field--outlined
16
+ .mat-mdc-form-field-infix {
16
17
  padding: 12px 0;
17
18
  }
18
19
  }
package/components/_sidenav.scss CHANGED
@@ -3,41 +3,41 @@
3
3
  @import '../utilities/variables';
4
4
 
5
5
  @mixin theme($theme) {
6
- mat-drawer {
7
- background-color: µ.grayscale($theme, 50) !important;
8
- }
6
+ mat-drawer {
7
+ background-color: µ.grayscale($theme, 50) !important;
8
+ }
9
9
 
10
- .close-sidenav,
11
- .side-menu-expander {
12
- color: µ.primary($theme);
13
- font-size: 28px;
14
- background-color: µ.grayscale($theme, 50);
15
- line-height: 24px;
10
+ .close-sidenav,
11
+ .side-menu-expander {
12
+ color: µ.primary($theme);
13
+ font-size: 28px;
14
+ background-color: µ.grayscale($theme, 50);
15
+ line-height: 24px;
16
16
 
17
- &:hover {
18
- cursor: pointer;
19
- color: µ.primary($theme, 900);
20
- }
17
+ &:hover {
18
+ cursor: pointer;
19
+ color: µ.primary($theme, 900);
21
20
  }
21
+ }
22
22
 
23
- .highlight-menu {
24
- background: $onemrva-accent-gradient-vertical;
25
- }
23
+ .highlight-menu {
24
+ background: $onemrva-accent-gradient-vertical;
25
+ }
26
26
 
27
- .sidenav-item.menu-expanded,
28
- .sidenav-subitem {
29
- background-color: white;
30
- &:hover {
31
- cursor: pointer;
32
- background-color: µ.grayscale($theme, 50);
33
- }
27
+ .sidenav-item.menu-expanded,
28
+ .sidenav-subitem {
29
+ background-color: white;
30
+ &:hover {
31
+ cursor: pointer;
32
+ background-color: µ.grayscale($theme, 50);
34
33
  }
34
+ }
35
35
 
36
- .expansion-arrow {
37
- color: µ.primary($theme);
36
+ .expansion-arrow {
37
+ color: µ.primary($theme);
38
38
 
39
- &:hover {
40
- color: µ.primary($theme, 900);
41
- }
39
+ &:hover {
40
+ color: µ.primary($theme, 900);
42
41
  }
42
+ }
43
43
  }
package/components/_slider.scss CHANGED
@@ -1,14 +1,9 @@
1
- @use "@angular/material" as mat;
2
- @use "sass:map";
3
- @use "./µ";
4
- @import "../utilities/variables";
1
+ @use '@angular/material' as mat;
2
+ @use 'sass:map';
3
+ @use './µ';
4
+ @import '../utilities/variables';
5
5
 
6
6
  @mixin theme($theme) {
7
-
8
7
  @include mat.slider-base($theme);
9
8
  @include mat.slider-theme($theme);
10
-
11
-
12
-
13
-
14
- }
9
+ }
package/components/_snack-bar.scss CHANGED
@@ -1,6 +1,6 @@
1
- @use "@angular/material" as mat;
2
- @use "sass:map";
3
- @use "./µ";
1
+ @use '@angular/material' as mat;
2
+ @use 'sass:map';
3
+ @use './µ';
4
4
 
5
5
  @mixin theme($theme) {
6
6
  @include mat.snack-bar-base($theme);
@@ -9,23 +9,23 @@
9
9
  box-shadow: none;
10
10
 
11
11
  &.mat-error {
12
- color: µ.error($theme, "contrast-500");
12
+ color: µ.error($theme, 'contrast-500');
13
13
  background: µ.error($theme);
14
14
  }
15
15
  &.mat-warn {
16
- color: µ.warn($theme, "contrast-500");
16
+ color: µ.warn($theme, 'contrast-500');
17
17
  background: µ.warn($theme);
18
18
  }
19
19
  &.mat-accent {
20
- color: µ.accent($theme, "contrast-500");
20
+ color: µ.accent($theme, 'contrast-500');
21
21
  background: µ.accent($theme);
22
22
  }
23
23
  &.mat-success {
24
- color: µ.success($theme, "contrast-500");
24
+ color: µ.success($theme, 'contrast-500');
25
25
  background: µ.success($theme);
26
26
  }
27
27
  &.mat-info {
28
- color: µ.info($theme, "contrast-500");
28
+ color: µ.info($theme, 'contrast-500');
29
29
  background: µ.info($theme);
30
30
  }
31
31
  &.mat-primary {
package/components/_sort.scss CHANGED
@@ -1,8 +1,6 @@
1
- @use "@angular/material" as mat;
1
+ @use '@angular/material' as mat;
2
2
 
3
3
  @mixin theme($theme) {
4
-
5
4
  @include mat.sort-base($theme);
6
5
  @include mat.sort-theme($theme);
7
-
8
6
  }
package/components/_stepper.scss CHANGED
@@ -1,14 +1,12 @@
1
- @use "@angular/material" as mat;
2
- @use "sass:map";
3
- @use "./µ";
1
+ @use '@angular/material' as mat;
2
+ @use 'sass:map';
3
+ @use './µ';
4
4
 
5
5
  @mixin theme($theme) {
6
6
  @include mat.stepper-base($theme);
7
7
  @include mat.stepper-theme($theme);
8
8
 
9
-
10
-
11
- $spacer: map-get($theme, "spacer");
9
+ $spacer: map-get($theme, 'spacer');
12
10
 
13
11
  mat-stepper,
14
12
  mat-vertical-stepper,
@@ -75,7 +73,7 @@
75
73
 
76
74
  .mat-step-text-label {
77
75
  font-weight: 600;
78
- font-family: "Source Sans Pro";
76
+ font-family: 'Source Sans Pro';
79
77
  }
80
78
 
81
79
  .mat-horizontal-content-container {
@@ -93,6 +91,6 @@
93
91
  }
94
92
 
95
93
  .mat-step-icon-content {
96
- font-family: "Source Sans Pro";
94
+ font-family: 'Source Sans Pro';
97
95
  }
98
96
  }
package/components/_tabs.scss CHANGED
@@ -1,6 +1,6 @@
1
- @use "@angular/material" as mat;
2
- @use "sass:map";
3
- @use "./µ";
1
+ @use '@angular/material' as mat;
2
+ @use 'sass:map';
3
+ @use './µ';
4
4
 
5
5
  @mixin theme($theme) {
6
6
  @include mat.tabs-base($theme);
@@ -19,7 +19,7 @@
19
19
  //
20
20
  .mat-mdc-tab-group:not(.language-tabs) {
21
21
  .mat-mdc-tab-header:after {
22
- content: "";
22
+ content: '';
23
23
  display: block;
24
24
  position: absolute;
25
25
  height: 1px;
@@ -47,7 +47,7 @@
47
47
  align-items: center;
48
48
  gap: 4px;
49
49
  color: µ.grayscale($theme, 900);
50
- font-family: mat.get-theme-typography($theme,'button', font-family);
50
+ font-family: mat.get-theme-typography($theme, 'button', font-family);
51
51
 
52
52
  &.mdc-tab--active {
53
53
  text-shadow: 0 0 1px µ.grayscale($theme, 900); // THC HACK