Dark mode supports

[leandrocmaia]

Hi, is there a way to integrate it with tailwindcss? More specifically to enable darkmode in my app.

Thank you

[bhaveshpatel200]

Hi Leandro Maia,

Currently we are not providing darkmode but will add in near future. But you can add darkmode class in table and add css based on that class for all inner elements using tailwind css. you can check all framework guides for tailwind css from below url. https://tailwindcss.com/docs/installation/framework-guides

[FZ-Iskandar]

I'm leaving this here just in case it can help another in the future.

This is how I have made my dark theme for a vuetify style vue app:

.v-theme--dark .bh-datatable {
  & table thead tr,
    table tbody tr,
    table tfoot tr {
    background-color: #1f1f1f;
    color: #fff;
  }

  & table tbody tr:hover {
    --tw-bg-opacity: 1;
    background-color: rgba(99, 99, 99, var(--tw-bg-opacity))!important;
  }

  & .bh-form-control {
    background-color: #2c2c2c !important;
    color: #fff !important;
  }

  & .bh-filter-menu button {
    background-color: #1f1f1f;
    color: #fff;
  }

  & .bh-pagination {
    background-color: #2b2b2b;
    color: #fff;
  }

  & .\!bh-bg-white {
    background-color: #2c2c2c!important;
    color: #fff!important;

    & .bh-skeleton-box {
      background-color: #3e3e3e!important;
      color: #fff!important;
    }
  }
}