Merge pull request #105 from CDCgov/jw/first-pass-a11y

A11y testing and corrections

src/app/products/_ui/index.tsx

@@ -3,9 +3,9 @@ import {
   ProcessList,
   ProcessListHeading,
   ProcessListItem,
+  Link,
 } from '@trussworks/react-uswds';
 import classNames from 'classnames';
-import Link from 'next/link';
 import { SideNav } from '@/app/components/SideNav/SideNav';
 import './styles.scss';
 import Image, { ImageProps } from 'next/image';
@@ -16,10 +16,7 @@ interface ContainerProps {
 
 const SendMailLink = () => {
   return (
-    <Link
-      className="font-bold leading-snug text-blue-cool-50"
-      href="mailto:dibbs@cdc.gov"
-    >
+    <Link className="font-bold leading-snug" href="mailto:dibbs@cdc.gov">
       dibbs@cdc.gov
     </Link>
   );
@@ -219,17 +216,20 @@ const GettingStarted = ({ systemName }: GettingStartedProps) => {
 
 interface VideoProps {
   src: string;
-  description?: string;
+  title: string;
+  description: string;
 }
-const Video = ({ src, description }: VideoProps) => {
+const Video = ({ src, title, description }: VideoProps) => {
   return (
     <div className="flex flex-col gap-3">
       <iframe
         className="h-[31.25rem] w-full border-none"
         src={src}
+        title={title}
+        aria-label={description}
         allowFullScreen
       ></iframe>
-      {description ? <Text className="italic">{description}</Text> : null}
+      <Text className="italic">{description}</Text>
     </div>
   );
 };

src/app/products/ecr-viewer/page.tsx

@@ -118,6 +118,7 @@ export default function EcrViewer() {
                     <SubsectionContainer>
                       <SectionSubheader>Demo</SectionSubheader>
                       <Video
+                        title="eCR Viewer product demo"
                         src="https://www.loom.com/embed/f59bf06efe3847c286829da95d4fd36d?sid=7171105a-cff8-4dd0-8ee5-9f32cca35f60"
                         description="See how the eCR Viewer can improve the way your jurisdiction
                   uses eCR data."