Skip to content

feat: add immersive reading streak calendar - #1052

Merged
devanshi14malhotra merged 2 commits into
devanshi14malhotra:mainfrom
ishita526:feature/reading-streak-calendar
May 28, 2026
Merged

devanshi14malhotra merged 2 commits into
devanshi14malhotra:mainfrom
ishita526:feature/reading-streak-calendar

Conversation

@ishita526

@ishita526 ishita526 commented May 26, 2026 •

Copy link
Copy Markdown
Contributor

Related Issue

Closes #608

Description

Implemented an immersive Reading Streak Calendar feature inside the My Library section of BiblioDrift to help users visually track their daily reading consistency and build long-term reading habits.

The feature is fully integrated with the platform’s existing cozy, vibe-first design philosophy and matches the immersive glassmorphism aesthetic of BiblioDrift.

Features Added

Reading Streak Calendar

  • Added a month-wise interactive reading calendar
  • Users can mark daily reading activity
  • Active reading days are visually highlighted
  • Calendar dynamically updates streak states

Streak Tracking

  • Current streak calculation
  • Longest streak calculation
  • Automatic consecutive-day tracking logic

Daily Reading Interaction

  • Added “Mark Today as Read” functionality
  • Prevents duplicate marking for the same day
  • Real-time UI updates after interaction

Persistence

  • Implemented localStorage-based persistence
  • Reading data remains saved after refresh/revisit

UI/UX Enhancements

  • Glassmorphism-inspired immersive card design
  • Warm beige/gold aesthetic matching platform theme
  • Smooth hover transitions and animations
  • Fully responsive layout for desktop and mobile

Tech Stack

  • HTML
  • CSS
  • Vanilla JavaScript
  • localStorage

Testing Done

  • Verified streak persistence after refresh
  • Tested current and longest streak calculations
  • Tested duplicate click prevention
  • Tested responsive layout on multiple screen sizes
  • Verified smooth rendering and UI integration

Screenshots

image

Notes

The implementation focuses on maintaining daily reading consistency tracking and visual engagement while preserving the calm and immersive reading experience of BiblioDrift.

@netlify

netlify Bot commented May 26, 2026 •

Copy link
Copy Markdown

✅ Deploy Preview for bibliodrift-dm ready!

Name Link
🔨 Latest commit 18cc6fe
🔍 Latest deploy log https://app.netlify.com/projects/bibliodrift-dm/deploys/6a16473dfe01130008afd184
😎 Deploy Preview https://deploy-preview-1052--bibliodrift-dm.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

@devanshi14malhotra
devanshi14malhotra merged commit c1efa6f into devanshi14malhotra:main May 28, 2026
5 of 6 checks passed
@devanshi14malhotra devanshi14malhotra added level:beginner GSSoC'26 beginner level PR/issue gssoc:approved PR has been reviewed and is eligible for GSSoC points (for GSSoC'26) labels May 28, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

gssoc:approved PR has been reviewed and is eligible for GSSoC points (for GSSoC'26) level:beginner GSSoC'26 beginner level PR/issue

Projects

None yet

Development

Successfully merging this pull request may close these issues.

[FEATURE]: Add Reading Streak Calendar — Daily Reading Tracker

2 participants