-
Notifications
You must be signed in to change notification settings - Fork 1
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.
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
Setup animated countdown on schedule page #93
Conversation
Deploy preview for zothacks-site-2023 ready!
|
Deploy preview for zothacks-site-2023-sanity ready!
|
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Looks great! I think we just need the borders and boxes around each of the digits and the timer. Maybe in another PR, up to you. Sidenote, do we want the 0's to show initially?
This is occurring also on the component in hover.dev, so I sent an email to the dev team to ask them to fix it. If they don't respond we can just fix it ourselves. |
I sort of fixed it? I changed the animation exit Edit: it doesn't work. Still debugging... Maybe this is a problem with |
@alexanderl19 do you have an idea as to why this is happening? |
The developer responded and said he is working on it. |
Did he provide an ETA? |
no 😢 . I'll check in with him again and ask for an ETA. |
Update: he said by end of this weekend. If he isn't done, by today, we'll prob have to do it. Might be something with |
For now, we can just disable the slide up animation. We should focus on finishing the resources and clipboard content first. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Looking alright so far, some notes on heading semantics, initial countdown value, and date formatting.
apps/site/src/views/Schedule/components/Countdown/Countdown.tsx
Outdated
Show resolved
Hide resolved
apps/site/src/views/Schedule/components/CountdownItem/CountdownItem.tsx
Outdated
Show resolved
Hide resolved
apps/site/src/views/Schedule/components/Countdown/Countdown.tsx
Outdated
Show resolved
Hide resolved
apps/site/src/views/Schedule/components/Countdown/Countdown.tsx
Outdated
Show resolved
Hide resolved
apps/site/src/views/Schedule/components/Countdown/Countdown.tsx
Outdated
Show resolved
Hide resolved
apps/site/src/views/Schedule/components/Countdown/Countdown.tsx
Outdated
Show resolved
Hide resolved
apps/site/src/views/Schedule/components/Countdown/Countdown.tsx
Outdated
Show resolved
Hide resolved
apps/site/src/views/Schedule/components/Countdown/Countdown.tsx
Outdated
Show resolved
Hide resolved
Just add the description and I'll approve/merge it. We need this page up ASAP. People are already asking for the schedule. Probably because they want to plan in advance. @alexanderl19 says he will do the sanity queries for the schedule by EOD, once this is merged. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
On initial render, 3 numbers flash and then 4 because it is initially 0 time difference between the Zothacks dates. I personally think this is a blocker still.
nvm there is a hydration error. |
maybe we should pull the deadline time from sanity? so we can switch between when hacking begins and ends for the countdown. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
One small change and we should be good to go.
be315a9
to
7586998
Compare
7586998
to
8498b29
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
lgtm
* update: created getSchedule file * update: synced sanity data with schedule component * feat: update event schema * feat: group events by day * feat: format date ranges * fix: group events by America/Los_Angeles day * fix: event order asc * fix: remove resources from nav --------- Co-authored-by: Tyler Yu <[email protected]> Fix frontend issues on resources page (#103) * fix: backend description text overflow * feat: new ResourceCard component removed unused assets * fix: key prop error * fix: remove unused components * fix: references to unused images * refactor: short-circuit and color fixes * Fix transformed filter glitches for webkit - Include `translateZ(0)` when applying transform to drop shadow filter --------- Co-authored-by: Taesung Hwang <[email protected]> fix: title and location mobile alignment (#109) feat: frontend resources section feat: starter packs section removed placeholder config files feat: add day of week to schedule (#110) * feat: add day of week to schedule * fix: replace weekday list with date format * fix: long month and date format update: restore resources link in navbar fix: timezone inconsistencies (#119) * fix: timezone inconsistencies * fix: timezone inconsistencies fix: backend resources grid issue feature: clipboard paper animation (#116) undefined Feature/clipboard animation update (#123) * feature: clipboard paper animation * fix: padding adjustment on date * fix: border radius and page animation update feat: incident response form fix: remove open in new window icon Setup animated countdown on schedule page (#93) * setup: basic framer countdown * fix: removed useRef, changed animation exit value * update: temporarily disabled slide up animation * fix: conditional day render * fix: precompute time * fix: margin for the countdown * update: added loading bar * fix: rename to Loader * feat: time until hacking countdown timer * fix: clipboard styling --------- Co-authored-by: Tyler Yu <[email protected]> Co-authored-by: Alexander Liu <[email protected]> fix: match time zones on server and client fix: missing date-fns-tz import (#126) fix: disable page scroll x (#125) refactor: move homepage from views folder to app folder refactor: convert components to arrow functions and reexport feat: devpost fix: changed import path fix: added ease and moved component
* feat: svg animation rough draft * update: increase stroke width * update: new svg * update: added timing to opacity * update: switched to animate to create stagger * fix: adjusted timings * fix: timing * fix: more timing adjustments * fix: type issues with initial variant * fix: responsive svg * fix: removed old title svg * fix: added useEffect dep * fix: remove unused imports * fix: adjusted clamp * update: refactored animated title fix: visually hidden title update: refactored animated title Use lined paper vector and remove unnecessary nav (#62) * fix: use lined paper vector and remove unnecessary nav * fix: stick nav bar to top of screen * fix: remove sticky navbar for mobile --------- Co-authored-by: Sam Der <[email protected]> fix: change resources PNGs to SVGs hotfix: heart and star sticker positioning Add ZotHacks Open Graph Properties (#71) * feat: add OG image * fix: use opengraph-image for OG generation Create Sanity resources schema (#91) * feat: resource schema * feat: icon, preview, and color field description update: TikTok logo and improved alt text (#83) * update: TikTok logo and improved alt text * fix: switch to svg version fix: use container spacing for resource page (#79) * fix: use container spacing for resource page * temp: fix row/col setup * remove col div update: remove apply links and mentor section (#89) * update: remove apply links and mentor section * fix: restore apply button, adjust wording * fix: disabled mentor apply button * update: zothacks 2023 * fix: removed extra import * fix: added variant type * fix: changed import path * fix: added ease and moved component * Feature: SVG ZotHacks Title animation * update: created getSchedule file * update: synced sanity data with schedule component * feat: update event schema * feat: group events by day * feat: format date ranges * fix: group events by America/Los_Angeles day * fix: event order asc * fix: remove resources from nav --------- Co-authored-by: Tyler Yu <[email protected]> Fix frontend issues on resources page (#103) * fix: backend description text overflow * feat: new ResourceCard component removed unused assets * fix: key prop error * fix: remove unused components * fix: references to unused images * refactor: short-circuit and color fixes * Fix transformed filter glitches for webkit - Include `translateZ(0)` when applying transform to drop shadow filter --------- Co-authored-by: Taesung Hwang <[email protected]> fix: title and location mobile alignment (#109) feat: frontend resources section feat: starter packs section removed placeholder config files feat: add day of week to schedule (#110) * feat: add day of week to schedule * fix: replace weekday list with date format * fix: long month and date format update: restore resources link in navbar fix: timezone inconsistencies (#119) * fix: timezone inconsistencies * fix: timezone inconsistencies fix: backend resources grid issue feature: clipboard paper animation (#116) undefined Feature/clipboard animation update (#123) * feature: clipboard paper animation * fix: padding adjustment on date * fix: border radius and page animation update feat: incident response form fix: remove open in new window icon Setup animated countdown on schedule page (#93) * setup: basic framer countdown * fix: removed useRef, changed animation exit value * update: temporarily disabled slide up animation * fix: conditional day render * fix: precompute time * fix: margin for the countdown * update: added loading bar * fix: rename to Loader * feat: time until hacking countdown timer * fix: clipboard styling --------- Co-authored-by: Tyler Yu <[email protected]> Co-authored-by: Alexander Liu <[email protected]> fix: match time zones on server and client fix: missing date-fns-tz import (#126) fix: disable page scroll x (#125) refactor: move homepage from views folder to app folder refactor: convert components to arrow functions and reexport feat: devpost fix: changed import path fix: added ease and moved component * fix: unused asset --------- Co-authored-by: Alexander Liu <[email protected]>
This PR sets up an animated countdown with Framer. The time it counts down to has been hardcoded to the start of the hackathon.