Skip to main content

[ECO Bounty] iopay News Feed Pagination UI Design Issue

Summary

The page indicator (e.g., "1 / 19") in the ioPay News section exhibits design inconsistencies that hinder readability and user navigation.

Steps to Reproduce

  1. Open the ioPay application.

  2. Navigate to the News or Discover section.

  3. Locate the pagination indicator (the text showing 1 / 19) at the bottom or top of the news feed.

  4. Observe the alignment, font size, and padding relative to the news cards.

Actual Result

Expected Result

The "1 / 19" text is either misaligned, too small for mobile accessibility, or overlaps with the "Next" button/news content.

The indicator should be centered, use a legible font weight, and have sufficient padding (white space) from the content.

The text does not update immediately or feels "stuck" when scrolling.

The indicator should update dynamically as the user scrolls or taps to the next page.

Suggested Fix

  • Alignment: Center the pagination element horizontally.

  • Interactivity: Make the "1 / 19" area a clickable "Jump to Page" input or ensure it clearly distinguishes between the current page and the total.

  • Visual Hierarchy: Use a slightly bolder weight for the current page (e.g., 1 / 19) to improve focus.

Wallet Address: io1tkw393kejmxwnd454twc6020sxcyvh5dxqmren

Device & Environment:

-Operating system: Android 13

-Device model: Redmi Note 10 Pro

Log in to comment and vote

No comments yet

Be the first to share your thoughts.