Logo getting cutoff on smaller screens on Citizen Engagement page

[JessicaLucindaCheng]

Overview

On the Citizen Engagement page's Organizations We Work With section, we need to fix the logo so it doesn't get cutoff in tablet and mobile views.

Details

• Screenshot of problem:

  Click here to see a gif of the logo being cutoff as it the view becomes smaller

  

• Here are screenshots of the Figma Design of the Organizations We Work With section of the Citizen Engagement page. For dimensions and other specifications, please inspect the Figma Design for the Citizen Engagement design in the red box titled Newest Version to see how it should look for desktop and mobile views.

  Click here to see screenshots of the Organizations We Work With section of the Citizen Engagement page in mobile and desktop views

  Desktop
  

  Mobile
  

Action Items

• On the Citizen Engagement page's Organizations We Work With section, fix the logo so it resizes as the screen width gets smaller and smaller. (See the Resources/Instructions' Files section for some files to get you started.)
• Make sure nothing on the website is broken in mobile, tablet, and desktop views

Merge Team, Technical Lead, or Product Manager

• Once the pull request associated with this issue is merged, go to issue Create each program area page automatically using a layout #3328 and check if all the issues listed under the Dependency section are closed. If they are all closed, move that issue (Create each program area page automatically using a layout #3328) into the New Issue Approval column, remove the Dependency label on it, and add a ready for dev lead label to it.

Resources/Instructions

• Citizen Engagement page: https://www.hackforla.org/citizen-engagement

Files to get you started

• pages/citizen-engagement.html
• _sass/components/_citizen_engagement.scss

Additional resources

• Liquid template language
• SCSS
• See the Figma Design Citizen Engagement design in the red box titled Newest Version

[github-actions]

Hi @mademarc, thank you for taking up this issue! Hfla appreciates you :)

Do let fellow developers know about your:-
i. Availability: (When are you available to work on the issue/answer questions other programmers might have about your issue?)
ii. ETA: (When do you expect this issue to be completed?)

You're awesome!

P.S. - You may not take up another issue until this issue gets merged (or closed). Thanks again :)

[mademarc]

Availability: 4/5/2023
ETA: 4/7/2023

[ExperimentsInHonesty]

@mademarc I am taking this issue back. We are short of issues and it hurts team velocity when people assign issues before they are ready to work on them.

Please self assign another issue from the backlog when you return next week.