Skip to content

Commit 3cc92d1

Browse files
committed
Use each directive for less repetition
1 parent c887c49 commit 3cc92d1

File tree

1 file changed

+23
-42
lines changed

1 file changed

+23
-42
lines changed

src/lib/tabs/_tabs-theme.scss

Lines changed: 23 additions & 42 deletions
Original file line numberDiff line numberDiff line change
@@ -47,50 +47,31 @@
4747
}
4848

4949
.mat-tab-group, .mat-tab-nav-bar {
50-
51-
// Set the foreground color of the tabs
52-
&.mat-primary {
53-
@include _mat-tab-label-focus($primary);
54-
@include _mat-ink-bar($primary);
55-
}
56-
57-
&.mat-accent {
58-
@include _mat-tab-label-focus($accent);
59-
@include _mat-ink-bar($accent);
60-
}
61-
62-
&.mat-warn {
63-
@include _mat-tab-label-focus($warn);
64-
@include _mat-ink-bar($warn);
65-
}
66-
67-
// Set background color of the tabs and override focus color
68-
&.mat-background-primary {
69-
@include _mat-tab-label-focus($primary);
70-
@include _mat-tabs-background($primary);
71-
}
72-
73-
&.mat-background-accent {
74-
@include _mat-tab-label-focus($accent);
75-
@include _mat-tabs-background($accent);
76-
}
77-
78-
&.mat-background-warn {
79-
@include _mat-tab-label-focus($warn);
80-
@include _mat-tabs-background($warn);
81-
}
82-
83-
// Override inkbar color when theme color and background are the same
84-
&.mat-primary.mat-background-primary {
85-
@include _mat-ink-bar($primary, default-contrast);
86-
}
87-
88-
&.mat-accent.mat-background-accent {
89-
@include _mat-ink-bar($accent, default-contrast);
50+
$theme-colors: (
51+
primary: $primary,
52+
accent: $accent,
53+
warn: $warn
54+
);
55+
56+
@each $name, $color in $theme-colors {
57+
// Set the foreground color of the tabs
58+
&.mat-#{$name} {
59+
@include _mat-tab-label-focus($color);
60+
@include _mat-ink-bar($color);
61+
62+
// Override ink bar when background color is the same
63+
&.mat-background-#{$name} {
64+
@include _mat-ink-bar($color, default-contrast);
65+
}
66+
}
9067
}
9168

92-
&.mat-warn.mat-background-warn {
93-
@include _mat-ink-bar($warn, default-contrast);
69+
@each $name, $color in $theme-colors {
70+
// Set background color of the tabs and override focus color
71+
&.mat-background-#{$name} {
72+
@include _mat-tab-label-focus($color);
73+
@include _mat-tabs-background($color);
74+
}
9475
}
9576
}
9677
}

0 commit comments

Comments
 (0)