diff --git a/css/backoffice/components/_datatable.scss b/css/backoffice/components/_datatable.scss index 3786f47aa..371fbb265 100644 --- a/css/backoffice/components/_datatable.scss +++ b/css/backoffice/components/_datatable.scss @@ -14,6 +14,9 @@ $ibo-datatable-header--text-color: $ibo-base-variable--text-color !default; $ibo-datatable-panel--table-spacing: 48px !default; $ibo-datatable-panel--body--padding: $ibo-panel--body--padding-top 0px $ibo-panel--body--padding-bottom !default; +$ibo-datatable--row--background-color--is-hover: $ibo-color-primary-200 !default; +$ibo-datatable--row--background-color--is-selected: $ibo-color-primary-300 !default; + $ibo-datatable--selection-validation-buttons-toolbar--margin-top: 10px !default; $ibo-list-column--max-height: 150px !default; @@ -91,6 +94,7 @@ $ibo-fieldsorter--selected--background-color: $ibo-color-blue-200 !default; &.ibo-is-ascending::after{ content: '\f0de'; } + &.ibo-is-none::after{ content: '\f0dc'; } @@ -100,4 +104,20 @@ $ibo-fieldsorter--selected--background-color: $ibo-color-blue-200 !default; >.selected{ background-color: $ibo-fieldsorter--selected--background-color; } +} + + +.ibo-datatable { + tbody > tr { + transition: background-color 400ms linear; + + &:hover, &.selected:hover { + cursor: pointer; + background-color: $ibo-datatable--row--background-color--is-hover; + } + + &.selected { + background-color: $ibo-datatable--row--background-color--is-selected; + } + } } \ No newline at end of file diff --git a/sources/application/UI/Base/Component/DataTable/StaticTable/StaticTable.php b/sources/application/UI/Base/Component/DataTable/StaticTable/StaticTable.php index 10bcdabd8..75eeb0907 100644 --- a/sources/application/UI/Base/Component/DataTable/StaticTable/StaticTable.php +++ b/sources/application/UI/Base/Component/DataTable/StaticTable/StaticTable.php @@ -30,6 +30,7 @@ class StaticTable extends UIContentBlock 'node_modules/datatables.net-scroller/js/dataTables.scroller.min.js', 'node_modules/datatables.net-select/js/dataTables.select.min.js', 'js/field_sorter.js', + 'js/table-selectable-lines.js', 'js/dataTables.main.js', 'js/dataTables.settings.js', 'js/dataTables.pipeline.js',