Holiday Notice: Support will be provided on a limited scale from December 24th, 2024, to January 2nd, 2025. Happy holidays and a wonderful New Year!


Topic: mdb-datatable-hover-color does not change text color in an mdbdatatable

DashMarketingGroup priority asked 6 months ago


Following the documentation, I am trying to use the following CSS to render the colors of an mdbdatatable row when the user hovers over it. The background color statement works, but the one to set the text forecolor does not. Is there something I am missing? Here's the CSS:

    .datatable {
    --mdb-datatable-hover-bg: #efeeb3;
    --mdb-datatable-font-size: 18px;
    --mdb-datatable-hover-color: #ffffff;
    --mdb-datatable-hover-tbody-tr-transition: #304753 0.2s ease-in;
}

The font-size and hover-color values work correctly, but the hover-bg does not. Can you please advise?


Kamila Pieńkowska staff answered 6 months ago


I don't understand. I've prepared a snippet with your code and background color on hover uses provided value: https://mdbootstrap.com/snippets/standard/kpienkowska/6149164


DashMarketingGroup priority commented 6 months ago

Your own example doesn't work. The question is about the color of the text when a row is hovered over. The background color changes, but the text color stays the same, even though your code says it should be white text on a yellow background.


Kamila Pieńkowska staff commented 6 months ago

You wrote hover-bg does not work, that made me confused.

I've updated my snippet so font color will be changed too.


DashMarketingGroup priority answered 6 months ago


Your updated snippet worked. Thank you!



Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Answered

Specification of the issue

  • ForumUser: Priority
  • Premium support: Yes
  • Technology: MDB Standard
  • MDB Version: MDB5 7.3.1
  • Device: laptop
  • Browser: chrome
  • OS: win11
  • Provided sample code: Yes
  • Provided link: No