I've discovered that from the desktop version of the site, it's not possible to move left and right in the catalogue when Full Record is checked without using the arrow keys. We may implement the Ext JS table down the road, so this could be resolved, but that's some time away. So in the meantime could you please do the following:
Make the words "Full Record" on the left side look like a hyperlink.
Once clicked, please make it so that a tooltip appears, exactly like the one you just added for the viewer. The tooltip should say:
On desktop computers, use the <- left and right -> arrows keys (or the slider at the bottom of the table) to scroll right and left in the table.
I've been thinking about the table layout and I think it might be best if we make each row appear as a table, see the example below:
This:
Becomes:
This way we wouldn't need any side scrolling, and it has the nice benefit of showing more data from a single row at a time. As I think people reading the site will be more interested in viewing the content of a single row rather than comparing values between two or more rows. Adopting this method would also save us the hastle of rebuilding the table to work with extjs.
The tool tip is a bit problematic in that the Full Record is togglable, and users can be linked to the page with it enabled so they wouldn't see the tooltip on first visit.
Does the screen shots look acceptable? Alternatively we could also just place the descriptive text below the Full Record option?
This should be OK. For now, just put in on stage and I can check it out there. I would like to have some right padding for the text on the left and, alternately, left padding for the text on the right so that it's a) not so bunched next to the numbers on desktop and b) has a bit of space between the two sides it goes to smaller sizes and goes on its own line. Also note that this can probably disappear on the phone versions of the site, no? It's mainly needed for laptop and desktop computers.
Overall this looks good, but please make the following modifications:
Change the text as follows (note the dashes added next to the arrows):
‹-- scroll in table: left arrow key
scroll in table: right arrow key --›
When the text goes to its own line above the numbers, bring the two sides in so they are centered (rather than float left and right), but put a little padding between them so that users can tell these are two separate things
This looks great. Please make two small changes in the wording as follows:
Replace "scroll" in both cases with "click"
Replace the colon with a comma
So....
← click in table, left arrow key
click in table, right arrow key →
Also, question: would it be possible to hide this text until 1) someone checks the full record or 2) the width of the screen narrows to the point where part of the table starts to be hidden?
K it's deployed to stage, now it will only display the text if the table can't fit into the display, except of course when it's lower resolution like mobile in which case it doesn't display.
I've discovered that from the desktop version of the site, it's not possible to move left and right in the catalogue when Full Record is checked without using the arrow keys. We may implement the Ext JS table down the road, so this could be resolved, but that's some time away. So in the meantime could you please do the following:
On desktop computers, use the <- left and right -> arrows keys (or the slider at the bottom of the table) to scroll right and left in the table.
Alternately, just above the table, on the same line and in the same font as the line that says:
we could put on the left side
<- Left arrow key to scroll left
and on the right side
Right arrow key to scroll right ->
We'd just have to work out that these two moved to their own line once the table began to narrow for mobile.
I've been thinking about the table layout and I think it might be best if we make each row appear as a table, see the example below:
This:
Becomes:
This way we wouldn't need any side scrolling, and it has the nice benefit of showing more data from a single row at a time. As I think people reading the site will be more interested in viewing the content of a single row rather than comparing values between two or more rows. Adopting this method would also save us the hastle of rebuilding the table to work with extjs.
Desktop Large:
Desktop Small:
Mobile:
The tool tip is a bit problematic in that the Full Record is togglable, and users can be linked to the page with it enabled so they wouldn't see the tooltip on first visit.
Does the screen shots look acceptable? Alternatively we could also just place the descriptive text below the Full Record option?
This should be OK. For now, just put in on stage and I can check it out there. I would like to have some right padding for the text on the left and, alternately, left padding for the text on the right so that it's a) not so bunched next to the numbers on desktop and b) has a bit of space between the two sides it goes to smaller sizes and goes on its own line. Also note that this can probably disappear on the phone versions of the site, no? It's mainly needed for laptop and desktop computers.
It's deployed to stage, for review.
Overall this looks good, but please make the following modifications:
‹-- scroll in table: left arrow key
scroll in table: right arrow key --›
Also, when the scroll text goes to its own line, can we put it below the numbers line rather than above?
Deployed to stage and ready for review.
This looks great. Please make two small changes in the wording as follows:
Replace "scroll" in both cases with "click" Replace the colon with a comma
So....
← click in table, left arrow key
click in table, right arrow key →
Also, question: would it be possible to hide this text until 1) someone checks the full record or 2) the width of the screen narrows to the point where part of the table starts to be hidden?
K it's deployed to stage, now it will only display the text if the table can't fit into the display, except of course when it's lower resolution like mobile in which case it doesn't display.
Works perfectly! Thank you! Please push to prod ASAP!
K, Deployed to prod.