Skip to content

Commit 55466f7

Browse files
alep85alep85
committed
AAE-21565 Replace deprecated @import with @use in all scss files
1 parent e78c590 commit 55466f7

File tree

6 files changed

+63
-65
lines changed

6 files changed

+63
-65
lines changed

‎lib/core/custom-theme/material-theme.scss‎

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,36 +1,36 @@
11
@use 'sass:map';
22
@use '@angular/material' as mat;
3-
@import './theme/theme-data';
3+
@use './theme/theme-data' as theme;
44

55
$custom-theme: mat.m2-define-light-theme(
66
(
77
color: (
8-
primary: map.get($palettes, primary),
9-
accent: map.get($palettes, accent),
10-
warn: map.get($palettes, warning)
8+
primary: map.get(theme.$palettes, primary),
9+
accent: map.get(theme.$palettes, accent),
10+
warn: map.get(theme.$palettes, warning)
1111
),
12-
typography: $app-typography
12+
typography: theme.$app-typography
1313
)
1414
);
1515

16-
@if $background-color {
17-
$custom-theme: get-custom-background-color($background-color, $custom-theme);
16+
@if theme.$background-color {
17+
$custom-theme: theme.get-custom-background-color(theme.$background-color, $custom-theme);
1818
}
1919

20-
@if $text-color {
21-
$custom-theme: get-custom-text-color($text-color, $custom-theme);
20+
@if theme.$text-color {
21+
$custom-theme: theme.get-custom-text-color(theme.$text-color, $custom-theme);
2222
}
2323

24-
@if $base-font-size {
24+
@if theme.$base-font-size {
2525
body,
2626
html {
27-
font-size: $base-font-size;
27+
font-size: theme.$base-font-size;
2828
}
2929
}
3030

31-
@if $font-family {
31+
@if theme.$font-family {
3232
body,
3333
html {
34-
font-family: $font-family;
34+
font-family: theme.$font-family;
3535
}
3636
}

‎lib/core/custom-theme/theme/custom-palette-creator.scss‎

Lines changed: 23 additions & 25 deletions
Original file line numberDiff line numberDiff line change
@@ -15,7 +15,7 @@
1515
$colors: (
1616
red: color.red($color),
1717
green: color.green($color),
18-
blue: color.blue($color),
18+
blue: color.blue($color)
1919
);
2020

2121
@each $name, $value in $colors {
@@ -32,7 +32,7 @@
3232
$colors: map.merge(
3333
$colors,
3434
(
35-
$name: $value,
35+
$name: $value
3636
)
3737
);
3838
}
@@ -91,10 +91,10 @@
9191
$color900: color.mix($dark, $color, 75%);
9292

9393
/* stylelint-disable scss/dollar-variable-pattern */
94-
$colorA100: color.adjust(saturate(color.mix($dark, $color, 15%), 80%), $lightness: 45.6%);
95-
$colorA200: color.adjust(saturate(color.mix($dark, $color, 15%), 80%), $lightness: 35.6%);
96-
$colorA400: color.adjust(saturate(color.mix($dark, $color, 15%), 100%), $lightness: 25.6%);
97-
$colorA700: color.adjust(saturate(color.mix($dark, $color, 15%), 100%), $lightness: 20.5%);
94+
$colorA100: color.adjust(color.adjust(color.mix($dark, $color, 15%), $saturation: 80%), $lightness: 45.6%);
95+
$colorA200: color.adjust(color.adjust(color.mix($dark, $color, 15%), $saturation: 80%), $lightness: 35.6%);
96+
$colorA400: color.adjust(color.adjust(color.mix($dark, $color, 15%), $saturation: 100%), $lightness: 25.6%);
97+
$colorA700: color.adjust(color.adjust(color.mix($dark, $color, 15%), $saturation: 100%), $lightness: 20.5%);
9898
/* stylelint-enable scss/dollar-variable-pattern */
9999

100100
$contrast50: create-text-color($color50, $colorType);
@@ -126,30 +126,28 @@
126126
700: $color700,
127127
800: $color800,
128128
900: $color900,
129-
/* stylelint-disable value-keyword-case */
130-
A100: $colorA100,
129+
/* stylelint-disable value-keyword-case */ A100: $colorA100,
131130
A200: $colorA200,
132131
A400: $colorA400,
133132
A700: $colorA700,
134133
/* stylelint-enable value-keyword-case */
135134
contrast: (
136-
50: $contrast50,
137-
100: $contrast100,
138-
200: $contrast200,
139-
300: $contrast300,
140-
400: $contrast400,
141-
500: $contrast500,
142-
600: $contrast600,
143-
700: $contrast700,
144-
800: $contrast800,
145-
900: $contrast900,
146-
/* stylelint-disable value-keyword-case */
147-
A100: $contrastA100,
148-
A200: $contrastA200,
149-
A400: $contrastA400,
150-
A700: $contrastA700,
151-
/* stylelint-enable value-keyword-case */
152-
),
135+
50: $contrast50,
136+
100: $contrast100,
137+
200: $contrast200,
138+
300: $contrast300,
139+
400: $contrast400,
140+
500: $contrast500,
141+
600: $contrast600,
142+
700: $contrast700,
143+
800: $contrast800,
144+
900: $contrast900,
145+
/* stylelint-disable value-keyword-case */ A100: $contrastA100,
146+
A200: $contrastA200,
147+
A400: $contrastA400,
148+
A700: $contrastA700,
149+
/* stylelint-enable value-keyword-case */
150+
)
153151
);
154152

155153
@return $palette;

‎lib/core/custom-theme/theme/custom-theme-palettes.scss‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,27 +1,27 @@
11
@use '@angular/material' as mat;
2-
@import './default-colors';
3-
@import './custom-palette-creator';
2+
@use 'default-colors';
3+
@use 'custom-palette-creator';
44

55
@function get-mat-palettes($primary-color, $accent-color) {
66
$mat-primary-palette: null;
77

88
@if ($primary-color) {
9-
$custom-theme-primary-palette: create-color-palette($primary-color, 'primary');
9+
$custom-theme-primary-palette: custom-palette-creator.create-color-palette($primary-color, 'primary');
1010
$mat-primary-palette: mat.m2-define-palette($custom-theme-primary-palette, 500);
1111
} @else {
12-
$mat-primary-palette: mat.m2-define-palette($default-primary, A100);
12+
$mat-primary-palette: mat.m2-define-palette(default-colors.$default-primary, A100);
1313
}
1414

1515
$mat-accent-palette: null;
1616

1717
@if ($accent-color) {
18-
$custom-theme-accent-palette: create-color-palette($accent-color, 'accent');
18+
$custom-theme-accent-palette: custom-palette-creator.create-color-palette($accent-color, 'accent');
1919
$mat-accent-palette: mat.m2-define-palette($custom-theme-accent-palette, 500);
2020
} @else {
21-
$mat-accent-palette: mat.m2-define-palette($default-accent);
21+
$mat-accent-palette: mat.m2-define-palette(default-colors.$default-accent);
2222
}
2323

24-
$mat-warn-palette: mat.m2-define-palette($default-warn, A100);
24+
$mat-warn-palette: mat.m2-define-palette(default-colors.$default-warn, A100);
2525

2626
@return (primary: $mat-primary-palette, accent: $mat-accent-palette, warning: $mat-warn-palette);
2727
}

‎lib/core/custom-theme/theme/theme-data.scss‎

Lines changed: 13 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -1,18 +1,18 @@
11
@use 'sass:map';
2-
@import './theme-configuration';
3-
@import './typography';
4-
@import './custom-theme-palettes';
5-
@import './custom-background-color';
6-
@import './custom-text-color';
2+
@use 'theme-configuration';
3+
@use 'typography';
4+
@use 'custom-theme-palettes';
5+
@use 'custom-background-color';
6+
@use 'custom-text-color';
77

8-
$primary-color: map.get($theme-config, 'primaryColor');
9-
$accent-color: map.get($theme-config, 'accentColor');
10-
$background-color: map.get($theme-config, 'backgroundColor');
8+
$primary-color: map.get(theme-configuration.$theme-config, 'primaryColor');
9+
$accent-color: map.get(theme-configuration.$theme-config, 'accentColor');
10+
$background-color: map.get(theme-configuration.$theme-config, 'backgroundColor');
1111

12-
$text-color: map.get($theme-config, 'textColor');
13-
$base-font-size: map.get($theme-config, 'baseFontSize');
14-
$font-family: map.get($theme-config, 'fontFamily');
12+
$text-color: map.get(theme-configuration.$theme-config, 'textColor');
13+
$base-font-size: map.get(theme-configuration.$theme-config, 'baseFontSize');
14+
$font-family: map.get(theme-configuration.$theme-config, 'fontFamily');
1515

16-
$app-typography: get-mat-typography($base-font-size, $font-family);
16+
$app-typography: typography.get-mat-typography($base-font-size, $font-family);
1717

18-
$palettes: get-mat-palettes($primary-color, $accent-color);
18+
$palettes: custom-theme-palettes.get-mat-palettes($primary-color, $accent-color);

‎lib/core/custom-theme/theme/typography.scss‎

Lines changed: 5 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,7 @@
11
@use 'sass:map';
22
@use '@angular/material' as mat;
3-
@import '../variables/font-family';
3+
@use 'sass:meta';
4+
@use '../variables/font-family';
45

56
@function get-mat-typography($base-font-size, $font-family) {
67
$custom-typography: mat.m2-define-typography-config(
@@ -16,8 +17,7 @@
1617
$subtitle-2: mat.m2-define-typography-level(14px, 24px, 500),
1718
$body-2: mat.m2-define-typography-level(14px, 20px, 400),
1819
$caption: mat.m2-define-typography-level(12px, 20px, 400),
19-
$button: mat.m2-define-typography-level(14px, 14px, 500),
20-
// Line-height must be unit-less fraction of the font-size.
20+
$button: mat.m2-define-typography-level(14px, 14px, 500) // Line-height must be unit-less fraction of the font-size.
2121
);
2222

2323
@if $base-font-size {
@@ -34,14 +34,14 @@
3434
$body-2: mat.m2-define-typography-level(1rem, 1.42rem, 400),
3535
$caption: mat.m2-define-typography-level(0.86rem, 1.42rem, 400),
3636
$button: mat.m2-define-typography-level(1rem, 1rem, 500),
37-
$font-family: $default-font-family
37+
$font-family: font-family.$default-font-family
3838
);
3939
}
4040

4141
@if $font-family {
4242
@each $key, $level in $custom-typography {
4343
/* stylelint-disable-next-line scss/no-global-function-names */
44-
@if type-of($level) == 'map' {
44+
@if meta.type-of($level) == 'map' {
4545
$new-level: map.merge(
4646
$level,
4747
(

‎lib/process-services/src/lib/form/widgets/dynamic-table/dynamic-table.widget.scss‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
/* stylelint-disable no-descending-specificity */
2-
@import '../../../../../../core/src/lib/styles/mixins';
2+
@use '../../../../../../core/src/lib/styles/mixins' as *;
33

44
$dynamic-table-font-size: var(--theme-body-1-font-size) !default;
55
$dynamic-table-header-font-size: var(--theme-caption-font-size) !default;
@@ -65,7 +65,7 @@ dynamic-table-widget .adf-label {
6565

6666
td,
6767
th {
68-
padding: 0 $dynamic-table-column-padding 12px $dynamic-table-column-padding;
68+
padding: 0 $dynamic-table-column-padding 12px;
6969
text-align: center;
7070

7171
&:first-of-type {

0 commit comments

Comments
 (0)