toggle see more/see less on wins card

[qiqicodes]

fix #1549

1. toggles see more/see less on the bottom right of the wins card
   2 see more has ellipsis, sticking with same Figma design

toggle.see.more.see.less.mov

[akibrhast]

Bugs

• There seems to some problems with the See more , See Less button in regards to styling. Please look at the below image for reference.

Styling Error

• Also when I am in mobile view and click on See More -> which causes the button to toggle to See Less -> and then i transition to desktop view. The text stays at See Less and does not go back to default.

Image Of See Less button not toggling back to See More on mobile to desktop transition

• There seems to be a bug in the See Less button where its not clicking at these dimension for some reason

See Less Button Not Clickable

Side Notes

[ @daniellex0 - Could you please give your thoughts on these? ]

• The position of the see more/ see less button seems haphazardly placed. Imho, this looks aesthetically unpleasant.
• The inconsistency of some cards having a linkedin icon only, some having a github icon only also seems very messy aesthetically speaking.

[qiqicodes]

I will work on the styling some more. Thanks for reviewing @akibrhast

[qiqicodes]

@akibrhast The styling error is fixed, and the see more/see less is clickable.

In regards to "See Less button not toggling back to See More on mobile to desktop transition", this is a logic we have to add in. We can file an issue regarding this feature.

Currently the mobile has the option to see more and see less, and desktop only has see more, should we have consistent design and add see less on the modal? And disable the close via click on grayed out background? @daniellex0

[daniellex0]

@akibrhast

The position of the see more/ see less button seems haphazardly placed. Imho, this looks aesthetically unpleasant.

Could you be more specific please?

The inconsistency of some cards having a linkedin icon only, some having a github icon only also seems very messy aesthetically speaking.

This was part of the original design by a previous designer that was approved by Bonnie. But future iterations might be able to include a different layout.

One of our designers did notice that these icons are sharp black ( # 000 ) when they are supposed to be dark gray like the text (# 333), so that would be a good issue for someone to figure out how to fix and I think might make the logos pop out less. @akibrhast could you please make a dev issue for this?

[akibrhast]

My apologies for not being specific @daniellex0

Images featuring the haphazard placing of see more/see less button

1. 
2. 

---

@qiqicodes There seems to be still some styling error with the see less button on mobile. Please look at image 2 above, at the "Sean Flores" and "Josh Robins" cards

---

Some food for thought:
We need to ensure that the user submitting their win story is required to submit their github information. On top of that, we also need to ensure that we use their github profile picture by default. Every project contributor in HFLA in every is already being displayed with their github image and github link on ALL of your projects pages(All-time contributor sections) . https://www.hackforla.org/projects/website . At the start of joining hackforla we also require an individual to make their HFLA membership public.

I am going to move this PR to the dev discussion board to have the chance to bring it during tomorrow's developer meeting to get everyone's feedback and opinions on this matter.

[akibrhast]

Discussed on Tuesday developer meeting, @jbubar will reach out to @qiqicodes to discuss and resolve. Moving this to draft until a resolution is reached and changes implemented from their discussion.

[akibrhast]

@jbubar to close this draft pull request when he makes a new pull request