snipe-it icon indicating copy to clipboard operation
snipe-it copied to clipboard

Added sticky columns and sticky header

Open snipe opened this issue 2 years ago • 4 comments

We've attempted this before, but there was some browser weirdness, so I wanted to put this PR out there for people to play with.

This allows you to keep the checkin/checkout button present on the right side, and also lets you keep the header sticky. I have seen it behave strangely on screens (in Safari) where there aren't that many records, so this will require testing across the boards - and it may be something some people hate, especially those on smaller screens whose primary goal isn't to checkin, checkout or edit/delete items. I'd love for folks to play around with it and give me some feedback.

https://user-images.githubusercontent.com/197404/173721491-8b72b903-8e2c-4f15-8106-07baad5c0fab.mov

snipe avatar Jun 15 '22 02:06 snipe

This is what I mean by "wonky display" on screens with fewer records...

Screen Shot 2022-06-14 at 7 20 28 PM

The sticky header requires the data-height attribute, and I think something in the CSS for the sticky column is trying to adjust the height as well, so when there are not enough records to fill the table, the sticky column gets too tall.

snipe avatar Jun 15 '22 02:06 snipe

I suppose I could do some mathy math to automagically determine the data-height maximum based on the number of records returned. Bummer to have to do that count when we're pulling from the API for the data tho. :-/

snipe avatar Jun 15 '22 02:06 snipe

@uberbrady I'd love it if you can take a look in the next week or so to see if there's a way to override the sticky column's height adjustment that it's doing. This isn't urgent, but I know people would be jazzed to have this.

snipe avatar Jun 15 '22 02:06 snipe

Hi @snipe, I tried this feature and it's really cool. Can't wait to have this integrated :) going to help a lot with many assets with many custom fields like mine.

However I found a small thing to be adjusted I think. Here I have some assets with multiline custom fields. if you see the last item at the bottom of the table, the item is overlapping the horizontal scrollbar as shown below

image

is it related to the data-height that you just mentioned?

veenone avatar Jun 17 '22 17:06 veenone