Skip to content

Phase 2 mobile calendar redesign: add week/day views#57

Open
andorcassian wants to merge 2 commits into
omnia-digital:devfrom
andorcassian:feature/phase2-mobile-week-day
Open

Phase 2 mobile calendar redesign: add week/day views#57
andorcassian wants to merge 2 commits into
omnia-digital:devfrom
andorcassian:feature/phase2-mobile-week-day

Conversation

@andorcassian
Copy link
Copy Markdown

Summary

Implements Phase 2 of the mobile calendar redesign from mobile-design/MOBILE-DESIGN-SPEC.md for omnia-digital/livewire-calendar.

This PR adds mobile-focused Week and Day view adaptations on top of the existing month view architecture, while preserving desktop month behavior and existing extension points.

What changed

  • Added new view mode support in LivewireCalendar:
    • month / week / day via $viewMode
    • New methods: setViewMode(), goToPreviousWeek(), goToNextWeek(), goToPreviousDay(), goToNextDay(), goToToday(), selectDate()
  • Added mobile header controls in calendar.blade.php with:
    • Compact sticky navigation
    • Mode switcher (Month / Week / Day)
    • Swipe navigation support (month/week/day aware)
  • Split month rendering into dedicated template:
    • New resources/views/month.blade.php
  • Added new week view template:
    • New resources/views/week.blade.php
    • Mobile: horizontally scrollable day chips + selected day event list
    • Desktop/tablet: time-grid style week rendering
  • Added new day view template:
    • New resources/views/day-detail.blade.php
    • Mobile: all-day section + timeline/event list
    • Desktop/tablet: hour-slot timeline
  • Added hour-slot event helper in component:
    • getEventsForHour()
  • Updated tests for Phase 2 behavior:
    • View mode defaults/switching
    • Week/day navigation
  • Updated README method documentation for new week/day APIs

Design Spec Reference

  • mobile-design/MOBILE-DESIGN-SPEC.md (Phase 2: Week View + Day View mobile adaptations)

Issue Reference

Screenshots

Mobile (375px)

  • Before: before mobile
  • After: after mobile

Desktop (1280px)

  • Before: before desktop
  • After: after desktop

Validation

  • composer test
    • 19 tests passing

@ocarmora
Copy link
Copy Markdown

Somebody knows what is missing to merge this?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Feature Request: Mobile View improvement

2 participants