Auto width does not take in consideration width of sort icon

grid-js / gridjs

Advanced table plugin

https://gridjs.io

MIT License

4.38k stars 241 forks source link

Auto width does not take in consideration width of sort icon #329

Closed viliamzigo closed 3 years ago

viliamzigo commented 3 years ago

Describe the bug

Auto width does not take in consideration sort icon. Thus, sort icon falls into next line (as in screenshot).

To Reproduce

Steps to reproduce the behavior:

Go to gridjs.io and find live editor
Allow sort and autoWidth
Change headers like in screenshot

Expected behavior

Should automatically calculate width of column with respect to sort icon and in never fall into new line.

Screenshots

sort: true -> Looks awful

sort: false -> Works nicely

Desktop (please complete the following information):

OS: Linux
Browser Chrome
Version 86

afshinm commented 3 years ago

I can look into that @viliamzigo. thanks for flagging.

stale[bot] commented 3 years ago

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

SukkaW commented 3 years ago

Is the issue being worked on? I am facing the same issue here.

https://github.com/grid-js/gridjs/blob/4e5e6a3482a25644c89e3dc1ffde1c1a13ad7dea/packages/gridjs/src/header.ts#L84-L89

It appears that only the line here needs a patch. The issue could be solved easily.

afshinm commented 3 years ago

I will send a patch today. thanks for flagging @SukkaW

afshinm commented 3 years ago

This commit should address this issue https://github.com/grid-js/gridjs/commit/d2df219c8b7981ff6958c1a2c5f7577c9bb6d532