Feature Request: Paper Preview Modal for Research Papers #624
Description
✨ Feature Description
Currently, when a user clicks on a paper entry, it either opens a new page or just shows basic info on the card. To improve user experience, we can add a modal popup that shows detailed information about the paper without navigating away from the main page.
🎯 Why is this Needed?
Currently, users have to either read limited details on the paper card or navigate away to see more. This makes browsing slow and less interactive.
A modal popup allows users to quickly preview a paper’s details (title, authors, description, tags, PDF link) without leaving the main page.
It improves the user experience, keeps everything in one place, and makes the app feel more polished.
📋 Possible Implementation
Add a hidden modal component in index.html.
Style it with CSS (modal.css or inside style.css) to ensure a clean, minimal design.
Use JavaScript to:
Trigger the modal when a paper card is clicked.
Populate modal fields with data from the selected card (using data-* attributes).
Close the modal when the × button or background is clicked.
(Optional) Add keyboard support (ESC key to close modal).
📸 Mockups / Examples (if any)
+-------------------------------------------+
| Understanding Transformers [ × ] |
|---|
| Author(s): Abhishek |
| A detailed paper introducing the |
| Transformer architecture. |
| Tags: AI, NLP |
| [ 📄 View PDF ] |
| +-------------------------------------------+ |
✅ Additional Notes
This feature can be implemented using pure HTML, CSS, and JS (no external libraries needed).
Good first issue: contributors can learn about DOM manipulation, event handling, and CSS modals.
Can be extended later with extra features like Next/Previous navigation or Dark Mode compatibility