Merge pull request #43 from HC200ok/Fix/table-hover-color

fix table hover color
HC200ok · Jun 25, 2022 · bec041e · bec041e
2 parents 1bf9de6 + cebe080
commit bec041e
Show file tree

Hide file tree

Showing 3 changed files with 17 additions and 3 deletions.
diff --git a/package.json b/package.json
@@ -3,7 +3,7 @@
   "author": "HC200ok",
   "description": "A customizable and easy-to-use data table component made with Vue.js 3.x.",
   "private": false,
-  "version": "1.2.16",
+  "version": "1.2.17",
   "types": "./types/main.d.ts",
   "license": "MIT",
   "files": [

diff --git a/src/components/DataTable.vue b/src/components/DataTable.vue
@@ -1096,7 +1096,7 @@ defineExpose({
         tbody {
           font-size: v-bind(fontSizePx);
           &.hover-to-change-color {
-            tr:hover {
+            tr:hover td{
               background-color: v-bind(rowHoverBackgroundColor);
               color: v-bind(rowHoverFontColor);
             }
@@ -1129,7 +1129,7 @@ defineExpose({
           }
           &.row-alternation {
             &.hover-to-change-color {
-              tr:hover {
+              tr:hover td, tr:nth-child(2n):hover td {
                 background-color: v-bind(rowHoverBackgroundColor);
                 color: v-bind(rowHoverFontColor);
               }

diff --git a/src/modes/Client.vue b/src/modes/Client.vue
@@ -50,6 +50,20 @@
       sort-by="age"
       sort-type="desc"
       @click-row="showItem"
+      v-model:items-selected="itemsSelected"
+      table-border-color="#445269"
+      row-border-color="#445269"
+      header-background-color="#2d3a4f"
+      header-font-color="#c1cad4"
+      even-row-background-color="#4c5d7a"
+      even-row-font-color="#fff"
+      footer-background-color="#2d3a4f"
+      footer-font-color="#c0c7d2"
+      row-background-color="#2d3a4f"
+      row-font-color="#c0c7d2"
+      row-hover-background-color="#eee"
+      row-hover-font-color="#2d3a4f"
+      theme-color="#1d90ff"
     >
     </DataTable>