search

tristen / tablesort

:arrow_up_down: A small tablesorter in plain JavaScript
https://tristen.ca/tablesort/demo/
MIT License
1.1k stars 179 forks source link

fix css arrows to be pointing in the correct direction #225

Closed craigmichaelmartin closed 2 years ago

craigmichaelmartin commented 2 years ago

Thanks for the great library!

It appears that the css for the aria-sort is creating the arrows in the opposite direction:

Screen Shot 2022-05-13 at 12 20 14 PM

The name column is correctly assorted ascending, but the arrow is pointing down instead of up.

This PR changes the CSS so the arrows point in the correct direction.

greytyphoon commented 2 years ago

Disclaimer, I'm not associated with this project in any real way, nor maintaining it, or anything. I'm just reading the PRs because I made one recently too.

It's an interesting matter of perspective. I get where you're coming from, having the arrow pointing up means "ascending" to you, but I've always seen it as indicating the reading order, having the arrow pointing up means A→Z going up, i.e. "descending". It reminds me of the "pagedown" problem, where some people expect the text to go down and some people expect the screen to go down!

In the end, it seems a lot of people agree with you on stackexchange.

LGTM ✔

tripu commented 2 years ago

This seems debatable. I don't have a problem with the current icons. But I wouldn't oppose a merge if authoritative usability sources support your interpretation either.

craigmichaelmartin commented 2 years ago

Thanks for the feedback! To be honest, I didn't realize this was an unsettled question 😊 Bad job out of me!

I could not find any usability reports to make a case either way, and now notice many applications (Apple's Numbers, Google Drive's Sheets, Google's Tables) refrain from indicating sort direction with an arrow).

I made this PR because I had used a few different javascript tables/grids in the past, and because accustomed (to the point that I thought it was canonical convention) that columns with an ascending sort have an arrow pointing up, and descending down.

For example, Grid.js, AG Grid, and Handsontable all use this convention (links are to demos). I haven't used any other javascript grid/table libraries, so have exhausted my supply, but in searching couldn't find one that illustrated ascending sort with a down arrow. The last table library I'm familiar with is React Table; it is headless so doesn't exactly help us here, but its demo sorting page uses the same convention as described (ascending up, descending down).

I'll close this PR as it seems this isn't settled, and given that it takes very little css to change on your own. If the wave of convention becomes strong enough, a maintainer can always re-open if desired.

Thanks for everyone's feedback!

tripu commented 2 years ago

Thank you for contributing, @craigmichaelmartin!

As I said, I'm not voting down, just holding it until a consensus emerges. Let's reopen it in the future if necessary, as you suggested.