Sort Order Indicators too small

hpegmslicensemgmt

Dear all,
In the new version of DataTables, the sort order indicators have shrunk ...

Is there any way to get them bigger again, so that even old men can see them :-)

Best regards,
David

hpegmslicensemgmt

allan

They look really small in your screenshot. What browser and OS are you using there?

They look like this for me (Firefox, OpenSuSE Tumbleweed):

table.dataTable thead > tr > th.sorting::before,
table.dataTable thead > tr > th.sorting::after {
  font-size: 1em;
}

will make them bigger with 1.12: http://live.datatables.net/zurikeka/1/edit .

Allan

hpegmslicensemgmt

hpegmslicensemgmt

Hmmm, even in your example pages I see the sort order indicators very small...
Running Chrome on Windows 10 and also tried with Edge... and also the same from my Business VDI...

hpegmslicensemgmt

hpegmslicensemgmt

On your entry page they are normal size....

On a former version of Datatables (in another project) it worked well:

• Included libraries:
• JSZip 2.5.0, pdfmake 0.1.36, DataTables 1.10.21, AutoFill 2.3.5, Buttons 1.6.3, Column visibility 1.6.3, Flash export 1.6.3, HTML5 export 1.6.3, Print view 1.6.3, ColReorder 1.5.2, FixedColumns 3.3.1, FixedHeader 3.1.7, KeyTable 2.5.2, Responsive 2.2.5, RowGroup 1.1.2, RowReorder 1.2.7, Scroller 2.0.2, SearchPanes 1.1.1, Select 1.3.1
  */

I've recently upgraded to the newest Datatables version.

Best regards,
David

allan

The old version of DataTables used images for the sorting icons. 1.12 replaced that with UTF8 characters which can be easily coloured and size changed.

Very odd indeed that the examples and the landing page show different sizes for you - they all use the same code.

Allan

allan

I'm wondering if perhaps we should set it to a fixed pixel size rather than being em based... Reason being is that if a page has a small base font-size, the icons will be reduced in size automatically. Might that be what is happening on your own pages?

Allan

lenamtl

I do agree with @hpegmslicensemgmt , these are not enough visible and not intuitive
The old icons was using 3 icons unsorted, asc, desc and they were a lot bigger.
I'm trying to get the old icons back for my project.

allan

I think they look about the right size here - I wouldn't want them any bigger.

Can you give me a link to your page showing how they are for you please? It might be the font-size on your page causing them to be really small.

Allan

kthorngren

They look fine in that example. However the BS5 example on a Mac with Chrome is small and different sizes for ASC and DESC, for example:

The BS 3 and 4 examples look the same.

Kevin

allan

I think that has been fixed with this commit. I need to get that punted out with a new release.

Allan

lenamtl

Here is what I see BS5

The problem with 2 arrow using bigger size is the space between the two will be small and maybe not userfriendly.

I rever back to the old icon method that 1.10 using (3 seperate icons 100%)

allan

Have you tried using the nightly?

Allan

lenamtl

Using the nightly
The arrow does not have enough space between the two.
I found it less intuitive especialy when no sort.

I still prefer the old icon method, 1 icon for each at 100% instead of 2 icon at 50%
Something like this, but I will set a more darker color.

allan

The old icons were Bootstrap specific, and I wanted something that would work across all styling frameworks to make the maintenance of it easier. What browser and OS are you using point?

Thanks,
Allan

lenamtl

Hi,

I understand..

I'm using Chrome and Opera PC / Windows
I have checked on other computers and the space between the two is a bit more visibe but not much.

allan

Do you have zoom set on the page perhaps?

Allan

lenamtl

No zoom, 100%