Skip to content

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

Merged
merged 18 commits into from
Apr 26, 2024
Merged

Hmt 5-landing hero section #11

merged 18 commits into from
Apr 26, 2024

Conversation

nataliey16
Copy link
Contributor

@nataliey16 nataliey16 commented Mar 6, 2024

Screenshot 2024-03-11 194913

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.

@nataliey16 nataliey16 closed this Mar 6, 2024
@nataliey16 nataliey16 reopened this Mar 6, 2024
@nataliey16 nataliey16 marked this pull request as draft March 6, 2024 17:27
@nataliey16 nataliey16 force-pushed the hmt-5/landing-hero-section branch from 0782918 to 410f8e7 Compare March 11, 2024 22:07
@nataliey16 nataliey16 marked this pull request as ready for review March 12, 2024 01:48
@nataliey16 nataliey16 changed the title Hmt 5/landing hero section Hmt 5-landing hero section Mar 12, 2024
@nataliey16 nataliey16 requested a review from ideen1 March 12, 2024 04:09
@ideen1 ideen1 requested a review from topanb11 March 21, 2024 01:10
Copy link

@topanb11 topanb11 left a 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

@nataliey16 nataliey16 force-pushed the hmt-5/landing-hero-section branch from 5a5e909 to fcefa23 Compare March 25, 2024 18:39
@nataliey16 nataliey16 requested a review from topanb11 March 25, 2024 18:42
</h1>
<div className={TIMER_CONTAINER}>
<div className="flex space-x-3">
<div className={TIMER_BACKGROUND}>
Copy link
Contributor

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}

Copy link
Contributor Author

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.

@nataliey16 nataliey16 force-pushed the hmt-5/landing-hero-section branch from fcefa23 to fab498f Compare April 7, 2024 19:04
@nataliey16 nataliey16 requested a review from ideen1 April 7, 2024 19:11
Copy link
Contributor

@ideen1 ideen1 left a 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.

@nataliey16 nataliey16 merged commit 742632e into main Apr 26, 2024
3 checks passed
@ideen1 ideen1 deleted the hmt-5/landing-hero-section branch June 15, 2024 06:19
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.

3 participants