From eee4c2a255896c40ecd9a2d718cd467432880bb9 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?marker=20dao=20=C2=AE?= Date: Wed, 6 Nov 2024 18:31:14 +0100 Subject: [PATCH] fix(list): Update styles to fix TestCafe tests --- .../scss/widgets/fluent/list/_index.scss | 16 +-- .../scss/widgets/material/list/_index.scss | 16 +-- packages/devextreme/playground/jquery.html | 98 ++++++++++++------- 3 files changed, 83 insertions(+), 47 deletions(-) diff --git a/packages/devextreme-scss/scss/widgets/fluent/list/_index.scss b/packages/devextreme-scss/scss/widgets/fluent/list/_index.scss index fbc691116a69..c26f594e4ec1 100644 --- a/packages/devextreme-scss/scss/widgets/fluent/list/_index.scss +++ b/packages/devextreme-scss/scss/widgets/fluent/list/_index.scss @@ -229,6 +229,15 @@ $fluent-list-item-border: $fluent-list-item-border-width solid $list-border-colo .dx-list-item { @include item-states(); } + + .dx-list-group-header { + @include item-states(); + + &.dx-state-hover { + background-color: $list-item-hover-bg; + color: $list-item-hover-color; + } + } } } @@ -279,8 +288,6 @@ $fluent-list-item-border: $fluent-list-item-border-width solid $list-border-colo } .dx-list-group-header { - @include item-states(); - font-weight: 500; padding: $fluent-list-group-header-vertical-padding $item-horizontal-padding; background: $list-group-header-bg; @@ -291,11 +298,6 @@ $fluent-list-item-border: $fluent-list-item-border-width solid $list-border-colo align-items: center; column-gap: $fluent-list-item-horizontal-padding; - &.dx-state-hover { - background-color: $list-item-hover-bg; - color: $list-item-hover-color; - } - .dx-list-group-header-indicator { color: $list-header-indicator-color; diff --git a/packages/devextreme-scss/scss/widgets/material/list/_index.scss b/packages/devextreme-scss/scss/widgets/material/list/_index.scss index a456296eb85a..55b178b847a0 100644 --- a/packages/devextreme-scss/scss/widgets/material/list/_index.scss +++ b/packages/devextreme-scss/scss/widgets/material/list/_index.scss @@ -161,6 +161,15 @@ $material-list-searchbox-padding-top: $material-list-searchbox-vertical-padding .dx-list-item { @include item-states(); } + + .dx-list-group-header { + @include item-states(); + + &.dx-state-hover { + background-color: $list-item-hover-bg; + color: $list-item-hover-color; + } + } } } @@ -204,8 +213,6 @@ $material-list-searchbox-padding-top: $material-list-searchbox-vertical-padding } .dx-list-group-header { - @include item-states(); - font-weight: 500; padding: $material-list-group-header-vertical-padding $item-horizontal-padding; background: $list-group-header-bg; @@ -217,11 +224,6 @@ $material-list-searchbox-padding-top: $material-list-searchbox-vertical-padding border-top-color: transparent; font-size: $material-list-main-font-size; - &.dx-state-hover { - background-color: $list-item-hover-bg; - color: $list-item-hover-color; - } - .dx-list-group-header-indicator { color: $list-header-indicator-color; order: 1; diff --git a/packages/devextreme/playground/jquery.html b/packages/devextreme/playground/jquery.html index fde766f17218..a8942bf2c47f 100644 --- a/packages/devextreme/playground/jquery.html +++ b/packages/devextreme/playground/jquery.html @@ -1,26 +1,27 @@ + - DevExtreme jQuery Example + DevExtreme jQuery Example - + - + document.getElementsByTagName("head")[0].appendChild(link); + - - - + + + - - - - - + + + + -
-

Test header

- - -
-
- +
+

Test header

+ + +
+ +
+
+
+
+ + +