Data Tables CSS changed

by Jan 16, 2022What’s new?0 comments

Icon color green

The Data Tables library file structure has changed in version 5.1.1. If you are using one of the Code Manager styles (or copied the styles into your WordPress theme), the responsive icons will be shown in its original green color instead of the color defined in the Code Manager.

Please delete the related Code Manager blocks from your Code Manager repository and download the updated code blocks to change the icon back to its correct color:

Or use the CSS below to change the color of your icons manually.

Old icon styling

table.dataTable.dtr-inline.collapsed > tbody > tr[role="row"] > td:first-child::before, 
table.dataTable.dtr-inline.collapsed > tbody > tr[role="row"] > th:first-child::before {
	background-color: #23282d !important;

New icon styling

table.dataTable.dtr-inline.collapsed > tbody > tr > td.dtr-control::before, 
table.dataTable.dtr-inline.collapsed > tbody > tr > th.dtr-control::before {
	background-color: #23282d !important; /* black icon */

The example above can be used for Code Manager style: WP-Data-Access-Data-Publisher-Color-Black

Use the follow CSS for the other Code Manager styles:

WP-Data-Access-Data-Publisher-Color-Green background-color: #719b25 !important;
WP-Data-Access-Data-Publisher-Color-Red background-color: #d1675a !important;
WP-Data-Access-Data-Publisher-Color-Boyz background-color: #096484 !important;
WP-Data-Access-Data-Publisher-Color-Barbies background-color: #ff1493 !important;

Insufficient icon padding

Updates for the following code blocks are available if the space between the responsive icon and column text is insufficient:

Global styling no longer available in free version

Global styling was removed from the free version. My apologies if you have been using this feature as a free user. It is not my intention to swap features from the free to the premium version, but this improvement is necessary to keep the plugin clean and improve maintainability (the plugin size was reduced by >30% since version 4.3).


Submit a Comment

Your email address will not be published. Required fields are marked *