Project Statistics cards layout needs optimization for mobile view - display 2 cards per row #804
Description
Describe the bug
The Project Statistics section on the mobile view displays each statistic card (Stars, Forks, Issues, Pull Requests, Contributors) in a single column layout, one below the other. This creates an unnecessarily long vertical scroll and makes the cards appear too large for mobile screens. The layout is not space-efficient and provides a poor user experience on mobile devices.
To Reproduce
Steps to reproduce the behavior:
- Visit https://eventra.sandeepvashishtha.tech/ on a mobile device or use mobile view in browser DevTools
- Navigate to the Project Statistics section
- Observe that all statistic cards (Stars: 31, Forks: 78, Issues: 10, Pull Requests, Contributors) are displayed in a single column
- Notice the excessive vertical space and large card sizes
Expected behavior
The Project Statistics cards should be displayed in a 2-column grid layout on mobile devices to:
- Reduce the card size for better proportions on smaller screens
- Display 2 cards per row instead of 1 card per row
- Minimize vertical scrolling
- Improve space utilization and overall visual balance
- Maintain readability while being more compact
For example:
- Row 1: Stars | Forks
- Row 2: Issues | Pull Requests
- Row 3: Contributors (centered or with another stat)
Additional context
This responsive design improvement will enhance the mobile user experience by making better use of available screen space and reducing the need for excessive scrolling. A grid layout is a common pattern for displaying multiple statistics on mobile devices.
Please assign this issue to me under Hacktoberfest. I would like to work on this and contribute to the project. Thank you! 🎃