Merge pull request #191 from cisagov/190-update-rsc-footer

Update ReadySetCyber Dashboard Footer

frontend/src/components/ReadySetCyber/RSCFooter.tsx

@@ -9,32 +9,50 @@ export const RSCFooter: React.FC = () => {
       sx={{
         width: '100%',
         display: 'flex',
+        flexDirection: {
+          xs: 'column',
+          sm: 'row'
+        },
         position: 'relative',
         bottom: 0,
         justifyContent: 'center',
-        backgroundColor: '#005285',
-        paddingTop: '1em',
-        paddingBottom: '1em'
+        alignItems: {
+          xs: 'center', // center horizontally on small screens
+          sm: 'initial' // reset to default on larger screens
+        },
+        backgroundColor: '#005288',
+        padding: '1em'
       }}
     >
       <Box
         sx={{
           maxWidth: '80vw',
           display: 'flex',
           flexDirection: 'column',
-          justifyContent: 'center'
+          justifyContent: 'center',
+          paddingBottom: '2em'
         }}
       >
-        <Stack direction={'row'} gap={'1em'} paddingBottom={'2em'}>
-          <img
-            src={cisaFooterLogo}
-            alt="CISA Footer Logo"
-            style={{
-              width: 55,
-              height: 55,
-              flexShrink: 0
-            }}
-          />
+        <Stack
+          direction={{ sm: 'column', md: 'row' }}
+          gap={{ sm: '-2em', md: '1em' }}
+          paddingBottom={'2em'}
+        >
+          <Link
+            href="https://www.cisa.gov/"
+            target="_blank"
+            rel="noopener noreferrer"
+          >
+            <img
+              src={cisaFooterLogo}
+              alt="CISA Footer Logo"
+              style={{
+                width: 55,
+                height: 55,
+                flexShrink: 0
+              }}
+            />
+          </Link>
           <Stack justifyContent={'center'}>
             <Typography
               style={{
@@ -50,7 +68,7 @@ export const RSCFooter: React.FC = () => {
                 fontSize: '0.85em'
               }}
             >
-              An Official website of the U.S. Department of Homeland Security
+              An official website of the U.S. Department of Homeland Security
             </Typography>
           </Stack>
         </Stack>
@@ -73,13 +91,43 @@ export const RSCFooter: React.FC = () => {
                   fontSize: '0.9em'
                 }}
                 href={link.href}
+                target="_blank"
+                rel="noopener noreferrer"
               >
                 {link.text}
               </Link>
             </Grid>
           ))}
         </Grid>
       </Box>
+      <Box
+        sx={{
+          textAlign: {
+            xs: 'center',
+            sm: 'right'
+          },
+          alignContent: {
+            xs: 'flex-end',
+            sm: 'center'
+          },
+          marginTop: {
+            xs: '1em',
+            sm: '2em',
+            md: '0em'
+          }
+        }}
+      >
+        <iframe
+          src="https://www.dhs.gov/ntas/"
+          name="National Terrorism Advisory System"
+          title="National Terrorism Advisory System"
+          width="170"
+          height="180"
+          scrolling="no"
+          frameBorder="0"
+          style={{ border: 0 }}
+        />
+      </Box>
     </Box>
   );
 };

frontend/src/components/ReadySetCyber/links.ts

@@ -1,14 +1,23 @@
 export const links = [
-  { text: 'About CISA', href: '#link1' },
-  { text: 'Accessibility', href: '#link2' },
-  { text: 'Budget and Performance', href: '#link3' },
-  { text: 'DHS.gov', href: '#link10' },
-  { text: 'FOIA Requests', href: '#link4' },
-  { text: 'No FEAR Act', href: '#link5' },
-  { text: 'Office of Inspector General', href: '#link6' },
-  { text: 'Privacy Policy', href: '#link11' },
-  { text: 'Subscribe', href: '#link7' },
-  { text: 'The White House', href: '#link8' },
-  { text: 'USA.gov', href: '#link9' },
-  { text: 'Website Feedback', href: '#link12' }
+  { text: 'About CISA', href: 'https://www.cisa.gov/about' },
+  { text: 'Accessibility', href: 'https://www.dhs.gov/accessibility' },
+  {
+    text: 'Budget and Performance',
+    href: 'https://www.dhs.gov/performance-financial-reports'
+  },
+  { text: 'DHS.gov', href: 'https://www.dhs.gov' },
+  { text: 'FOIA Requests', href: 'https://www.dhs.gov/foia' },
+  {
+    text: 'No FEAR Act',
+    href: 'https://www.cisa.gov/about/site-links/cisa-no-fear-act-reporting'
+  },
+  { text: 'Office of Inspector General', href: 'https://www.oig.dhs.gov' },
+  { text: 'Privacy Policy', href: 'https://www.cisa.gov/privacy-policy' },
+  {
+    text: 'Subscribe',
+    href: 'https://public.govdelivery.com/accounts/USDHSCISA/subscriber/new?topic_id=USDHSCISA_138'
+  },
+  { text: 'The White House', href: 'https://www.whitehouse.gov' },
+  { text: 'USA.gov', href: 'https://www.usa.gov' },
+  { text: 'Website Feedback', href: 'https://www.cisa.gov/forms/feedback' }
 ];