Consolidate cover previews on search results to show 4 stacked covers and adjust result details.#12090
Merged
lokesh merged 10 commits intointernetarchive:masterfrom Apr 7, 2026
Conversation
… with adjusted result details
497020b to
0104395
Compare
60e31e0 to
d2aea2c
Compare
for more information, see https://pre-commit.ci
Contributor
Author
|
@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? |
- Show 5 preview covers instead of 4, with larger thumbnails and tighter overlap - Add border, hover, and focus-visible styles to preview cover links - Show edition/ebook/language details for works without preview covers - Always show ebook count (not conditional on ia existing in preview section) - Update border-radius-thumbnail token from 2px to 4px
Replace two-part `.searchResultItem .preview-covers` selectors with single-class `.search-result-item__preview-covers` to reduce specificity and resolve stylelint selector-max-specificity violations.
Replace hardcoded px values with design token variables and simplify :where(img) selectors to plain img descendants.
Collaborator
|
@Saad259 The bug caused us to hide the edition/ebook/language details for works without preview covers. cover-preview.mp4 |
lokesh
approved these changes
Apr 7, 2026
Collaborator
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.

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
Screenshot
Before:

After:

Stakeholders
@cdrini