Skip to content

Commit 10a05e3

Browse files
desig9steindesig9stein
committed
fix(grid): fix paging styles samples for all grid types
1 parent 2053d61 commit 10a05e3

File tree

3 files changed

+103
-91
lines changed

3 files changed

+103
-91
lines changed

‎src/app/grid/custom-grid-paging-style/custom-grid-paging-style.component.scss‎

Lines changed: 34 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -7,48 +7,53 @@ $light-gray: #999;
77
$inactive-color: #9b7829;
88

99
$dark-paginator: paginator-theme(
10-
$text-color: $my-secondary,
11-
$background-color: $my-primary,
12-
$border-color: $my-secondary
10+
$text-color: $my-secondary,
11+
$background-color: $my-primary,
12+
$border-color: $my-secondary
1313
);
1414

1515
$dark-button: icon-button-theme(
16-
$foreground: $my-secondary,
17-
$hover-foreground: $dark-gray,
18-
$hover-background: $my-secondary,
19-
$focus-foreground: $dark-gray,
20-
$focus-background: $my-secondary,
21-
$border-color: $my-secondary,
22-
$focus-border-color: $my-secondary,
23-
$disabled-foreground: $inactive-color
16+
$foreground: $my-secondary,
17+
$hover-foreground: $dark-gray,
18+
$hover-background: $my-secondary,
19+
$focus-foreground: $dark-gray,
20+
$focus-background: $my-secondary,
21+
$border-color: $my-secondary,
22+
$focus-border-color: $my-secondary,
23+
$disabled-foreground: $inactive-color
2424
);
2525

2626
$dark-select: select-theme(
27-
$toggle-button-background: $my-primary,
28-
$toggle-button-foreground: $inactive-color,
27+
$toggle-button-background: $my-primary,
28+
$toggle-button-foreground: $inactive-color,
29+
$toggle-button-foreground-filled: $inactive-color,
30+
$toggle-button-foreground-focus: $inactive-color,
31+
$toggle-button-background-focus--border: $my-primary,
2932
);
3033

3134
$dark-input-group: input-group-theme(
32-
$filled-text-color: $my-secondary,
33-
$idle-text-color: $my-secondary,
34-
$focused-text-color: $my-secondary,
35-
$border-color: darken($inactive-color, 10%),
36-
$focused-border-color: $my-secondary,
37-
$input-suffix-color: $my-secondary,
35+
$filled-text-color: $my-secondary,
36+
$idle-text-color: $my-secondary,
37+
$filled-text-hover-color: $my-secondary,
38+
$focused-text-color: $my-secondary,
39+
$border-color: darken($inactive-color, 10%),
40+
$focused-border-color: $my-secondary,
41+
$input-suffix-color: $my-secondary,
3842
);
3943

4044
$dark-drop-down-theme: drop-down-theme(
41-
$background-color: $my-primary,
42-
$item-text-color: $my-secondary,
43-
$selected-item-background: $my-secondary,
44-
$selected-item-text-color: $dark-gray,
45-
$focused-item-background: $my-secondary,
46-
$focused-item-text-color: $dark-gray,
47-
$selected-focus-item-background: $my-secondary,
48-
$selected-focus-item-text-color: $dark-gray,
49-
$selected-hover-item-background: $my-secondary,
50-
$selected-hover-item-text-color: $dark-gray
45+
$background-color: $my-primary,
46+
$item-text-color: $my-secondary,
47+
$selected-item-background: $my-secondary,
48+
$selected-item-text-color: $dark-gray,
49+
$focused-item-background: $my-secondary,
50+
$focused-item-text-color: $dark-gray,
51+
$selected-focus-item-background: $my-secondary,
52+
$selected-focus-item-text-color: $dark-gray,
53+
$selected-hover-item-background: $my-secondary,
54+
$selected-hover-item-text-color: $dark-gray
5155
);
56+
5257
/*INCLUSION by DEFAULT ViewEncapsulation strategy*/
5358

5459
:host {

‎src/app/hierarchical-grid/hierarchical-grid-paging-style/hierarchical-grid-paging-style.component.scss‎

Lines changed: 34 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -21,48 +21,51 @@ $light-gray: #999;
2121
$inactive-color: #9b7829;
2222

2323
$dark-paginator: paginator-theme(
24-
$text-color: $my-secondary,
25-
$background-color: $my-primary,
26-
$border-color: $my-secondary
24+
$text-color: $my-secondary,
25+
$background-color: $my-primary,
26+
$border-color: $my-secondary
2727
);
2828

29-
$dark-button: button-theme(
30-
$foreground: $my-secondary,
31-
$hover-foreground: $dark-gray,
32-
$hover-background: $my-secondary,
33-
$focus-foreground: $dark-gray,
34-
$focus-background: $my-secondary,
35-
$border-color: $my-secondary,
36-
$hover-border-color: $my-secondary,
37-
$focus-border-color: $my-secondary,
38-
$disabled-foreground: $inactive-color
29+
$dark-button: icon-button-theme(
30+
$foreground: $my-secondary,
31+
$hover-foreground: $dark-gray,
32+
$hover-background: $my-secondary,
33+
$focus-foreground: $dark-gray,
34+
$focus-background: $my-secondary,
35+
$border-color: $my-secondary,
36+
$focus-border-color: $my-secondary,
37+
$disabled-foreground: $inactive-color
3938
);
4039

4140
$dark-select: select-theme(
42-
$toggle-button-background: $my-primary,
43-
$toggle-button-foreground: $inactive-color,
41+
$toggle-button-background: $my-primary,
42+
$toggle-button-foreground: $inactive-color,
43+
$toggle-button-foreground-filled: $inactive-color,
44+
$toggle-button-foreground-focus: $inactive-color,
45+
$toggle-button-background-focus--border: $my-primary,
4446
);
4547

4648
$dark-input-group: input-group-theme(
47-
$filled-text-color: $my-secondary,
48-
$idle-text-color: $my-secondary,
49-
$focused-text-color: $my-secondary,
50-
$border-color: darken($inactive-color, 10%),
51-
$focused-border-color: $my-secondary,
52-
$input-suffix-color: $my-secondary,
49+
$filled-text-color: $my-secondary,
50+
$idle-text-color: $my-secondary,
51+
$filled-text-hover-color: $my-secondary,
52+
$focused-text-color: $my-secondary,
53+
$border-color: darken($inactive-color, 10%),
54+
$focused-border-color: $my-secondary,
55+
$input-suffix-color: $my-secondary,
5356
);
5457

5558
$dark-drop-down-theme: drop-down-theme(
56-
$background-color: $my-primary,
57-
$item-text-color: $my-secondary,
58-
$selected-item-background: $my-secondary,
59-
$selected-item-text-color: $dark-gray,
60-
$focused-item-background: $my-secondary,
61-
$focused-item-text-color: $dark-gray,
62-
$selected-focus-item-background: $my-secondary,
63-
$selected-focus-item-text-color: $dark-gray,
64-
$selected-hover-item-background: $my-secondary,
65-
$selected-hover-item-text-color: $dark-gray
59+
$background-color: $my-primary,
60+
$item-text-color: $my-secondary,
61+
$selected-item-background: $my-secondary,
62+
$selected-item-text-color: $dark-gray,
63+
$focused-item-background: $my-secondary,
64+
$focused-item-text-color: $dark-gray,
65+
$selected-focus-item-background: $my-secondary,
66+
$selected-focus-item-text-color: $dark-gray,
67+
$selected-hover-item-background: $my-secondary,
68+
$selected-hover-item-text-color: $dark-gray
6669
);
6770

6871
:host {

‎src/app/tree-grid/tree-grid-paging-style/tree-grid-paging-style-sample.component.scss‎

Lines changed: 35 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -13,50 +13,54 @@ $light-gray: #999;
1313
$inactive-color: #9b7829;
1414

1515
$dark-paginator: paginator-theme(
16-
$text-color: $my-secondary,
17-
$background-color: $my-primary,
18-
$border-color: $my-secondary
16+
$text-color: $my-secondary,
17+
$background-color: $my-primary,
18+
$border-color: $my-secondary
1919
);
2020

21-
$dark-button: button-theme(
22-
$foreground: $my-secondary,
23-
$hover-foreground: $dark-gray,
24-
$hover-background: $my-secondary,
25-
$focus-foreground: $dark-gray,
26-
$focus-background: $my-secondary,
27-
$border-color: $my-secondary,
28-
$hover-border-color: $my-secondary,
29-
$focus-border-color: $my-secondary,
30-
$disabled-foreground: $inactive-color
21+
$dark-button: icon-button-theme(
22+
$foreground: $my-secondary,
23+
$hover-foreground: $dark-gray,
24+
$hover-background: $my-secondary,
25+
$focus-foreground: $dark-gray,
26+
$focus-background: $my-secondary,
27+
$border-color: $my-secondary,
28+
$focus-border-color: $my-secondary,
29+
$disabled-foreground: $inactive-color
3130
);
3231

3332
$dark-select: select-theme(
34-
$toggle-button-background: $my-primary,
35-
$toggle-button-foreground: $inactive-color,
33+
$toggle-button-background: $my-primary,
34+
$toggle-button-foreground: $inactive-color,
35+
$toggle-button-foreground-filled: $inactive-color,
36+
$toggle-button-foreground-focus: $inactive-color,
37+
$toggle-button-background-focus--border: $my-primary,
3638
);
3739

3840
$dark-input-group: input-group-theme(
39-
$filled-text-color: $my-secondary,
40-
$idle-text-color: $my-secondary,
41-
$focused-text-color: $my-secondary,
42-
$border-color: darken($inactive-color, 10%),
43-
$focused-border-color: $my-secondary,
44-
$input-suffix-color: $my-secondary,
41+
$filled-text-color: $my-secondary,
42+
$idle-text-color: $my-secondary,
43+
$filled-text-hover-color: $my-secondary,
44+
$focused-text-color: $my-secondary,
45+
$border-color: darken($inactive-color, 10%),
46+
$focused-border-color: $my-secondary,
47+
$input-suffix-color: $my-secondary,
4548
);
4649

4750
$dark-drop-down-theme: drop-down-theme(
48-
$background-color: $my-primary,
49-
$item-text-color: $my-secondary,
50-
$selected-item-background: $my-secondary,
51-
$selected-item-text-color: $dark-gray,
52-
$focused-item-background: $my-secondary,
53-
$focused-item-text-color: $dark-gray,
54-
$selected-focus-item-background: $my-secondary,
55-
$selected-focus-item-text-color: $dark-gray,
56-
$selected-hover-item-background: $my-secondary,
57-
$selected-hover-item-text-color: $dark-gray
51+
$background-color: $my-primary,
52+
$item-text-color: $my-secondary,
53+
$selected-item-background: $my-secondary,
54+
$selected-item-text-color: $dark-gray,
55+
$focused-item-background: $my-secondary,
56+
$focused-item-text-color: $dark-gray,
57+
$selected-focus-item-background: $my-secondary,
58+
$selected-focus-item-text-color: $dark-gray,
59+
$selected-hover-item-background: $my-secondary,
60+
$selected-hover-item-text-color: $dark-gray
5861
);
5962

63+
6064
:host {
6165
::ng-deep {
6266
@include css-vars($dark-drop-down-theme);

0 commit comments

Comments
 (0)