#13 updating alt and adding color variable to overlay

Scout-NU · Apr 17, 2021 · 6b9c7df · 6b9c7df
1 parent 8f4a507
commit 6b9c7df
Show file tree

Hide file tree

Showing 3 changed files with 4 additions and 2 deletions.
diff --git a/src/components/footer/footer-styles.js b/src/components/footer/footer-styles.js
@@ -7,7 +7,7 @@ import {
 } from "../../style/variables"
 
 export const FooterContainer = styled.div`
-  background-color: rgb(0, 0, 0, 0.55);
+  background-color: ${colors.black_overlay};
   width: 100%;
   color: ${colors.white900};
   position: absolute;

diff --git a/src/components/footer/footer.js b/src/components/footer/footer.js
@@ -34,6 +34,7 @@ export default function footer({ data }) {
               sock_description
               sock_title
               address
+              footer_image_alt
               footer_image {
                 url
               }
@@ -53,7 +54,7 @@ export default function footer({ data }) {
         <FooterSection>
           <FooterImage>
             <img
-              alt="PowerHouse house footer background image"
+              alt={data.prismicFooter.data.footer_image_alt}
               src={data.prismicFooter.data.footer_image.url}
             />
           </FooterImage>

diff --git a/src/style/colors.js b/src/style/colors.js
@@ -13,6 +13,7 @@ const colors = {
   lighterblue900: "#6EA8C0",
   softblue900: "#ECF3F7",
   gray900: "#585858",
+  black_overlay: "rgb(0, 0, 0, 0.55)"
 }
 
 export default colors