Show different sort indicators

Tags: #<Tag:0x00007efc60085030>
#1

We’ve recently updated … from 0.34 to 7.4.2

Our sort indicators used to be

.handsontable .sorted-column-header-desc::after,
.handsontable .columnSorting.descending::after {
    cursor: pointer;
    content: '\25BC';
    color: #5f5f5f;
}

.handsontable .sorted-column-header-asc::after,
.handsontable .columnSorting.ascending::after {
    cursor: pointer;
    content: '\25B2';
    color: #5f5f5f;
}

Now they show as this, and I cannot seem to force them back. Is there a config option that I am missing?

.handsontable span.colHeader.columnSorting.ascending::before {  /* arrow up; 20 x 40 px, scaled to 5 x 10 px; base64 size: 0.3kB */  background-image: url("data:image/png;base64,[snip]");}
.handsontable span.colHeader.columnSorting.descending::before {  /* arrow down; 20 x 40 px, scaled to 5 x 10 px; base64 size: 0.3kB */  background-image: url("data:image/png;base64,[snip]");}
#2

Hi @jmate

I setup an example with your settings from previous Handsontable version on version 7.4.2 and I also modified the base CSS to not showing the default indicators. Is that what you needed?

https://jsfiddle.net/aszymanski/64s1p3hx/2/

#3

Thanks. I thought it might be a config option. This code of yours is what I needed.

.handsontable span.colHeader.columnSorting.ascending::before {
  display: none !important;
}

.handsontable span.colHeader.columnSorting.descending::before {
  display: none !important;
}
#4

That’s great to hear :slight_smile: I’m closing the topic then.

#5