[openstreetmap/openstreetmap-website] Redesign User Diary Page Using Bootstrap Grid and Cards (Issue #5125)

[Emin Kocan]

### Problem

The current user diary page could benefit from a more organized and user-friendly layout. Navigation through diary entries can be cumbersome, and readability might be improved with a different structure.

### Description

**Description**: I propose redesigning the user diary page by using Bootstrap's grid and card components, which are already part of our existing CSS framework. The main idea is to:
 - Organize diary entries using a grid layout, allowing users to view more entries at once.
 - Display each entry within a Bootstrap card, providing a cleaner and more consistent look.
 - Improve overall readability and navigation.

This idea could also work alongside [PR #5121](https://github.com/openstreetmap/openstreetmap-website/pull/5121), which addresses text truncation for long diary entries. The redesign would focus on the overall user interface and user experience.

Would love to hear what others think about this approach.

### Screenshots

![user diaries](https://github.com/user-attachments/assets/a6dcdadd-e684-4da2-9310-87a00b714668)

Note: This is just initial idea, so I can get feedback what others think about this. If there be some interest i can do mobile view too and enchance this further. Thank you.

-- 
Reply to this email directly or view it on GitHub:
https://github.com/openstreetmap/openstreetmap-website/issues/5125
You are receiving this because you are subscribed to this thread.

Message ID: <openstreetmap/openstreetmap-website/issues/5125 at github.com>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.openstreetmap.org/pipermail/rails-dev/attachments/20240828/d001f46a/attachment.htm>