[BUG] Improve the steps on the main page

karthiknadar1204 commented 1 year ago

Description

In the current design of the main page below the hero section, There are three steps that appear one after another in a line, I propose to improve the UI of this feature by doing the following: 1)So for step 1, I would put it in a container of colour that goes with the page, preferably orange, now instead of at the centre of the page, I will push step 1 i.e Collaborate to the left of the page inside the container, Now on the container, I will add border-radius to the top right and bottom right corner and place the contents of step 1 at the centre of the container horizontally and vertically.

2)I propose the same for steps 2 and 3 but will push them to the right and left side of the page with a changed border radius accordingly.

The animation of appearance will remain intact but the UI will look more interactive than now as it currently feels monotonous in a single line.

Please share your views for the same. Thank you

Screenshots

No response

🥦 Browser

Google Chrome

Checklist ✅

[X] I checked and didn't find similar issue
[X] I have read the Contributing Guidelines
[X] I am willing to work on this issue (blank for no)

github-actions[bot] commented 1 year ago

Hello @karthiknadar1204, thank you for raising the issue.

Currently, the issue is marked as https://github.com/MilanCommunity/Milan/labels/%F0%9F%91%B7%F0%9F%8F%BB%E2%80%8D%E2%99%82%EF%B8%8F%20status%3A%20awaiting%20triage which means that work for this issue is on hold and we are waiting for the maintainers/owner to review it and provide you with feedback/suggestions to proceed further.

Feel free to reach out to Tamal on Twitter, or drop a mail at tamalcodes@gmail.com if you think that this issue is of critical priority.

Give us a ⭐ to show some support Happy OpenSource 🚀

karthiknadar1204 commented 1 year ago

I would like to work on ths issue

tamalCodes commented 1 year ago

Hi there, @karthiknadar1204, well I am not looking forward to changing the design but I would recommend a few things.

The numbers there are not to indicate any steps they were added just for design purposes. However, this can prove wildly misunderstood and yeah that can be removed.
The second thing is we are looking forward to reducing the size of the landing text, which is Collaborate. Connect. Build. it is at 100+ pixels.

Also in the mobile version of the web app we have this immense line gap which I think can be reduced for a good look.

karthiknadar1204 commented 1 year ago

works, can take up the task

tamalCodes commented 1 year ago

[!IMPORTANT] The branch to make a PR/Fork would be beta

Assigning it to you. Please maintain structure, use conventional pull request titles, and avoid spam to avoid closure or bans.

📑 Checklist

Setup Guide to understand the setup and the .env(s) for development locally.
Contribution Guide to understand what type of PRs are accepted and how to make them.
Workflow Guide to understand what goes behind the scene, and why your PR doesn't get merged immediately.

Do drop a star, Happy Opensource 💚

tamalCodes commented 11 months ago

Notice 🚩

Hi there, unfortunately, I will have to close this Issue/PR, as this issue/PR has been inactive for quite a while and there's no work going on for the same.

There might be more Issues/PR that are waiting for this to be completed - so it is better to pace things up. I generally spend/wait for 3 weeks before marking any issue as stale and closing it.

If you think that this is a mistake, please drop a email at tamalcodes@gmail.com, and we will get back to you.

Regards, Team Milan.

ngoworldcommunity / NGOWorld