[MarginFrontend] Fix & Improve Pool page

[djeck1432]

🚨 Attention: Please read the guidelines before applying; otherwise, you will be ignored. 🚫📋

Guidelines

1. Telegram: Please join our Telegram group to keep in touch.
2. Read the guideline: Please read this guideline thoroughly before starting.

Tasks

0. Make sure you are working with margin_frontend project.

1. Fix Pool Page

• Make sure that styles 100% correspond to figma, exact colors, sizes, paddings, etc., etc. (Both Mobile & Desktop versions) - Figma
• Tabs & Search does not look like in Figma at all
• Tabs component is not used, but should be
• Visually identical parts should be a separate components inside ui/core folder (e.g. pool column for table/card)
• Clean up redundant/repeating functionality in the components.
• In general follow React best practices for extracting repetative functionality to separate components.

2. After your work please attach 2 screenshots with desktop and mobile version with your changes.

[kingjosmel]

I like pineapple Hi, I’m Melvin, a front-end developer with expertise in Next.js and Tailwind CSS.

I specialize in building scalable and maintainable web applications with a strong focus on performance and user experience.

I have experience working with component-based architecture, state management, and API integrations.

I write clean, modular code and follow best practices to ensure maintainability and efficiency.

I’m always eager to contribute solutions that improve code quality and enhance functionality.

[djeck1432]

Dear @kingjosmel, I would ask you to read guideline before applying, thank you

[kingjosmel]

Ok I like pineapple I’m a frontend developer skilled in Next.js, TypeScript, and Tailwind CSS. I’d like to take on this issue.

I’ll work on fixing the Pool Page by:
• Ensuring styles match Figma 100% (colors, sizes, paddings, etc.) for both mobile and desktop.
• Updating Tabs & Search to match the Figma design exactly.
• Using the correct Tabs component.
• Extracting visually identical parts into separate components inside ui/core.
• Cleaning up redundant/repetitive functionality while following React best practices.

I’ll provide two screenshots (desktop & mobile) after completing the task.

Telegram: @melvin_joseph_03

[Agbeleshe]

About Me:
I am a full-stack developer with over three years of experience, specializing in building scalable and responsive applications with React, Next.js, and Tailwind CSS.

Plan to Address the Issue:
I will carefully analyze the Figma design and ensure the Pool Page matches it 100% in terms of styles, including colors, sizes, and paddings for both desktop and mobile. I will refactor repetitive code by extracting reusable components into the ui/core folder, particularly the pool column for the table/card. I will also ensure the correct usage of the Tabs component, improve the search functionality, and clean up redundant code following React best practices. Once completed, I will attach screenshots of both the desktop and mobile versions for review.

ETA: 5 hours.
TG: Bioba_dan
I like pineapple

[giafratte]

will like to work on this?

• i will make sure the page aligns properly with figma and follow react's best practice to make the necessary components reusable

TG: whyweallhere

I like pineapple. ETA: 10hours

[Luluameh]

I am a React frontend developer with over three years of experience in Next.js, Tailwind CSS, and UI optimization. I have worked on multiple projects where I ensured pixel-perfect implementations from Figma designs, improved UI performance, and maintained clean, reusable component structures.

For this task, I will:
Fix the Pool Page styles to ensure 100% accuracy with Figma, including exact colors, sizes, and paddings.
Ensure full responsiveness for both mobile and desktop views.
Refactor redundant and repetitive code, extracting reusable components into the ui/core folder.
Implement the correct Tabs component and adjust the search functionality to match the Figma design.
Follow React best practices for structuring the components efficiently.
Provide screenshots of both desktop and mobile versions after implementing the fixes.

Also, I like pineapple 🍍!

ETA: 10 hours
TG: @lulugreg

[gregemax]

i like pineapple

Hi, I'd love to work on this task. I have experience in React, UI cleanup, and ensuring pixel-perfect Figma implementation. I'll refactor repetitive code into reusable components while maintaining best practices.

Approach:
Analyze Figma, identify issues, and set up components.
Implement fixes for styles, tabs, and search.
Final refinements, testing (mobile & desktop), and submit screenshots.

done and make pr within ETA :9hrs

[KedwithGod]

I like pineapple,
Can i be assigned to this task

[Uyoxy]

Would love to tackle this! I love pineapple...I am a frontend developer experience in tailwind css,next.
Would love to contribute to the responsiveness and adjustment of pool page..my ETA is 6hours

[KAMALDEEN333]

i like pinapple, i will love to take up on this and i have read your guideLines, ETA 5hours.....

[BlessingEmejulu]

Can I attempt this issue?

[djeck1432]

@Uyoxy any updates?
if your PR will be merged tomorrow, you will get reward in a month. just let you know.

[Oshioke-Salaki]

If there is no activity, I would love to take this up. ETA of 2hours @djeck1432
I love orange
I am a very vast frontend developer and I would ensure a pixel perfect implementation