Color customization

Use props in color related propsopen in new window to customize border color, background color and font color of table head, table body and table footer.

Example

<EasyDataTable
  v-model:items-selected="itemsSelected"
  :headers="headers"
  :items="items"
  buttons-pagination
  alternating
  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"

  :hover-to-change-color="false"
/>

Edit on CodeSandboxopen in new window

PLAYERTEAMNUMBERPOSITIONHEIGHTWEIGHT (lbs)LAST ATTENDEDCOUNTRY
Stephen CurryGSW30G6-2185DavidsonUSA
Lebron JamesLAL6F6-9250St. Vincent-St. Mary HS (OH)USA
Kevin DurantBKN7F6-10240Texas-AustinUSA
Giannis AntetokounmpoMIL34F6-11242FilathlitikosGreece