| @import '../core/theming/theming'; |
| |
| @mixin mat-sort-color($config-or-theme) { |
| $config: mat-get-color-config($config-or-theme); |
| $background: map-get($config, background); |
| $foreground: map-get($config, foreground); |
| |
| .mat-sort-header-arrow { |
| $table-background: mat-color($background, 'card'); |
| $text-color: mat-color($foreground, secondary-text); |
| |
| // Because the arrow is made up of multiple elements that are stacked on top of each other, |
| // we can't use the semi-transparent color from the theme directly. If the value is a color |
| // *type*, we convert it into a solid color by taking the opacity from the rgba value and |
| // using the value to determine the percentage of the background to put into foreground |
| // when mixing the colors together. Otherwise, if it resolves to something different |
| // (e.g. it resolves to a CSS variable), we use the color directly. |
| @if (type-of($table-background) == color and type-of($text-color) == color) { |
| $text-opacity: opacity($text-color); |
| color: mix($table-background, rgba($text-color, 1), (1 - $text-opacity) * 100%); |
| } |
| @else { |
| color: $text-color; |
| } |
| } |
| } |
| |
| @mixin mat-sort-typography($config-or-theme) {} |
| |
| @mixin _mat-sort-density($config-or-theme) {} |
| |
| @mixin mat-sort-theme($theme-or-color-config) { |
| $theme: mat-private-legacy-get-theme($theme-or-color-config); |
| @include mat-private-check-duplicate-theme-styles($theme, 'mat-sort') { |
| $color: mat-get-color-config($theme); |
| $density: mat-get-density-config($theme); |
| $typography: mat-get-typography-config($theme); |
| |
| @if $color != null { |
| @include mat-sort-color($color); |
| } |
| @if $density != null { |
| @include _mat-sort-density($density); |
| } |
| @if $typography != null { |
| @include mat-sort-typography($typography); |
| } |
| } |
| } |