From 07b616f7076ff3b65a34e876d74096f69c87461d Mon Sep 17 00:00:00 2001
From: Jennifer Alexander <jenny_alexander@icloud.com>
Date: Thu, 18 May 2023 22:49:40 -0500
Subject: [PATCH] Add SDG background color classes

---
 _sass/elements/_background-sdg-colors.scss | 18 ++++++++++++++++++
 _sass/main.scss                            |  1 +
 2 files changed, 19 insertions(+)
 create mode 100644 _sass/elements/_background-sdg-colors.scss

diff --git a/_sass/elements/_background-sdg-colors.scss b/_sass/elements/_background-sdg-colors.scss
new file mode 100644
index 0000000000..08061c61ee
--- /dev/null
+++ b/_sass/elements/_background-sdg-colors.scss
@@ -0,0 +1,18 @@
+/**
+ * Sustainable Development Goal (SDG) Background Colors
+ *
+ * These background color classes match the colors of the SDG icons provided by the United Nations (UN):
+ * https://www.un.org/sustainabledevelopment/news/communications-material/
+ */
+
+ .background-color-sdg2 { background-color: $color-sdg2; }
+ .background-color-sdg3 { background-color: $color-sdg3; }
+ .background-color-sdg4 { background-color: $color-sdg4; }
+ .background-color-sdg5 { background-color: $color-sdg5; }
+ .background-color-sdg8 { background-color: $color-sdg8; }
+ .background-color-sdg9 { background-color: $color-sdg9; }
+ .background-color-sdg10 { background-color: $color-sdg10; }
+ .background-color-sdg11 { background-color: $color-sdg11; }
+ .background-color-sdg13 { background-color: $color-sdg13; }
+ .background-color-sdg16 { background-color: $color-sdg16; }
+ .background-color-sdg17 { background-color: $color-sdg17; }
\ No newline at end of file
diff --git a/_sass/main.scss b/_sass/main.scss
index 28e61c771f..8c64fdb98f 100644
--- a/_sass/main.scss
+++ b/_sass/main.scss
@@ -23,6 +23,7 @@
 // /**
 //  * Elements
 //  */
+@import 'elements/background-sdg-colors';
 @import 'elements/accordion';
 @import 'elements/buttons';
 @import 'elements/forms';