An initial attempt to bring back the record selector, worked out pretty well. As initial attempt :-). But it did have some deficits.
- Impossible to distinguish the last selected record. This is especially useful while using the out-of-the-box merge functionality. The last record selected will become the survivor record;
- The picklist, mvg or calculator icon disappears for the first list column;
- Cosmetic: vertical alignment of the selector once a list control gets entered.
The screenshot below shows the more appropriate appearance of the drop-down glyph. In the initial attempt, it got pushed out as the list control grew too large. I had to tweak a bit, and resolved it using a calculated width value. The 20px equals the amount of space I added as text-indent too.
width: calc(100% – 20px) !important;
I changed the appearance for the last (or only…) record selected. Choose one you like. It also aligns now vertically. Obviously the vertical spacing might need to be changed per case, depending on the row-height for the list applets. For practical reasons in most cases the row-height should be reduced from the out-of-the-box look and feel. To fix the issue with the pushed out picklist, mvg or any other type of icon, I adjusted the margin by again the same fixed number of pixels I added as text-ident. It requires a bit of fiddling with CSS is you are not fully comfortable in this area like me.
tr.ui-row-ltr > td[role=’gridcell’]:nth-child(2) > span { /* Record selector */ margin: 0 0 0 -49px; /* from -29px to -49px */ }
The following screenshot shows once multiple records have been selected.
So, complete CSS snippet required has grown a bit to accommodate the behavior.
You can grab the complete snippet of CSS here. Enjoy! – Jeroen
