Skip to content

Commit 4a7e0ea

Browse files
author
dtbuild
committed
a0664009d791cea3a4c05e7f9cbc60df4c71fe88 New: columnTitleTag option which can be used to change the wrapper element type for the title / order display in the column header cell. It is span by default, and can be made a div using this option. This option is temporary and the default will be div for v3
https://datatables.net/forums/discussion/81582 Sync to source repo @a0664009d791cea3a4c05e7f9cbc60df4c71fe88
1 parent 0582182 commit 4a7e0ea

3 files changed

Lines changed: 54 additions & 54 deletions

File tree

‎css/dataTables.bootstrap5.css‎

Lines changed: 51 additions & 51 deletions
Original file line numberDiff line numberDiff line change
@@ -76,42 +76,42 @@ table.dataTable thead > tr > th:active,
7676
table.dataTable thead > tr > td:active {
7777
outline: none;
7878
}
79-
table.dataTable thead > tr > th.dt-orderable-asc span.dt-column-order:before, table.dataTable thead > tr > th.dt-ordering-asc span.dt-column-order:before,
80-
table.dataTable thead > tr > td.dt-orderable-asc span.dt-column-order:before,
81-
table.dataTable thead > tr > td.dt-ordering-asc span.dt-column-order:before {
79+
table.dataTable thead > tr > th.dt-orderable-asc .dt-column-order:before, table.dataTable thead > tr > th.dt-ordering-asc .dt-column-order:before,
80+
table.dataTable thead > tr > td.dt-orderable-asc .dt-column-order:before,
81+
table.dataTable thead > tr > td.dt-ordering-asc .dt-column-order:before {
8282
position: absolute;
8383
display: block;
8484
bottom: 50%;
8585
content: "\25B2";
8686
content: "\25B2"/"";
8787
}
88-
table.dataTable thead > tr > th.dt-orderable-desc span.dt-column-order:after, table.dataTable thead > tr > th.dt-ordering-desc span.dt-column-order:after,
89-
table.dataTable thead > tr > td.dt-orderable-desc span.dt-column-order:after,
90-
table.dataTable thead > tr > td.dt-ordering-desc span.dt-column-order:after {
88+
table.dataTable thead > tr > th.dt-orderable-desc .dt-column-order:after, table.dataTable thead > tr > th.dt-ordering-desc .dt-column-order:after,
89+
table.dataTable thead > tr > td.dt-orderable-desc .dt-column-order:after,
90+
table.dataTable thead > tr > td.dt-ordering-desc .dt-column-order:after {
9191
position: absolute;
9292
display: block;
9393
top: 50%;
9494
content: "\25BC";
9595
content: "\25BC"/"";
9696
}
97-
table.dataTable thead > tr > th.dt-orderable-asc span.dt-column-order, table.dataTable thead > tr > th.dt-orderable-desc span.dt-column-order, table.dataTable thead > tr > th.dt-ordering-asc span.dt-column-order, table.dataTable thead > tr > th.dt-ordering-desc span.dt-column-order,
98-
table.dataTable thead > tr > td.dt-orderable-asc span.dt-column-order,
99-
table.dataTable thead > tr > td.dt-orderable-desc span.dt-column-order,
100-
table.dataTable thead > tr > td.dt-ordering-asc span.dt-column-order,
101-
table.dataTable thead > tr > td.dt-ordering-desc span.dt-column-order {
97+
table.dataTable thead > tr > th.dt-orderable-asc .dt-column-order, table.dataTable thead > tr > th.dt-orderable-desc .dt-column-order, table.dataTable thead > tr > th.dt-ordering-asc .dt-column-order, table.dataTable thead > tr > th.dt-ordering-desc .dt-column-order,
98+
table.dataTable thead > tr > td.dt-orderable-asc .dt-column-order,
99+
table.dataTable thead > tr > td.dt-orderable-desc .dt-column-order,
100+
table.dataTable thead > tr > td.dt-ordering-asc .dt-column-order,
101+
table.dataTable thead > tr > td.dt-ordering-desc .dt-column-order {
102102
position: relative;
103103
width: 12px;
104104
height: 20px;
105105
}
106-
table.dataTable thead > tr > th.dt-orderable-asc span.dt-column-order:before, table.dataTable thead > tr > th.dt-orderable-asc span.dt-column-order:after, table.dataTable thead > tr > th.dt-orderable-desc span.dt-column-order:before, table.dataTable thead > tr > th.dt-orderable-desc span.dt-column-order:after, table.dataTable thead > tr > th.dt-ordering-asc span.dt-column-order:before, table.dataTable thead > tr > th.dt-ordering-asc span.dt-column-order:after, table.dataTable thead > tr > th.dt-ordering-desc span.dt-column-order:before, table.dataTable thead > tr > th.dt-ordering-desc span.dt-column-order:after,
107-
table.dataTable thead > tr > td.dt-orderable-asc span.dt-column-order:before,
108-
table.dataTable thead > tr > td.dt-orderable-asc span.dt-column-order:after,
109-
table.dataTable thead > tr > td.dt-orderable-desc span.dt-column-order:before,
110-
table.dataTable thead > tr > td.dt-orderable-desc span.dt-column-order:after,
111-
table.dataTable thead > tr > td.dt-ordering-asc span.dt-column-order:before,
112-
table.dataTable thead > tr > td.dt-ordering-asc span.dt-column-order:after,
113-
table.dataTable thead > tr > td.dt-ordering-desc span.dt-column-order:before,
114-
table.dataTable thead > tr > td.dt-ordering-desc span.dt-column-order:after {
106+
table.dataTable thead > tr > th.dt-orderable-asc .dt-column-order:before, table.dataTable thead > tr > th.dt-orderable-asc .dt-column-order:after, table.dataTable thead > tr > th.dt-orderable-desc .dt-column-order:before, table.dataTable thead > tr > th.dt-orderable-desc .dt-column-order:after, table.dataTable thead > tr > th.dt-ordering-asc .dt-column-order:before, table.dataTable thead > tr > th.dt-ordering-asc .dt-column-order:after, table.dataTable thead > tr > th.dt-ordering-desc .dt-column-order:before, table.dataTable thead > tr > th.dt-ordering-desc .dt-column-order:after,
107+
table.dataTable thead > tr > td.dt-orderable-asc .dt-column-order:before,
108+
table.dataTable thead > tr > td.dt-orderable-asc .dt-column-order:after,
109+
table.dataTable thead > tr > td.dt-orderable-desc .dt-column-order:before,
110+
table.dataTable thead > tr > td.dt-orderable-desc .dt-column-order:after,
111+
table.dataTable thead > tr > td.dt-ordering-asc .dt-column-order:before,
112+
table.dataTable thead > tr > td.dt-ordering-asc .dt-column-order:after,
113+
table.dataTable thead > tr > td.dt-ordering-desc .dt-column-order:before,
114+
table.dataTable thead > tr > td.dt-ordering-desc .dt-column-order:after {
115115
left: 0;
116116
opacity: 0.125;
117117
line-height: 9px;
@@ -128,15 +128,15 @@ table.dataTable thead > tr > td.dt-orderable-desc:hover {
128128
outline: 2px solid rgba(0, 0, 0, 0.05);
129129
outline-offset: -2px;
130130
}
131-
table.dataTable thead > tr > th.dt-ordering-asc span.dt-column-order:before, table.dataTable thead > tr > th.dt-ordering-desc span.dt-column-order:after,
132-
table.dataTable thead > tr > td.dt-ordering-asc span.dt-column-order:before,
133-
table.dataTable thead > tr > td.dt-ordering-desc span.dt-column-order:after {
131+
table.dataTable thead > tr > th.dt-ordering-asc .dt-column-order:before, table.dataTable thead > tr > th.dt-ordering-desc .dt-column-order:after,
132+
table.dataTable thead > tr > td.dt-ordering-asc .dt-column-order:before,
133+
table.dataTable thead > tr > td.dt-ordering-desc .dt-column-order:after {
134134
opacity: 0.6;
135135
}
136-
table.dataTable thead > tr > th.dt-orderable-none:not(.dt-ordering-asc, .dt-ordering-desc) span.dt-column-order:empty, table.dataTable thead > tr > th.sorting_desc_disabled span.dt-column-order:after, table.dataTable thead > tr > th.sorting_asc_disabled span.dt-column-order:before,
137-
table.dataTable thead > tr > td.dt-orderable-none:not(.dt-ordering-asc, .dt-ordering-desc) span.dt-column-order:empty,
138-
table.dataTable thead > tr > td.sorting_desc_disabled span.dt-column-order:after,
139-
table.dataTable thead > tr > td.sorting_asc_disabled span.dt-column-order:before {
136+
table.dataTable thead > tr > th.dt-orderable-none:not(.dt-ordering-asc, .dt-ordering-desc) .dt-column-order:empty, table.dataTable thead > tr > th.sorting_desc_disabled .dt-column-order:after, table.dataTable thead > tr > th.sorting_asc_disabled .dt-column-order:before,
137+
table.dataTable thead > tr > td.dt-orderable-none:not(.dt-ordering-asc, .dt-ordering-desc) .dt-column-order:empty,
138+
table.dataTable thead > tr > td.sorting_desc_disabled .dt-column-order:after,
139+
table.dataTable thead > tr > td.sorting_asc_disabled .dt-column-order:before {
140140
display: none;
141141
}
142142
table.dataTable thead > tr > th:active,
@@ -157,24 +157,24 @@ table.dataTable tfoot > tr > td div.dt-column-footer {
157157
align-items: var(--dt-header-align-items);
158158
gap: 4px;
159159
}
160-
table.dataTable thead > tr > th div.dt-column-header span.dt-column-title,
161-
table.dataTable thead > tr > th div.dt-column-footer span.dt-column-title,
162-
table.dataTable thead > tr > td div.dt-column-header span.dt-column-title,
163-
table.dataTable thead > tr > td div.dt-column-footer span.dt-column-title,
164-
table.dataTable tfoot > tr > th div.dt-column-header span.dt-column-title,
165-
table.dataTable tfoot > tr > th div.dt-column-footer span.dt-column-title,
166-
table.dataTable tfoot > tr > td div.dt-column-header span.dt-column-title,
167-
table.dataTable tfoot > tr > td div.dt-column-footer span.dt-column-title {
160+
table.dataTable thead > tr > th div.dt-column-header .dt-column-title,
161+
table.dataTable thead > tr > th div.dt-column-footer .dt-column-title,
162+
table.dataTable thead > tr > td div.dt-column-header .dt-column-title,
163+
table.dataTable thead > tr > td div.dt-column-footer .dt-column-title,
164+
table.dataTable tfoot > tr > th div.dt-column-header .dt-column-title,
165+
table.dataTable tfoot > tr > th div.dt-column-footer .dt-column-title,
166+
table.dataTable tfoot > tr > td div.dt-column-header .dt-column-title,
167+
table.dataTable tfoot > tr > td div.dt-column-footer .dt-column-title {
168168
flex-grow: 1;
169169
}
170-
table.dataTable thead > tr > th div.dt-column-header span.dt-column-title:empty,
171-
table.dataTable thead > tr > th div.dt-column-footer span.dt-column-title:empty,
172-
table.dataTable thead > tr > td div.dt-column-header span.dt-column-title:empty,
173-
table.dataTable thead > tr > td div.dt-column-footer span.dt-column-title:empty,
174-
table.dataTable tfoot > tr > th div.dt-column-header span.dt-column-title:empty,
175-
table.dataTable tfoot > tr > th div.dt-column-footer span.dt-column-title:empty,
176-
table.dataTable tfoot > tr > td div.dt-column-header span.dt-column-title:empty,
177-
table.dataTable tfoot > tr > td div.dt-column-footer span.dt-column-title:empty {
170+
table.dataTable thead > tr > th div.dt-column-header .dt-column-title:empty,
171+
table.dataTable thead > tr > th div.dt-column-footer .dt-column-title:empty,
172+
table.dataTable thead > tr > td div.dt-column-header .dt-column-title:empty,
173+
table.dataTable thead > tr > td div.dt-column-footer .dt-column-title:empty,
174+
table.dataTable tfoot > tr > th div.dt-column-header .dt-column-title:empty,
175+
table.dataTable tfoot > tr > th div.dt-column-footer .dt-column-title:empty,
176+
table.dataTable tfoot > tr > td div.dt-column-header .dt-column-title:empty,
177+
table.dataTable tfoot > tr > td div.dt-column-footer .dt-column-title:empty {
178178
display: none;
179179
}
180180

@@ -576,16 +576,16 @@ table.dataTable.table-sm > thead > tr td.dt-ordering-asc,
576576
table.dataTable.table-sm > thead > tr td.dt-ordering-desc {
577577
padding-right: 0.25rem;
578578
}
579-
table.dataTable.table-sm > thead > tr th.dt-orderable-asc span.dt-column-order, table.dataTable.table-sm > thead > tr th.dt-orderable-desc span.dt-column-order, table.dataTable.table-sm > thead > tr th.dt-ordering-asc span.dt-column-order, table.dataTable.table-sm > thead > tr th.dt-ordering-desc span.dt-column-order,
580-
table.dataTable.table-sm > thead > tr td.dt-orderable-asc span.dt-column-order,
581-
table.dataTable.table-sm > thead > tr td.dt-orderable-desc span.dt-column-order,
582-
table.dataTable.table-sm > thead > tr td.dt-ordering-asc span.dt-column-order,
583-
table.dataTable.table-sm > thead > tr td.dt-ordering-desc span.dt-column-order {
579+
table.dataTable.table-sm > thead > tr th.dt-orderable-asc .dt-column-order, table.dataTable.table-sm > thead > tr th.dt-orderable-desc .dt-column-order, table.dataTable.table-sm > thead > tr th.dt-ordering-asc .dt-column-order, table.dataTable.table-sm > thead > tr th.dt-ordering-desc .dt-column-order,
580+
table.dataTable.table-sm > thead > tr td.dt-orderable-asc .dt-column-order,
581+
table.dataTable.table-sm > thead > tr td.dt-orderable-desc .dt-column-order,
582+
table.dataTable.table-sm > thead > tr td.dt-ordering-asc .dt-column-order,
583+
table.dataTable.table-sm > thead > tr td.dt-ordering-desc .dt-column-order {
584584
right: 0.25rem;
585585
}
586-
table.dataTable.table-sm > thead > tr th.dt-type-date span.dt-column-order, table.dataTable.table-sm > thead > tr th.dt-type-numeric span.dt-column-order,
587-
table.dataTable.table-sm > thead > tr td.dt-type-date span.dt-column-order,
588-
table.dataTable.table-sm > thead > tr td.dt-type-numeric span.dt-column-order {
586+
table.dataTable.table-sm > thead > tr th.dt-type-date .dt-column-order, table.dataTable.table-sm > thead > tr th.dt-type-numeric .dt-column-order,
587+
table.dataTable.table-sm > thead > tr td.dt-type-date .dt-column-order,
588+
table.dataTable.table-sm > thead > tr td.dt-type-numeric .dt-column-order {
589589
left: 0.25rem;
590590
}
591591

0 commit comments

Comments
 (0)