Merge branch 'primefaces:master' into master

qburst · Dec 20, 2023 · 52ae8ea · 52ae8ea
2 parents 4cb0b9c + d564610
commit 52ae8ea
Show file tree

Hide file tree

Showing 61 changed files with 239 additions and 236 deletions.
diff --git a/components/lib/datatable/BodyRow.vue b/components/lib/datatable/BodyRow.vue
@@ -33,6 +33,7 @@
             @dragend="onRowDragEnd"
             @drop="onRowDrop"
             v-bind="getBodyRowPTOptions('bodyRow')"
+            :data-p-index="rowIndex"
             :data-p-selectable-row="selectionMode ? true : false"
             :data-p-highlight="selection && isSelected"
             :data-p-highlight-contextmenu="contextMenuSelection && isSelectedWithContextMenu"
@@ -482,7 +483,7 @@ export default {
                 }
             }
 
-            return [this.cx('row', { rowData: this.rowData }), rowStyleClass];
+            return [this.cx('row', { rowData: this.rowData, index: this.rowIndex }), rowStyleClass];
         },
         rowTabindex() {
             if (this.selection === null && (this.selectionMode === 'single' || this.selectionMode === 'multiple')) {

diff --git a/components/lib/datatable/style/DataTableStyle.js b/components/lib/datatable/style/DataTableStyle.js
@@ -368,7 +368,7 @@ const classes = {
     rowgroupHeader: 'p-rowgroup-header',
     rowGroupToggler: 'p-row-toggler p-link',
     rowGroupTogglerIcon: 'p-row-toggler-icon',
-    row: ({ instance, props }) => {
+    row: ({ instance, props, index }) => {
         let rowStyleClass = [];
 
         if (props.selectionMode) {
@@ -387,6 +387,8 @@ const classes = {
             });
         }
 
+        rowStyleClass.push(index % 2 === 0 ? 'p-row-even' : 'p-row-odd');
+
         return rowStyleClass;
     },
     rowExpansion: 'p-datatable-row-expansion',

diff --git a/components/lib/image/Image.vue b/components/lib/image/Image.vue
@@ -104,13 +104,9 @@ export default {
             this.previewClick = true;
         },
         onMaskClick(event) {
-            const isActionbarTarget = [event.target.classList].includes('p-image-action') || event.target.closest('.p-image-action');
+            const isBarActionsClicked = DomHandler.isAttributeEquals(event.target, 'data-pc-section-group', 'action') || event.target.closest('[data-pc-section-group="action"]');
 
-            if (isActionbarTarget) {
-                return;
-            }
-
-            if (!this.previewClick) {
+            if (!this.previewClick && !isBarActionsClicked) {
                 this.previewVisible = false;
                 this.rotate = 0;
                 this.scale = 1;

diff --git a/components/lib/image/style/ImageStyle.js b/components/lib/image/style/ImageStyle.js
@@ -50,6 +50,10 @@ const css = `
         justify-content: center;
         align-items: center;
     }
+    
+    .p-image-action.p-disabled {
+        pointer-events: auto;
+    }
 
     .p-image-preview {
         transition: transform 0.15s;

diff --git a/public/themes/arya-blue/theme.css b/public/themes/arya-blue/theme.css
@@ -2799,17 +2799,17 @@
   .p-datatable.p-datatable-gridlines:has(.p-datatable-tbody):has(.p-datatable-tfoot) .p-datatable-tbody > tr:last-child > td:last-child {
     border-width: 0 1px 0 1px;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even) {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd {
     background: #242424;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight {
     background: rgba(100, 181, 246, 0.16);
     color: rgba(255, 255, 255, 0.87);
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight .p-row-toggler {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight .p-row-toggler {
     color: rgba(255, 255, 255, 0.87);
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight .p-row-toggler:hover {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight .p-row-toggler:hover {
     color: rgba(255, 255, 255, 0.87);
   }
   .p-datatable.p-datatable-sm .p-datatable-header {

diff --git a/public/themes/arya-green/theme.css b/public/themes/arya-green/theme.css
@@ -2799,17 +2799,17 @@
   .p-datatable.p-datatable-gridlines:has(.p-datatable-tbody):has(.p-datatable-tfoot) .p-datatable-tbody > tr:last-child > td:last-child {
     border-width: 0 1px 0 1px;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even) {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd {
     background: #242424;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight {
     background: rgba(129, 199, 132, 0.16);
     color: rgba(255, 255, 255, 0.87);
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight .p-row-toggler {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight .p-row-toggler {
     color: rgba(255, 255, 255, 0.87);
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight .p-row-toggler:hover {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight .p-row-toggler:hover {
     color: rgba(255, 255, 255, 0.87);
   }
   .p-datatable.p-datatable-sm .p-datatable-header {

diff --git a/public/themes/arya-orange/theme.css b/public/themes/arya-orange/theme.css
@@ -2799,17 +2799,17 @@
   .p-datatable.p-datatable-gridlines:has(.p-datatable-tbody):has(.p-datatable-tfoot) .p-datatable-tbody > tr:last-child > td:last-child {
     border-width: 0 1px 0 1px;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even) {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd {
     background: #242424;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight {
     background: rgba(255, 213, 79, 0.16);
     color: rgba(255, 255, 255, 0.87);
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight .p-row-toggler {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight .p-row-toggler {
     color: rgba(255, 255, 255, 0.87);
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight .p-row-toggler:hover {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight .p-row-toggler:hover {
     color: rgba(255, 255, 255, 0.87);
   }
   .p-datatable.p-datatable-sm .p-datatable-header {

diff --git a/public/themes/arya-purple/theme.css b/public/themes/arya-purple/theme.css
@@ -2799,17 +2799,17 @@
   .p-datatable.p-datatable-gridlines:has(.p-datatable-tbody):has(.p-datatable-tfoot) .p-datatable-tbody > tr:last-child > td:last-child {
     border-width: 0 1px 0 1px;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even) {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd {
     background: #242424;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight {
     background: rgba(186, 104, 200, 0.16);
     color: rgba(255, 255, 255, 0.87);
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight .p-row-toggler {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight .p-row-toggler {
     color: rgba(255, 255, 255, 0.87);
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight .p-row-toggler:hover {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight .p-row-toggler:hover {
     color: rgba(255, 255, 255, 0.87);
   }
   .p-datatable.p-datatable-sm .p-datatable-header {

diff --git a/public/themes/bootstrap4-dark-blue/theme.css b/public/themes/bootstrap4-dark-blue/theme.css
@@ -2811,17 +2811,17 @@
   .p-datatable.p-datatable-gridlines:has(.p-datatable-tbody):has(.p-datatable-tfoot) .p-datatable-tbody > tr:last-child > td:last-child {
     border-width: 0 1px 0 1px;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even) {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd {
     background: #2f3641;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight {
     background: #8dd0ff;
     color: #151515;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight .p-row-toggler {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight .p-row-toggler {
     color: #151515;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight .p-row-toggler:hover {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight .p-row-toggler:hover {
     color: #151515;
   }
   .p-datatable.p-datatable-sm .p-datatable-header {

diff --git a/public/themes/bootstrap4-dark-purple/theme.css b/public/themes/bootstrap4-dark-purple/theme.css
@@ -2811,17 +2811,17 @@
   .p-datatable.p-datatable-gridlines:has(.p-datatable-tbody):has(.p-datatable-tfoot) .p-datatable-tbody > tr:last-child > td:last-child {
     border-width: 0 1px 0 1px;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even) {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd {
     background: #2f3641;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight {
     background: #c298d8;
     color: #151515;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight .p-row-toggler {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight .p-row-toggler {
     color: #151515;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight .p-row-toggler:hover {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight .p-row-toggler:hover {
     color: #151515;
   }
   .p-datatable.p-datatable-sm .p-datatable-header {

diff --git a/public/themes/bootstrap4-light-blue/theme.css b/public/themes/bootstrap4-light-blue/theme.css
@@ -2811,17 +2811,17 @@
   .p-datatable.p-datatable-gridlines:has(.p-datatable-tbody):has(.p-datatable-tfoot) .p-datatable-tbody > tr:last-child > td:last-child {
     border-width: 0 1px 0 1px;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even) {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd {
     background: rgba(0, 0, 0, 0.05);
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight {
     background: #007bff;
     color: #ffffff;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight .p-row-toggler {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight .p-row-toggler {
     color: #ffffff;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight .p-row-toggler:hover {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight .p-row-toggler:hover {
     color: #ffffff;
   }
   .p-datatable.p-datatable-sm .p-datatable-header {

diff --git a/public/themes/bootstrap4-light-purple/theme.css b/public/themes/bootstrap4-light-purple/theme.css
@@ -2811,17 +2811,17 @@
   .p-datatable.p-datatable-gridlines:has(.p-datatable-tbody):has(.p-datatable-tfoot) .p-datatable-tbody > tr:last-child > td:last-child {
     border-width: 0 1px 0 1px;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even) {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd {
     background: rgba(0, 0, 0, 0.05);
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight {
     background: #883cae;
     color: #ffffff;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight .p-row-toggler {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight .p-row-toggler {
     color: #ffffff;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight .p-row-toggler:hover {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight .p-row-toggler:hover {
     color: #ffffff;
   }
   .p-datatable.p-datatable-sm .p-datatable-header {

diff --git a/public/themes/fluent-light/theme.css b/public/themes/fluent-light/theme.css
@@ -2799,17 +2799,17 @@
   .p-datatable.p-datatable-gridlines:has(.p-datatable-tbody):has(.p-datatable-tfoot) .p-datatable-tbody > tr:last-child > td:last-child {
     border-width: 0 1px 0 1px;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even) {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd {
     background: #faf9f8;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight {
     background: #edebe9;
     color: #323130;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight .p-row-toggler {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight .p-row-toggler {
     color: #323130;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight .p-row-toggler:hover {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight .p-row-toggler:hover {
     color: #323130;
   }
   .p-datatable.p-datatable-sm .p-datatable-header {

diff --git a/public/themes/lara-dark-amber/theme.css b/public/themes/lara-dark-amber/theme.css
@@ -2818,17 +2818,17 @@
   .p-datatable.p-datatable-gridlines:has(.p-datatable-tbody):has(.p-datatable-tfoot) .p-datatable-tbody > tr:last-child > td:last-child {
     border-width: 0 1px 0 1px;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even) {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd {
     background: #1c2532;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight {
     background: rgba(251, 191, 36, 0.16);
     color: rgba(255, 255, 255, 0.87);
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight .p-row-toggler {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight .p-row-toggler {
     color: rgba(255, 255, 255, 0.87);
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight .p-row-toggler:hover {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight .p-row-toggler:hover {
     color: rgba(255, 255, 255, 0.87);
   }
   .p-datatable.p-datatable-sm .p-datatable-header {

diff --git a/public/themes/lara-dark-blue/theme.css b/public/themes/lara-dark-blue/theme.css
@@ -2818,17 +2818,17 @@
   .p-datatable.p-datatable-gridlines:has(.p-datatable-tbody):has(.p-datatable-tfoot) .p-datatable-tbody > tr:last-child > td:last-child {
     border-width: 0 1px 0 1px;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even) {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd {
     background: #1c2532;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight {
     background: rgba(96, 165, 250, 0.16);
     color: rgba(255, 255, 255, 0.87);
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight .p-row-toggler {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight .p-row-toggler {
     color: rgba(255, 255, 255, 0.87);
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight .p-row-toggler:hover {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight .p-row-toggler:hover {
     color: rgba(255, 255, 255, 0.87);
   }
   .p-datatable.p-datatable-sm .p-datatable-header {

diff --git a/public/themes/lara-dark-cyan/theme.css b/public/themes/lara-dark-cyan/theme.css
@@ -2818,17 +2818,17 @@
   .p-datatable.p-datatable-gridlines:has(.p-datatable-tbody):has(.p-datatable-tfoot) .p-datatable-tbody > tr:last-child > td:last-child {
     border-width: 0 1px 0 1px;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even) {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd {
     background: #1c2532;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight {
     background: rgba(34, 211, 238, 0.16);
     color: rgba(255, 255, 255, 0.87);
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight .p-row-toggler {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight .p-row-toggler {
     color: rgba(255, 255, 255, 0.87);
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight .p-row-toggler:hover {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight .p-row-toggler:hover {
     color: rgba(255, 255, 255, 0.87);
   }
   .p-datatable.p-datatable-sm .p-datatable-header {

diff --git a/public/themes/lara-dark-green/theme.css b/public/themes/lara-dark-green/theme.css
@@ -2818,17 +2818,17 @@
   .p-datatable.p-datatable-gridlines:has(.p-datatable-tbody):has(.p-datatable-tfoot) .p-datatable-tbody > tr:last-child > td:last-child {
     border-width: 0 1px 0 1px;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even) {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd {
     background: #1c2532;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight {
     background: rgba(52, 211, 153, 0.16);
     color: rgba(255, 255, 255, 0.87);
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight .p-row-toggler {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight .p-row-toggler {
     color: rgba(255, 255, 255, 0.87);
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight .p-row-toggler:hover {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight .p-row-toggler:hover {
     color: rgba(255, 255, 255, 0.87);
   }
   .p-datatable.p-datatable-sm .p-datatable-header {

diff --git a/public/themes/lara-dark-indigo/theme.css b/public/themes/lara-dark-indigo/theme.css
@@ -2818,17 +2818,17 @@
   .p-datatable.p-datatable-gridlines:has(.p-datatable-tbody):has(.p-datatable-tfoot) .p-datatable-tbody > tr:last-child > td:last-child {
     border-width: 0 1px 0 1px;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even) {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd {
     background: #1c2532;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight {
     background: rgba(129, 140, 248, 0.16);
     color: rgba(255, 255, 255, 0.87);
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight .p-row-toggler {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight .p-row-toggler {
     color: rgba(255, 255, 255, 0.87);
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight .p-row-toggler:hover {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight .p-row-toggler:hover {
     color: rgba(255, 255, 255, 0.87);
   }
   .p-datatable.p-datatable-sm .p-datatable-header {

diff --git a/public/themes/lara-dark-pink/theme.css b/public/themes/lara-dark-pink/theme.css
@@ -2818,17 +2818,17 @@
   .p-datatable.p-datatable-gridlines:has(.p-datatable-tbody):has(.p-datatable-tfoot) .p-datatable-tbody > tr:last-child > td:last-child {
     border-width: 0 1px 0 1px;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even) {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd {
     background: #1c2532;
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight {
     background: rgba(244, 114, 182, 0.16);
     color: rgba(255, 255, 255, 0.87);
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight .p-row-toggler {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight .p-row-toggler {
     color: rgba(255, 255, 255, 0.87);
   }
-  .p-datatable.p-datatable-striped .p-datatable-tbody > tr:nth-child(even).p-highlight .p-row-toggler:hover {
+  .p-datatable.p-datatable-striped .p-datatable-tbody > tr.p-row-odd.p-highlight .p-row-toggler:hover {
     color: rgba(255, 255, 255, 0.87);
   }
   .p-datatable.p-datatable-sm .p-datatable-header {