Background
We need to ensure that the saved pages layout we built for Desktop experiment works well on small screens and Minerva. After several design explorations we have decided to maintain the card view across various viewports with adjustments to how content within the card is displayed in one-column view for smaller screens.
User Story
As a reader on mobile web, I want to all of my saved articles to be easy to browse and read on a small screen so that I can quickly find what I saved.
As a team developing this feature, we want the mobile layout to be consistent with Desktop design so that the codebase stays maintainable and web user experience remains familiar.
Design
Link to Figma
Requirements
- For viewports smaller than 450ish adjust the card layout as specified in the design
- Reduce the thumbnail size
- Introduce the padding around the thumbnail
- Reduce the title font size
- The page title matches the design on Minerva
- The copy indicating sort is in the right location on Minerva
- The empty state when no items on the page


