1. This is coming from the "Material" skin CSS. Please go to /wp-content/plugins/wpdatatables/assets/css/wdt-skins/material.css and on line 14 remove "!important":
That will allow you to change it through the custom code. I'll check with our developers if this can be removed for our next update.
2. When I take a look at your table, on front-end, it looks pretty good. Can you show me what you'd like to decrease in a screenshot?
3. You will not be able to have your table appear the same on mobile and tablet devices but you can use out Responsiveness option to collapse specific columns so the table would look good on devices with smaller screen size.
hi
i am using the material theme, but i need to customize some things, like for example the font weight of the filters and table.
i added custom css in the main settings, in the customize settings, and in the plugin wpdatatables/assets/css/wdt-skins/material.css
but nothing is changing on the front end.
1. the font is too thin and i want it to be 400.
i added this:
.wpdt-c.wdt-skin-material table thead th,
.wpdt-c.wdt-skin-material table tbody td,
.wpdt-c.wdt-skin-material table tfoot td{
font-family: 'Roboto', sans-serif !important;
font-weight: 400;
color: rgba(0, 0, 0, 0.87);
}
2. i also need to move up the "show entries" and search. i added he following:
.wpDataTablesWrapper {
margin-bottom: -20px;
}
however, nothing changed again.
3. the table looks terrible on a mobile. i want to use the desktop version on the mobile. how can i achieve this?
please help me with these issues as soon as possible because the site is live already and the users have been complaining!
thanks
Hi Miriam
Thank you for reaching out to us.
1. This is coming from the "Material" skin CSS. Please go to /wp-content/plugins/wpdatatables/assets/css/wdt-skins/material.css and on line 14 remove "!important":
So it looks like this:
.wpdt-c.wdt-skin-material table thead th, .wpdt-c.wdt-skin-material table tbody td, .wpdt-c.wdt-skin-material table tfoot td{ font-family: 'Roboto', sans-serif; font-weight: 100; color: rgba(0, 0, 0, 0.87); }That will allow you to change it through the custom code. I'll check with our developers if this can be removed for our next update.
2. When I take a look at your table, on front-end, it looks pretty good. Can you show me what you'd like to decrease in a screenshot?
3. You will not be able to have your table appear the same on mobile and tablet devices but you can use out Responsiveness option to collapse specific columns so the table would look good on devices with smaller screen size.
Hello,
sorry to jump in on this.
i am facing the same issue and i have attempted your solution and it is still not working.
any other suggestions?
appreciate your kind support
Never mind i found the issue Thank you!