-
Notifications
You must be signed in to change notification settings - Fork 0
Hmt 5-landing hero section #11
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
Conversation
0782918
to
410f8e7
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.
thanks Natalie! Looks really good on desktop and mobile! Just left two comments
5a5e909
to
fcefa23
Compare
</h1> | ||
<div className={TIMER_CONTAINER}> | ||
<div className="flex space-x-3"> | ||
<div className={TIMER_BACKGROUND}> |
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.
Thanks for refactoring that! I think what Topan meant is to make each of these 4 blocks one component. That way you just call the component in a loop and pass a different object into each one. I.e. {name:minutes, value:34}, {name:hours, value :1}
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.
Thanks for the clarification, Ideen! I believe I fixed it to what you and Topan suggested. Although, let me know if it needs further adjustments.
… validationfor each time block
fcefa23
to
fab498f
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.
Looks awesome! This can go in right away.
Created a responsive hero section for the landing page. It contains a countdown timer for the date of the Hackathon (temporary date - Nov 10, 2024) that appears on desktop and disappears on mobile. When that date approaches, "Hack the Change XXXX has begun!" will appear. Right now, the timer re-loads after refreshing the page. There is likely a more efficient way to build this and have it pre-render by possibly using getStaticProps and Contentful (or if there is even a better way, let me know!).
I also have been struggling to find a better way to add a purple text-border around "Hack the Change 2024." The CTC website uses tailwind css (text-stroke-outside) but this doesn't seem to work here.