How to Play Modal in Landing Page Navbar

[BigBen-7]

Description

The "How to Play" link in the landing page navbar should trigger a modal when clicked. The modal already exists in the components folder, so we need to reuse the existing component to ensure consistency.

Tasks

1. Add an onClick event to the "How to Play" link in the landing page navbar.
2. Reuse the existing "How to Play" modal component instead of creating a new one.
3. Ensure the modal opens and closes properly when clicking the link.
4. Maintain styling consistency with the rest of the design.

Acceptance Criteria

✅ Clicking "How to Play" in the landing page navbar opens the modal.
✅ The existing How to Play component is reused.
✅ Modal functions correctly (opens and closes as expected).
✅ UI matches the new landing page design.

Figma

[Og-Miles]

i am a new contributor with frontend developement skillset using Next js, and React js. I will love to jump on this project to sure the "How to Play" in the landing page opens modal using the exisiting component. i will also ensure that it matches the new landing page UI and modal funcitons correctly

ETA 24hrs
Telegram: @miles_skdy

[Emmy123222]

Can I contribute to this one?

[SudiptaPaul-31]

I would love to take this isssue

My name is Sudipta Paul a fullstack and blockchain developer with experience of more than two years and have worked on many opensource projects too and would love to work on this also

[Khemmie-Ray]

Can I handle this task?

[jahrulezfrancis]

I'd love to work on the How to Play modal implementation. I have experience with React modal integrations and component reusability. I can ensure the navbar trigger connects properly with the existing modal while maintaining design consistency.
I can complete the design withing 8 hours.

[JayWebtech]

Hello, I am a frontend/mobile app developer with six years of experience. I have built pixel-perfect, user-experience-focused websites and apps.

This is an issue I can confidently handle. You can check out some of my work to verify:

https://jaykosai.vercel.app
https://richometer.vercel.app/
https://ecohotels.com
https://veil-assets.vercel.app/
https://eduleague.vercel.app/
https://nijostam.org
https://cleanxpress.vercel.app/
https://shopwithsteeze.vercel.app/

[Godsmiracle001]

Hi Team,

I’d love to work on this task. I’ve read through the description and the guidelines carefully. Here’s my quick plan:

I’ll add an onClick event to the "How to Play" link in the navbar.
I’ll reuse the existing modal component from the components folder (no new modals).
I’ll make sure it opens and closes properly, and the styling stays consistent with the landing page design.
ETA: 1 day – I’m confident I can get this done within 24 hours, including testing.
Verification Phrase: Hunters and Scavengers
Telegram Handle: @Godsmiracle001

Looking forward to hearing from you!
Best,
Godsmiracle Ibitayo

[iGEORGE17]

Hi,

I’m interested in working on the "How to Play" modal task. I’ve reviewed the requirements and am confident I can implement the changes effectively.

ETA:
I expect to complete this within 2-3 days. This gives me time to ensure proper functionality and UI consistency.

Plan:
Add an onClick event to the "How to Play" link.
Reuse the existing modal component.
Ensure the modal opens and closes correctly.
Match the design with the landing page.
I’m part of the official Telegram group and will submit a draft PR within 12 hours of being assigned.

Looking forward to contributing!
hunters and scavengers

[Franklivania]

Hi, I am Chibuzo Franklin, a Frontend developer well versed in Nextjs and typescript, and I am interested in this project.

How I will implement;

• Use my reusable modal, to build out the how to play section.
• integrate the functionality for the button to handle the click event.
• ensure the UI is responsive and matches the sigma design.

ETA: 4hrs

[Baskarayelu]

Hey! I’m enthusiastic about tackling this issue and delivering a solid solution.

💼 What I Bring

• Full-Stack Proficiency – Expertise in smart contract, Python, Django, and Flask for building robust backend solutions, paired with Angular and Vue.js for dynamic, responsive frontends.
• DevOps Expertise – Strong background in Docker, Kubernetes, and CI/CD pipelines, ensuring smooth deployment and scalable infrastructure.
• Quality-Driven Development – Committed to writing clean, testable code and leveraging TDD (Test-Driven Development) to deliver reliable software solutions.

⏱️ ETA

I can complete this in 24 hours, with thorough testing and validation.

[Agbeleshe]

Mind if I take this issue?
I'm Dan_Bioba, and I'd like to contribute to this project. I’m a frontend developer proficient in typescript, react.js, and next.js, respectively, and making clean codes.
I'm a first-time contributor on this project
ETA :4hrs.

[jancris100]

Hey! I'm Jan.
Member of Dojo Coding. I have contributed before to other projects like:

• Dojo
• Go Stark Me
• Fuego
Can I work on this issue?
Plan to Solve the Issue:
Study the codebase to understand the current structure and functionality.
Understand the problem that needs to be solved by thoroughly reading the issue details.
Leverage all provided resources within the issue to get a better grasp of the task at hand.
If I encounter roadblocks, I will ask questions ASAP in the Telegram group to move forward effectively.
I will open a PR and wait for ur feedback

Study the codebase to understand the current structure and functionality.
Understand the problem that needs to be solved by thoroughly reading the issue details.
Leverage all provided resources within the issue to get a better grasp of the task at hand.
If I encounter roadblocks, I will ask questions ASAP in the Telegram group to move forward effectively.
I will open a PR and wait for ur feedback
Im new contributor

[FrankiePower]

Hello Team,

It's SuperFranky here, i am a diamond and returning contributor. As always I am excited to be participating in the open source week. I am a frontend and blockchain developer with over 3+ years of experience and have contributed to a variety of interesting projects in the Web3 space. My expertise is in React, Next.js, Solidity,Rust and Cairo. Thank you for considering my application.

ETA: 24 hours

[Ogechi-star]

I will love to tackle this issue.

[jobbykings]

Could I be assigned to this?

[Favvie]

Hi Team,

I’m Favour, a diamond contributor excited to participate in ODBuild! As a frontend and blockchain developer with 2+ years of experience, I specialize in React, Next.js, Solidity, and Cairo. I’ve contributed to several Web3 projects and look forward to contributing to this one.

Thank you for the opportunity!

[MaryammAli]

hi, am a new contributor , i have gone through the design and understand what is needed to be done, kindly assign this issue.

[laryhills]

Application for How to Play Modal Implementation

Dear @BigBen-7 sir,

I hope you're doing well. I’d love to take up this issue. With experience converting Figma files to code following the design accurately.

I will ensure:
✅ Connect the button to open the modal
✅ Reuse the existing component
✅ Ensure the modal open and close functionality works well
✅ Maintain coding style

ETA: 1-2 day

Hilary

[Supa-mega]

Let me handle this issue! first time contributor

[Dario0731]

Hi, my name is Dario Zamora. I´m a software developer part of Dojo coding. With a lot of frontend experience in different languages.

I am very interested in contributing to this project and would like to kindly request access to this item. I believe my skills can add value to the team, and I’m eager to start collaborating.

[thetribalgod]

let me give it a shot

[Hydrax117]

I'm Kaka, a frontend developer highly proficient in React and TypeScript, with expertise in React, React Native, and Next.js. Can i work on this?
E.T.A <= 18hours

[ajumobiisaac96]

Hi, My name is Oluwadamisi Ajumobi
I am a Frontend developer skilled in Next.js and React.js.
I will be creating this modal in accordance with the figma design within my ETA.

ETA = 6hours.

[kingjosmel]

I'm a frontend developer skilled in Next.js, TypeScript, and Framer Motion. I'd like to take on this issue.

I'll add an onClick event to the "How to Play" link in the navbar and ensure it correctly triggers the existing modal component. The modal will be properly integrated to open and close as expected, maintaining the current design and functionality.

ETA: 8 hours.

[ussyalfaks]

Can I handle this task? ETA: 6 hours

[Jeffrey0522]

I am a Software Engineer graduated from the University of Costa Rica, with solid experience in software development and web development. I specialize in creating innovative, scalable, and efficient solutions, combining my knowledge of software architecture, performance optimization, and agile methodologies. I would love to continue developing my skills in your project. I eagerly look forward to the opportunity to be part of it.

[gaderay]

Hi,

I’d love to contribute to this project by working on the how to play modal. I look forward making it an interactive feature and can approach it by making use of the appropriate resources and elements needed.

Thanks!

[Franker24]

My Background
I have three years of experience working on web projects, specializing in Angular, React, TypeScript, and UX/UI design.

Approach to the Issue
i want to try to resolve this issue

[KedwithGod]

I am a React Developer with expertise in TypeScript, JavaScript, CSS, and Tailwind CSS, building modern and responsive UIs. I specialize in frontend performance optimization, state management (Redux, Zustand), and API integration. Passionate about clean code and great user experiences, I continuously explore new technologies to improve web development. Kindly assign me to this task

[Luluameh]

I'd love to work on integrating the "How to Play" modal into the landing page navbar. With 3+ years of experience in React, Next.js, and Tailwind CSS, I can ensure the implementation is seamless, reusable, and consistent with the design.

My Plan:
Add an onClick event to trigger the modal.
Reuse the existing "How to Play" modal component for consistency.
Ensure smooth open/close functionality.
Maintain styling consistency with the landing page UI.
Test responsiveness across different devices.

ETA:24hrs

[benedictfred]

Gm
Let me work on this please. I am frontend developer proficient in React and Next js

[Brielle28]

Is it okay if I tackle this?

[Brielle28]

I'd like to take this issue.
ETA 18hours
telegram @Brielle28

[Elite-tch]

Could I try solving this?
ETA 12hrs
telegram elite-tch

[Jagadeeshftw]

Hi, I’d love to take on this issue! With my expertise in Cairo, StarkNet, and smart contract development, I can implement a clean and efficient solution.

🚀 Why Me?

• Proven Blockchain Experience – Hands-on work with StarkNet, Solidity, and Rust, building secure and optimized smart contracts.
• Open Source Contributor – Actively contributed to 30+ open-source projects, showcasing adaptability and collaboration.
• Efficient & Reliable – I deliver high-quality, production-ready solutions quickly, ensuring security and scalability.

⏱ Timeline

I estimate completing this within 1 day. Let me know if I can proceed!

🌐 My Profile

Check out my OnlyDust profile for more insights: Jagadeeshftw on OnlyDust

Looking forward to contributing. 🚀

[Yunusabdul38]

I'd like to handle this task.

[Pvsaint]

I'd like to take this issue.

[nikkybel]

Mind if I take this issue?

[enyinnaya1234]

I’d like to resolve this.

[mayasimi]

Mind if I take this issue?

[pragmaticAweds]

Could I be assigned to this?

[nnennaokoye]

i am a first time contributor, and i'm excited to contribute to OnlyDust open source.