Skip to content

Consolidate cover previews on search results to show 4 stacked covers and adjust result details.#12090

Open
Saad259 wants to merge 4 commits intointernetarchive:masterfrom
Saad259:fix-consolidate-cover-previews
Open

Consolidate cover previews on search results to show 4 stacked covers and adjust result details.#12090
Saad259 wants to merge 4 commits intointernetarchive:masterfrom
Saad259:fix-consolidate-cover-previews

Conversation

@Saad259
Copy link
Contributor

@Saad259 Saad259 commented Mar 13, 2026

Closes #9468

Technical

Limits cover previews to 4 instead of 10 and displays them in a stacked/overlapping style using a flex container. The resultDetails span (first published year, edition count, ebook count, languages) is now also displayed inline next to the covers rather than below them. CSS uses nth-child selectors for the stacking z-index and overlap instead of having separate classes per image, addressing the feedback from the original PR.

Testing

  1. Go to http://localhost:8080/search?q=harry+potter
  2. Confirm search results with multiple IA editions show 4 stacked covers with publishing info inline to the right
  3. Confirm results without IA covers still render normally with no broken layout

Screenshot

Before:
image

After:
image

Stakeholders

@cdrini

@Saad259 Saad259 force-pushed the fix-consolidate-cover-previews branch 2 times, most recently from 497020b to 0104395 Compare March 13, 2026 06:35
@Saad259 Saad259 force-pushed the fix-consolidate-cover-previews branch from 60e31e0 to d2aea2c Compare March 13, 2026 06:53
@Saad259
Copy link
Contributor Author

Saad259 commented Mar 14, 2026

@cdrini AccessLint checks are still ongoing almost a day later for this PR. Initially I had javascript_tests failing due to selector ordering in the css but I managed to fix the problem. Is this something I need to look into?

@github-actions github-actions bot added the Needs: Response Issues which require feedback from lead label Mar 14, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Needs: Response Issues which require feedback from lead

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Consolidate cover previews on search results

2 participants