Remove Projects from "Our Locations" section of Events page

[kristine-eudey]

Overview

We need to remove the Projects from the "Our Locations" section of Events page in order to more accurately reflect the now fully-remote nature of the organization. We need to keep the 3 photo tiles for Westside, Downtown, and South LA in order to show HfLA's base and connection to the Los Angeles area.

Action Items

• Duplicate the Events Page in Figma (both desktop and mobile)

• Remove the right hand section of the 3 location cards (The section that shows day of week and Projects)
  

• Redesign this section of the page to just feature the 3 images (Westside, Downtown, and South LA) and put them all the on the same row.

  • Refer to the design system, and other designs on the site utilizing photo grids, like the homepage for example.

Resources/Instructions

HfLA - Events
Figma - Events
HfLA Design System

[github-actions]

Hi @kristine-eudey.

Good job adding the required labels for this issue. The @hackforla/website-merge team will review the issue and add a "Ready for Milestone" label once it is ready for prioritization.

Additional Resources:

• Wiki: How to read and interpret labels

[jenjen26]

Progress: Assigned to self 11/30
Blockers: none currently
Availability: ~10hrs this week
ETA: 12/10

[github-actions]

@jenjen26

Please add update using the below template (even if you have a pull request). Afterwards, remove the 'To Update !' label and add the 'Status: Updated' label.

1. Progress: "What is the current status of your project? What have you completed and what is left to do?"
2. Blockers: "Difficulties or errors encountered."
3. Availability: "How much time will you have this week to work on this issue?"
4. ETA: "When do you expect this issue to be completed?"
5. Pictures: "Add any pictures of the visual changes made to the site so far."

If you need help, be sure to either: 1) place your issue in the developer meeting discussion column and ask for help at your next meeting, 2) put a "Status: Help Wanted" label on your issue and pull request, or 3) put up a request for assistance on the #hfla-site channel.

_{You are receiving this comment because your last comment was before Monday, December 6, 2021 at 11:19 PM PST.}

[jenjen26]

Redesigned to show 3 location image cards and removed all day of the week and project information. Ready for review.

Redesign of events page for desktop and mobile

[IsaacDesigns]

@jenjen26 This looks good to me!

[ExperimentsInHonesty]

@jenjen26 Please make the desktop version the same square as the mobile.

[jenjen26]

@ExperimentsInHonesty @IsaacDesigns Changing the desktop version to square appears to go against the design system currently. I am more than willing to make the change - just wanted to confirm prior to completing.

[IsaacDesigns]

@jenjen26 Thanks for addressing this and going off of the design system. We can review this in Thursday's meeting.

[github-actions]

@jenjen26

Please add update using the below template (even if you have a pull request). Afterwards, remove the 'To Update !' label and add the 'Status: Updated' label.

1. Progress: "What is the current status of your project? What have you completed and what is left to do?"
2. Blockers: "Difficulties or errors encountered."
3. Availability: "How much time will you have this week to work on this issue?"
4. ETA: "When do you expect this issue to be completed?"
5. Pictures: "Add any pictures of the visual changes made to the site so far."

If you need help, be sure to either: 1) place your issue in the developer meeting discussion column and ask for help at your next meeting, 2) put a "Status: Help Wanted" label on your issue and pull request, or 3) put up a request for assistance on the #hfla-site channel.

_{You are receiving this comment because your last comment was before Monday, January 10, 2022 at 11:19 PM PST.}

[IsaacDesigns]

@jen please add in a comment where in the design system it says to make the Desktop cards rectangle rather than square.

[jenjen26]

@IsaacDesigns
The new locations page follows the 'large card' format in the design system for the image, which was what the old locations page was using.

Since we've removed the text section to the right of the image on the card, we may want to add a square image design to the design system if that is the preference.

[IsaacDesigns]

@jenjen26 yes we have agreed that we will go with your square image design and we will have to add this new square image to the design system.

[jenjen26]

Progress: I added this to the Large Cards in the design system.
Blockers: how to complete CSS and naming convention portion in design system
ETA 01/31

[ExperimentsInHonesty]

@jenjen26
FYI: When you put things in the review column, please be as specific as possible about who needs to review and why. This will ensure that you get the fastest response possible E.g. on this issue you could have written:

Next Steps:

• For Design Team or Design Lead to review and sign off or provide comments
• When design team or lead is done, Product team needs to review and provide sign off or comments.

[ExperimentsInHonesty]

@jenjen26 Thanks for the new work. Looks perfect, we will turn it over to Development now to make a new issue where they define the classes that are currently in use by adding them to the design system (because it seems like they are missing now).

[JessicaLucindaCheng]

Dev follow up issue for this is #3027