Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

feat: animated countdown and schedule page #62

Merged
merged 10 commits into from
Dec 13, 2023
Merged

feat: animated countdown and schedule page #62

merged 10 commits into from
Dec 13, 2023

Conversation

tyleryy
Copy link
Contributor

@tyleryy tyleryy commented Dec 6, 2023 •
edited
Loading

Overview

Created a schedule page route and added animated countdown component. For Issue #47.

Details

  • used component libray hover.dev (see references)
  • imported framer motion as dependency
  • countdown component flashes 0's on page load due to initial state. Placed Loader component over until countdown state is changed to not 0's
  • created placeholder div for where the schedule component will go

Future Changes

  • need to change date to IrvineHacks date
  • may need hide route with Maintenance Mode env var
  • Idea: use env var for the IrvineHacks date to precompute the Countdown Timer date (to fix hydration error from ZotHacks Site)

References

countdown
loader
framer motion docs

@github-actions GitHub Actions
Copy link
Contributor

github-actions bot commented Dec 6, 2023 •
edited
Loading

Deploy preview for irvinehacks-site-2024-sanity ready!

Name Sanity Studio
Preview Visit Preview
Commit e0bc5c8

@tyleryy tyleryy requested review from waalbert and a team and removed request for waalbert December 6, 2023 14:33
@github-actions GitHub Actions
Copy link
Contributor

github-actions bot commented Dec 6, 2023 •
edited
Loading

Deploy preview for irvinehacks-site-2024 ready!

Name IrvineHacks 2024 Site
Preview Visit Preview
Commit e0bc5c8

@tyleryy tyleryy linked an issue Dec 6, 2023 that may be closed by this pull request
Add countdown timer to schedule page #47
Closed
samderanova
samderanova reviewed Dec 6, 2023
View reviewed changes
Copy link
Contributor

@samderanova samderanova left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Countdown looks great! Couple questions:

apps/site/src/app/schedule/components/ShiftingCountdown/ShiftingCountdown.tsx Outdated Show resolved Hide resolved
apps/site/src/app/schedule/page.tsx Outdated Show resolved Hide resolved
pnpm-lock.yaml Show resolved Hide resolved
@tyleryy
Copy link
Contributor Author

tyleryy commented Dec 7, 2023 •
edited
Loading

Added Fireworks to fit with Lunar New Year Theme and implemented switching between Hacking Starts and Ends time logic:

Fireworks trigger when both timers end, so u need to reload after the “Hacking Starts” timer ends.
See Graphic-Tech-BFFs Slack channel for video.

references:

@alexanderl19 alexanderl19 self-requested a review December 13, 2023 22:06
@tyleryy tyleryy merged commit 9f953c3 into main Dec 13, 2023
2 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers

@taesungh taesungh taesungh left review comments

@alexanderl19 alexanderl19 alexanderl19 approved these changes

@samderanova samderanova samderanova approved these changes

Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

Add countdown timer to schedule page
4 participants
@tyleryy @samderanova @alexanderl19 @taesungh