Projects: Improve outlook of each project section

[leohuynguyenchi]

In the Projects tab, each project sections are displayed.

Suggestions:

• Insert a color layer/shape behind each section to improve their look

[PipoAT]

I will take this and work on it

[leohuynguyenchi]

Sounds good! Let me know if you need some more clarity or brainstorming

[PipoAT]

Okay, sounds good! We may need to fix the html or existing css on this as well as for some reason not all the cards on the project page are consistent.

I added a div tag with the following so that it would produce what I got above

[leohuynguyenchi]

Wow I see...that's some good progress! Yeah we can dig deep into that. I needa watch some videos for SCSS and hugo stuffs

[PipoAT]

scss acts the same way as css

[PipoAT]

I see minor differences between the two

[PipoAT]

I looked into the inconsistencies in the card layout. It is a result of the length of the descriptions, thus each card's height is dynamically generated and different from one another

[PipoAT]

This is an improvement though. Thoughts?

[leohuynguyenchi]

Looks better to me! I don't have any ideas of how to improve it more but we can leave it to "In Review" so we can review it later. Good work man!

[leohuynguyenchi]

I just changed the layout of project cards to look like this:

[PipoAT]

That looks so much better. Should we center everything within each card?

[PipoAT]

Thoughts? I pushed the text alignment to dev

[leohuynguyenchi]

That looks great! It would be greater if there's a way to center the color border. I guess we can use alignment center for it

[PipoAT]

That would be ideal. How is the color border attached to the project card?

[leohuynguyenchi]

I'm not sure...Doing some investigation on Chrome dev tools now

[PipoAT]

From what I could tell, my suspicion is that it is attached to either the name of the project or is part of some div tag I cant find for some reason

[leohuynguyenchi]

Oh I got it, it's the width property of .border element in SCSS:

[leohuynguyenchi]

Just pushed my changes to dev

[PipoAT]

Ohhh perfect! Are we good to close this issue and move to done then?

[leohuynguyenchi]

Yes, we're done with this one!