Update pagination style and kb navigation for editions table

[schu96]

Addresses #9853 tasks 1 and 3

Refactor

Technical

Adds a background to pagination button to make it easier for users to see which page they are currently viewing.

Prevents users from tabbing into the a element within the editions table header row, and adds an outline for the currently focused element within the row. Arrow keys left and right can be also used to switch between the two header rows. No longer implemented since this behavior does not match functionality for similar websites (i.e. Wikipedia)

Pressing enter within a section of the table header row will now update the arrow indicator for ascending/descending order.

Testing

Go to a works page and scroll down to the editions table.

Verify that the current paginated button has a grey background with black text.

Tab into the editions table header row and use Enter/ArrowLeft/ArrowRight/Tab/Shift + Tab to test added keyboard navigation.

Screenshot

2024-09-17.08-21-20.mp4

Stakeholders

@cdrini

[codecov-commenter]

Codecov Report

Attention: Patch coverage is 0% with 12 lines in your changes missing coverage. Please review.

Project coverage is 17.05%. Comparing base (ce16a79) to head (ea74c87).
Report is 483 commits behind head on master.

Files with missing lines	Patch %	Lines
...ary/plugins/openlibrary/js/editions-table/index.js	0.00%	9 Missing and 3 partials ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##           master    #9883      +/-   ##
==========================================
+ Coverage   16.06%   17.05%   +0.99%     
==========================================
  Files          90       89       -1     
  Lines        4769     4725      -44     
  Branches      832      829       -3     
==========================================
+ Hits          766      806      +40     
+ Misses       3480     3409      -71     
+ Partials      523      510      -13     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

[cdrini]

Nice this looking very slick! One small styling fix, and a small refactor to DRY up the toggle logic 😊

[cdrini]

Oh and you'll need to bump the value in the bundlesize.config.js to fix the failing JS test ; change it to 28kb https://github.com/internetarchive/openlibrary/actions/runs/11000579077/job/30543277286?pr=9883#step:9:242

[schu96]

@cdrini Unfortunately I've run into another snag with the page-admin.css bundle size by .01kb :/
Should I also bump up the value for that by .05/.1kb?

[cdrini]

@schu96 Ah yes we generally bump up to the next kilobyte to avoid this happening super often 😁

[cdrini]

Lgtm, works like a charm!