From 59fc191d56592980f75cf6ac79fc584fe25f09dc Mon Sep 17 00:00:00 2001
From: Shinsina <shinsina@att.net>
Date: Wed, 18 May 2022 08:40:50 -0500
Subject: [PATCH 01/13] Add aria-label to newsletter-toggle-button.vue

---
 .../browser/newsletter-toggle-button.vue                         | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/marko-web-theme-monorail/browser/newsletter-toggle-button.vue b/packages/marko-web-theme-monorail/browser/newsletter-toggle-button.vue
index d4e5060fc..d866d0754 100644
--- a/packages/marko-web-theme-monorail/browser/newsletter-toggle-button.vue
+++ b/packages/marko-web-theme-monorail/browser/newsletter-toggle-button.vue
@@ -2,6 +2,7 @@
   <button
     class="site-navbar__newsletter-toggler"
     type="button"
+    aria-label="Newsletter Menu Toggle"
     @click="toggle"
   >
     <icon-mail :modifiers="['lg']" />

From 0b569d64103216048d06ca42b55e7928db1595a0 Mon Sep 17 00:00:00 2001
From: Shinsina <shinsina@att.net>
Date: Wed, 18 May 2022 08:42:02 -0500
Subject: [PATCH 02/13] Pass-through input.attrs to marko-web-element.

This impacts both default-theme-site-menu-section and default-theme-site-footer-container.
---
 .../components/site-footer/container.marko                       | 1 +
 .../marko-web-theme-default/components/site-menu/section.marko   | 1 +
 2 files changed, 2 insertions(+)

diff --git a/packages/marko-web-theme-default/components/site-footer/container.marko b/packages/marko-web-theme-default/components/site-footer/container.marko
index ab2d18e21..628a9b0a0 100644
--- a/packages/marko-web-theme-default/components/site-footer/container.marko
+++ b/packages/marko-web-theme-default/components/site-footer/container.marko
@@ -5,6 +5,7 @@ $ const blockName = input.blockName || "site-footer";
   name="container"
   tag=input.tag
   modifiers=input.modifiers
+  attrs=input.attrs
 >
   <${input.renderBody} />
 </marko-web-element>
diff --git a/packages/marko-web-theme-default/components/site-menu/section.marko b/packages/marko-web-theme-default/components/site-menu/section.marko
index 8075d145c..78b520bf6 100644
--- a/packages/marko-web-theme-default/components/site-menu/section.marko
+++ b/packages/marko-web-theme-default/components/site-menu/section.marko
@@ -9,6 +9,7 @@ $ const items = getAsArray(input, "items");
     name="section"
     tag=input.tag
     modifiers=input.modifiers
+    attrs=input.attrs
   >
     <if(input.label)>
       <default-theme-site-menu-header block-name=blockName>

From 85011bab9876a8f470cfe2c595351fdd6c8daf89 Mon Sep 17 00:00:00 2001
From: Shinsina <shinsina@att.net>
Date: Wed, 18 May 2022 08:42:17 -0500
Subject: [PATCH 03/13] + aria labels to footer containers and navigations

---
 .../components/site-footer.marko                     | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/packages/marko-web-theme-monorail/components/site-footer.marko b/packages/marko-web-theme-monorail/components/site-footer.marko
index 330feacd0..5f27739b0 100644
--- a/packages/marko-web-theme-monorail/components/site-footer.marko
+++ b/packages/marko-web-theme-monorail/components/site-footer.marko
@@ -14,7 +14,7 @@ $ const tagline = site.get("tagline");
   modifiers=input.modifiers
   attrs=input.attrs
 >
-  <default-theme-site-footer-container block-name=blockName modifiers=["secondary"]>
+  <default-theme-site-footer-container block-name=blockName modifiers=["secondary"] attrs={ "aria-label": "Footer Secondary Navigation" }>
     <marko-web-element block-name=blockName name="inner-container">
 
       <default-theme-site-navbar-brand block-name=blockName title=`${config.website("name")} Homepage`>
@@ -32,7 +32,7 @@ $ const tagline = site.get("tagline");
       </if>
 
       <div class="row">
-        <marko-web-element block-name=blockName name="section">
+        <marko-web-element block-name=blockName name="section" attrs={ "aria-label": "Newsletter Sign-Up Form Footer"}>
           $ const newsletterBlock = "site-footer-newsletter";
           <if(newsletterConfig.action)>
             <marko-web-block name=newsletterBlock>
@@ -64,10 +64,10 @@ $ const tagline = site.get("tagline");
             </marko-web-block>
           </if>
         </marko-web-element>
-        <marko-web-element block-name=blockName name="section">
+        <marko-web-element block-name=blockName name="section" attrs={ "aria-label": "Social Media Links" }>
           <theme-social-follow dark=false modifiers=["site-footer"] />
         </marko-web-element>
-        <marko-web-element block-name=blockName name="section">
+        <marko-web-element block-name=blockName name="section" attrs={ "aria-label": "Footer Site Section Navigation"}>
 
           <div class="row">
             $ const navBlockName = "site-footer-nav";
@@ -81,6 +81,7 @@ $ const tagline = site.get("tagline");
                   items=topics
                   reg-enabled=false
                   has-user=false
+                  attrs={ "aria-label": "Site Footer Navigation Topics Section" }
                 />
               </if>
             </marko-web-block>
@@ -94,6 +95,7 @@ $ const tagline = site.get("tagline");
                   items=more
                   reg-enabled=false
                   has-user=false
+                  attrs={ "aria-label": "Site Footer Navigation More Section" }
                 />
               </if>
             </marko-web-block>
@@ -104,7 +106,7 @@ $ const tagline = site.get("tagline");
 
     </marko-web-element>
   </default-theme-site-footer-container>
-  <default-theme-site-footer-container block-name=blockName modifiers=["primary"]>
+  <default-theme-site-footer-container block-name=blockName modifiers=["primary"] attrs={ "aria-label": "Primary Secondary Navigation" }>
     <marko-web-element block-name=blockName name="inner-container">
       $ const corporateSrc = site.get("logos.corporate.src");
       $ const corporateSrcset = site.getAsArray("logos.corporate.srcset");

From 08bb716e3e330bfda37f6b6e30bfdd62c76dcc26 Mon Sep 17 00:00:00 2001
From: Shinsina <shinsina@att.net>
Date: Wed, 18 May 2022 09:44:57 -0500
Subject: [PATCH 04/13] Darken theme-media-caption-color

---
 packages/marko-web-theme-monorail/scss/_variables.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/marko-web-theme-monorail/scss/_variables.scss b/packages/marko-web-theme-monorail/scss/_variables.scss
index 666047144..5008656ae 100644
--- a/packages/marko-web-theme-monorail/scss/_variables.scss
+++ b/packages/marko-web-theme-monorail/scss/_variables.scss
@@ -268,7 +268,7 @@ $theme-page-body-line-height-sm: $theme-page-body-line-height;
 $theme-media-footer-font-size: 16px;
 
 $theme-media-footer-line-height: get-line-height($theme-media-footer-font-size, 22px);
-$theme-media-caption-color: #6c6972;
+$theme-media-caption-color: #474747;
 $theme-media-credit-font-size: 14px !default;
 
 // Headings

From 213954db6a20a0a0ee5b660d899a00744045423e Mon Sep 17 00:00:00 2001
From: Shinsina <shinsina@att.net>
Date: Wed, 18 May 2022 09:45:17 -0500
Subject: [PATCH 05/13] Dark theme-media-caption, theme-media-credit color

---
 packages/marko-web-theme-default/scss/_variables.scss | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/marko-web-theme-default/scss/_variables.scss b/packages/marko-web-theme-default/scss/_variables.scss
index 62819238a..e5c9ca1f7 100644
--- a/packages/marko-web-theme-default/scss/_variables.scss
+++ b/packages/marko-web-theme-default/scss/_variables.scss
@@ -203,12 +203,12 @@ $theme-media-footer-line-height:  $line-height-sm !default;
 $theme-media-footer-padding-x:    0 !default;
 $theme-media-footer-padding-y:    .5rem !default;
 
-$theme-media-caption-color:       #464646 !default;
+$theme-media-caption-color:       #474747 !default;
 $theme-media-caption-font-size:   $theme-media-footer-font-size !default;
 $theme-media-caption-font-weight: 400 !default;
 $theme-media-caption-line-height: $theme-media-footer-line-height !default;
 
-$theme-media-credit-color:        #777 !default;
+$theme-media-credit-color:        #5c5b5b !default;
 $theme-media-credit-font-size:    12px !default;
 $theme-media-credit-font-style:   initial !default;
 $theme-media-credit-font-weight:  400 !default;

From 0307fbfb87050e2e3d9da1fdf4bcf76d215088a7 Mon Sep 17 00:00:00 2001
From: Shinsina <shinsina@att.net>
Date: Wed, 18 May 2022 10:03:33 -0500
Subject: [PATCH 06/13] Darken theme-embedded-media color, inline captions

---
 packages/marko-web-theme-default/scss/_variables.scss | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/marko-web-theme-default/scss/_variables.scss b/packages/marko-web-theme-default/scss/_variables.scss
index e5c9ca1f7..fd320d223 100644
--- a/packages/marko-web-theme-default/scss/_variables.scss
+++ b/packages/marko-web-theme-default/scss/_variables.scss
@@ -215,7 +215,7 @@ $theme-media-credit-font-weight:  400 !default;
 $theme-media-credit-line-height:  $theme-media-footer-line-height !default;
 
 // Embedded Media
-$theme-embedded-media-color:        $gray-600 !default;
+$theme-embedded-media-color:        $gray-700 !default;
 $theme-embedded-media-font-family:  $theme-font-family-sans-serif !default;
 $theme-embedded-media-font-size:    $font-size-base !default;
 $theme-embedded-media-line-height:  $line-height-sm !default;

From 6684500173953a8d56b5174de1d8f1246d00453c Mon Sep 17 00:00:00 2001
From: Shinsina <shinsina@att.net>
Date: Wed, 18 May 2022 10:37:19 -0500
Subject: [PATCH 07/13] Add aria-label prop to breadcrumb components.

---
 .../components/breadcrumbs/marko.json                       | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/packages/marko-web-theme-monorail/components/breadcrumbs/marko.json b/packages/marko-web-theme-monorail/components/breadcrumbs/marko.json
index 8ae0e762a..225168c18 100644
--- a/packages/marko-web-theme-monorail/components/breadcrumbs/marko.json
+++ b/packages/marko-web-theme-monorail/components/breadcrumbs/marko.json
@@ -2,7 +2,8 @@
   "<theme-breadcrumbs>": {
     "template": "./index.marko",
     "@items <item>[]": {},
-    "@modifiers": "array"
+    "@modifiers": "array",
+    "@aria-label": "string"
   },
   "<theme-breadcrumbs-with-home>": {
     "template": "./with-home.marko",
@@ -25,6 +26,7 @@
     "@home-alias": "string",
     "@display-self": "boolean",
     "@display-home": "boolean",
-    "@modifiers": "array"
+    "@modifiers": "array",
+    "@aria-label": "string"
   }
 }

From 2b313f368fc105868985dd586478e51eb480c29f Mon Sep 17 00:00:00 2001
From: Shinsina <shinsina@att.net>
Date: Wed, 18 May 2022 10:37:30 -0500
Subject: [PATCH 08/13] Add aria label to site footer breadcrumbs

---
 packages/marko-web-theme-monorail/components/site-footer.marko | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/marko-web-theme-monorail/components/site-footer.marko b/packages/marko-web-theme-monorail/components/site-footer.marko
index 5f27739b0..b7eada5be 100644
--- a/packages/marko-web-theme-monorail/components/site-footer.marko
+++ b/packages/marko-web-theme-monorail/components/site-footer.marko
@@ -123,7 +123,7 @@ $ const tagline = site.get("tagline");
       </if>
 
       $ const footerItems = site.getAsArray("navigation.footer.items");
-      <theme-breadcrumbs modifiers=["site-footer"]>
+      <theme-breadcrumbs modifiers=["site-footer"] aria-label="Site Footer Breadcrumbs">
         <for|item| of=getNavItems({ items: footerItems, hasUser: input.hasUser, regEnabled: input.regEnabled })>
           <@item>
             $ const obj = asObject(item);

From ad79f05008d100188b19fc9063b04b72bf919b7c Mon Sep 17 00:00:00 2001
From: Shinsina <shinsina@att.net>
Date: Wed, 18 May 2022 10:37:54 -0500
Subject: [PATCH 09/13] Pass ariaLabel to theme-breadcrumbs, site-section.

---
 .../components/breadcrumbs/website-section.marko                | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/marko-web-theme-monorail/components/breadcrumbs/website-section.marko b/packages/marko-web-theme-monorail/components/breadcrumbs/website-section.marko
index 29fbd3ff9..be72a15e1 100644
--- a/packages/marko-web-theme-monorail/components/breadcrumbs/website-section.marko
+++ b/packages/marko-web-theme-monorail/components/breadcrumbs/website-section.marko
@@ -8,7 +8,7 @@ $ const homeAlias = input.homeAlias || "home";
 $ const displaySelf = defaultValue(input.displaySelf, true);
 $ const displayHome = defaultValue(input.displayHome, true);
 
-<theme-breadcrumbs modifiers=input.modifiers>
+<theme-breadcrumbs modifiers=input.modifiers aria-label=input.ariaLabel>
   <if(displayHome)>
     <@item>
       <marko-web-link href="/" title=homeTitle>${homeTitle}</marko-web-link>

From 836a0779f520c4b4b24cfaefc99a0194e21ae16d Mon Sep 17 00:00:00 2001
From: Shinsina <shinsina@att.net>
Date: Wed, 18 May 2022 10:38:14 -0500
Subject: [PATCH 10/13] Use value if passed otherwise default to old value

---
 .../components/breadcrumbs/index.marko                         | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/packages/marko-web-theme-monorail/components/breadcrumbs/index.marko b/packages/marko-web-theme-monorail/components/breadcrumbs/index.marko
index 74a3398ad..faa7d1d09 100644
--- a/packages/marko-web-theme-monorail/components/breadcrumbs/index.marko
+++ b/packages/marko-web-theme-monorail/components/breadcrumbs/index.marko
@@ -4,9 +4,10 @@ $ const items = getAsArray(input, "items");
 $ const modifiers = getAsArray(input, "modifiers");
 $ const blockName = "breadcrumbs";
 $ const classes = [blockName, ...modifiers.map(mod => `${blockName}--${mod}`)];
+$ const ariaLabel = input.ariaLabel || "breadcrumb";
 
 <if(items.length)>
-  <nav class=classes aria-label="breadcrumb">
+  <nav class=classes aria-label=ariaLabel>
     <ol class="breadcrumb">
       <for|item| of=items>
         <if(item.renderBody)>

From adea2f46634c745aba8c4d33309ddb75e2a6151c Mon Sep 17 00:00:00 2001
From: Shinsina <shinsina@att.net>
Date: Wed, 18 May 2022 10:38:30 -0500
Subject: [PATCH 11/13] Pass Content Section Breadcrumbs for content page

---
 .../components/breadcrumbs/content-page.marko                    | 1 +
 1 file changed, 1 insertion(+)

diff --git a/packages/marko-web-theme-monorail/components/breadcrumbs/content-page.marko b/packages/marko-web-theme-monorail/components/breadcrumbs/content-page.marko
index 9043c7846..40d36d191 100644
--- a/packages/marko-web-theme-monorail/components/breadcrumbs/content-page.marko
+++ b/packages/marko-web-theme-monorail/components/breadcrumbs/content-page.marko
@@ -3,4 +3,5 @@
   section=input.section
   display-self=input.displaySelf
   modifiers=["content-page"]
+  aria-label="Content Section Breadcrumbs"
 />

From 3021f2136440a7491b81244755bcb6bd9f1ae24d Mon Sep 17 00:00:00 2001
From: Shinsina <shinsina@att.net>
Date: Wed, 18 May 2022 11:22:03 -0500
Subject: [PATCH 12/13] Add roles and aria-labels to top+related stories.

---
 .../components/blocks/related-stories.marko                     | 2 +-
 .../components/blocks/top-stories.marko                         | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/marko-web-theme-monorail/components/blocks/related-stories.marko b/packages/marko-web-theme-monorail/components/blocks/related-stories.marko
index 9d75229c5..28695c6be 100644
--- a/packages/marko-web-theme-monorail/components/blocks/related-stories.marko
+++ b/packages/marko-web-theme-monorail/components/blocks/related-stories.marko
@@ -42,7 +42,7 @@ $ const blockName = "related-stories";
     >
       $ nodes.push(...related);
       <if(nodes.length)>
-        <marko-web-block name=blockName>
+        <marko-web-block name=blockName attrs={ role: "region", "aria-label": "Related Stories" }>
           <marko-web-element block-name=blockName name="header">
             ${title}
           </marko-web-element>
diff --git a/packages/marko-web-theme-monorail/components/blocks/top-stories.marko b/packages/marko-web-theme-monorail/components/blocks/top-stories.marko
index b2c853992..743472266 100644
--- a/packages/marko-web-theme-monorail/components/blocks/top-stories.marko
+++ b/packages/marko-web-theme-monorail/components/blocks/top-stories.marko
@@ -27,7 +27,7 @@ $ const queryName = (queryParams.optionName) ? "website-optioned-content" : "web
     };
     $ const cardNodes = nodes.slice(1);
 
-    <marko-web-block name=blockName>
+    <marko-web-block name=blockName attrs={ role: "region", "aria-label": "Top Stories" }>
       <if(withHeader)>
         <marko-web-element block-name=blockName name="header">
           ${i18n("Top Stories")}

From b092acb6e050f91f0c73e9df53437548bc382b5b Mon Sep 17 00:00:00 2001
From: Shinsina <shinsina@att.net>
Date: Wed, 18 May 2022 11:22:11 -0500
Subject: [PATCH 13/13] Add role and aria label to Callout Cards

---
 .../components/blocks/callout-cards.marko                       | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/packages/marko-web-theme-monorail/components/blocks/callout-cards.marko b/packages/marko-web-theme-monorail/components/blocks/callout-cards.marko
index efe1ca5ab..a9eb61406 100644
--- a/packages/marko-web-theme-monorail/components/blocks/callout-cards.marko
+++ b/packages/marko-web-theme-monorail/components/blocks/callout-cards.marko
@@ -3,7 +3,7 @@ import { getAsArray } from "@parameter1/base-cms-object-path";
 $ const blockName = "callout-cards";
 $ const slots = getAsArray(input, "slots");
 
-<marko-web-block name=blockName>
+<marko-web-block name=blockName attrs={ role: "region", "aria-label": "Callout Cards" }>
   <marko-web-element block-name=blockName name="row">
     <marko-web-element block-name=blockName name="col">
       <${slots[0].renderBody} />