Add SDG color variables: 2-5, 8-11, 13, 16, 17

[JessicaLucindaCheng]

Overview

We need to add the SDG (Sustainable Development Goal) colors to our repo so we can use these colors with their corresponding, matching SDG icons.

Action Items

• In the _sass/variables, create a new file: _colors-sdg.scss
• In the file you just created, add the following:

/**
 * Sustainable Development Goal (SDG) Colors
 *
 * The hex color values for these variables match the SDG color icons provided by the United Nations (UN).
 * These hex values are from the last the page in the SDG Guidelines provided by the UN:
 * https://www.un.org/sustainabledevelopment/wp-content/uploads/2019/01/SDG_Guidelines_AUG_2019_Final.pdf
 */

$color-sdg2: #DDA63A;
$color-sdg3: #4C9F38;
$color-sdg4: #C5192D;
$color-sdg5: #FF3A21;
$color-sdg8: #A21942;
$color-sdg9: #FD6925;
$color-sdg10: #DD1367;
$color-sdg11: #FD9D24;
$color-sdg13: #3F7E44;
$color-sdg16: #00689D;
$color-sdg17: #19486A;

• In the _sass/main.scss, under the General Settings and Utilities section, add this:

@import 'variables/colors-sdg';

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/dependencies listed under the Dependency section are closed or checked off. If the dependencies are all closed or checked, 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.
  • Add SDG background color classes: 2-5, 8-11, 13, 16, 17 #4344

Resources/Instructions

• _sass/variables
• _sass/main.scss
• SDGs_HEX_Colors tab in HfLA: Projects: SDG and Targets Google Sheet
• This issue is tracked in Rollout Plan: Move, refactor, and add SDG info and images #4153

[github-actions]

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

[StephenTheDev1001]

Availability: Sun-Thrus 3pm-7pm PDT.
ETA: Apr 6th