Updating UI/UX of the website

[aryanprince]

Design Ideas

• Fix casing for the buttons on homepage since all of them now just use Title Case
• Add small logos of the language/framework to the left of the buttons

Before	After

Some minor changes

• 223 Add 2 columns on larger viewports so you don't have to scroll as much

• 223 Make the description sentence case

Before	After

@aryankashyap7 @Dhravya Thoughs?

[Dhravya]

Yeah. good ideas actually. We could do it

It would be hard to maintain the logos though. How would that work? https://devicon.dev/ has a lot of them, but for things like Competitive programming, where there's no particular icon, what do we do?

BTW, the longer viewports is already done (It's 3 column now, and decreases with device)

[aryanprince]

Yeah, I was hoping we could use https://devicon.dev/.

Not sure about the competitive programming ones, maybe we use the language logo + find a generic logo from https://icons8.com/ or something to indicate it's for 'competitive programming'.

@Dhravya And what about the casing of the buttons? I think rn you just take the names of the .md files and just make it title case yeah?

[Dhravya]

Ok let's do it then. The icon has to be specified somewhere... or fetched automatically, and if not present, show some random icon? So like..

https://cdn.jsdelivr.net/gh/devicons/devicon/icons/javascript/javascript-original.svg

https://cdn.jsdelivr.net/gh/devicons/devicon/icons/cpp/cpp.svg Over here... the name cpp is cplusplus... hmm... im not sure how that can be handled. Any idea?

[aryanprince]

@nexxeln Thoughts?

[aryanprince]

@Dhravya A few more bugs showing up now

• Weird spacing for buttons
• Tiny purple lines visible on some buttons

[Dhravya]

Yes that's something to fix

also maybe the text inside buttons should be justified to center

would you like to take this issue?

[aryanprince]

Yeah, I'll have a look