SDG 13: Rename and replace image with correct color one

[JessicaLucindaCheng]

Dependency

• Move and rename sdg-elements directory and refactor associated code #4183

Overview

We need to replace the Sustainable Development Goals (SDG) images in our repository so that the SDG svgs are the correct color and follow the United Nations' SDG guidelines.

Details

SDG is an acronym for the United Nations Development Programme Sustainable Development Goals.

Action Items

• In the assets/images/sdg directory, delete climate-action.svg
• From the HackforLA.org website drive's HackforLA.org website/SDG/SDG images folder, download the following svg: E-WEB-Goal-13.svg
• Add the svg you just downloaded into the assets/images/sdg directory
• Rename that svg so that it becomes sdg13.svg
• In _includes/about-page/about-card-sustainability.html, update the path to the image you just added by changing

<img src="/assets/images/sdg/climate-action.svg" alt="13 Climate Action" />

to

<img src="/assets/images/sdg/sdg13.svg" alt="13 Climate Action" />

• Using Docker, check the About page's Sustainability section (https://www.hackforla.org/about/#sustainability) to check that the SDG image shows up on the same spot as on the live webpage
  • Note: The size of the image may look different compared to the website. This will be addressed in issue Epic: Fix size of SDG icons to match Figma design #4229.

Merge Team, Technical Lead, or Product Manager

• Once the pull request associated with this issue is merged, go to each of the following issues and check if all the issues listed under the Dependency section are closed. If the dependencies are all closed, move those issues into the New Issue Approval column, remove the Dependency label on it, and add a ready for dev lead label to it.
  • Epic: Fix size of SDG icons to match Figma design #4229

Resources/Instructions

• assets/images/sdg directory
• HackforLA.org website/SDG/SDG images
• _includes/about-page/about-card-sustainability.html
• About page's Sustainability section: https://www.hackforla.org/about/#sustainability
• This issue is tracked in Rollout Plan: Move, refactor, and add SDG info and images #4153

United Nations' SDG Information

• United Nations' SDG guidelines
• United Nations' SDG Communications materials
• United Nations Development Programme Sustainable Development Goals

[github-actions]

Hi @nicolettedmabeza, 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 :)

[nicolettedmabeza]

Availability: 9a-5p M-F
ii. ETA: Friday 4/14 5pm

[nicolettedmabeza]

Progress: Action items completed. Need to create pull request.
Blockers: None at this time.
Availability: 12p-5p M-F
ETA: 5pm today 4/14
Pictures (optional):
Before:

After:

[jdingeman]

@nicolettedmabeza - please remember to place your issue into the In Progress column when you self assign