Skip to content

Commit 6716f50

Browse files
authored
feat(cdk-experimental/tree): use shared example classes (angular#31494)
1 parent c1a6b33 commit 6716f50

File tree

3 files changed

+6
-15
lines changed

3 files changed

+6
-15
lines changed

src/components-examples/cdk-experimental/tree/cdk-tree/cdk-tree-example.css

Lines changed: 0 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -24,19 +24,6 @@
2424
list-style: none;
2525
}
2626

27-
.example-tree-item[aria-selected='true'] {
28-
background-color: var(--mat-sys-inverse-primary);
29-
}
30-
31-
.example-tree-item[aria-selected='false'] {
32-
background-color: var(--mat-sys-background);
33-
}
34-
35-
.example-tree-item[aria-disabled='true'] {
36-
background-color: var(--mat-sys-surface-container);
37-
color: var(--mat-sys-on-surface-variant);
38-
}
39-
4027
.example-tree-item-content {
4128
display: flex;
4229
align-items: center;

src/components-examples/cdk-experimental/tree/cdk-tree/cdk-tree-example.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -25,14 +25,14 @@ interface ExampleNode {
2525
template: `
2626
<li
2727
cdkTreeItem
28-
class="example-tree-item"
28+
class="example-tree-item example-selectable"
2929
[value]="node().value"
3030
[label]="node().label || node().value"
3131
[disabled]="node().disabled"
3232
#treeItem="cdkTreeItem"
3333
>
3434
<span
35-
class="example-tree-item-content"
35+
class="example-tree-item-content example-stateful"
3636
[style.paddingLeft.px]="(treeItem.pattern.level() - 1) * 24"
3737
>
3838
<mat-icon class="example-tree-item-icon" aria-hidden="true">

src/dev-app/common-classes.css

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,10 @@
33
color: var(--mat-sys-on-surface);
44
}
55

6+
.example-stateful {
7+
background-color: color-mix(in srgb, var(--mat-sys-surface) 10%, transparent);
8+
}
9+
610
[aria-disabled='true'] .example-stateful,
711
.example-stateful[aria-disabled='true'] {
812
color: color-mix(in srgb, var(--mat-sys-on-surface) 38%, transparent);

0 commit comments

Comments
 (0)