search

ONSdigital / sdc-global-design-patterns

The SDC Global Design Pattern library. Used as the basis for SDC projects. Outputs to CDN for use in production and development projects, documentation publishes to netlify.
https://sdc-global-design-patterns.netlify.com/
11 stars 2 forks source link

Component table update #196

Closed boxadesign closed 5 years ago

boxadesign commented 6 years ago

What is the context of this PR?

Describe what you have changed and why, link to other PRs or Issues as appropriate.

How to review

Describe the steps required to test the changes (include screenshots if appropriate).

boxadesign commented 5 years ago

@bameyrick I've completed work on the js for the sortable table variant so it's ready for review again.

armstrongb commented 5 years ago

Added to the A11y auditing to be conducted.

RhodGriffith commented 5 years ago

@boxadesign @armstrongb Tables are looking good. For consistency, should we make the sortable table headers bold as well? Could also remove the underline as they're not links, what do you think?

armstrongb commented 5 years ago

@RhodGriffith I think the bold sortable th is on @boxadesign 's list

boxadesign commented 5 years ago

@armstrongb Have updated with the additional scroll shadows and scrollbar.

armstrongb commented 5 years ago

@armstrongb Have updated with the additional scroll shadows and scrollbar.

... and bold on th. LGTM

armstrongb commented 5 years ago

@boxadesign we're awaiting DAC report section on the sortable table.

boxadesign commented 5 years ago

@armstrongb Have added in some aria based on this http://adrianroselli.com/2018/02/tables-css-display-properties-and-aria.html

Have tested with voiceover and rotor and seems to be working in a sensible way now. Possibly one to go for a re-test as it's quite small.

armstrongb commented 5 years ago

Thanks @boxadesign can you add the information to the docs so that people implementing them understand necessity and need for this. Thanks.

boxadesign commented 5 years ago

@armstrongb Are we waiting on DAC sortable test before we merge in?

boxadesign commented 5 years ago

DAC had one main issue with the sortable. When the sortable th was focused it wasn't clear what the button did. Have added "Sort by" aria-label before the cell value is read out to provide more information about the button.