diff --git a/site/src/components/BreaksList.tsx b/site/src/components/BreaksList.tsx index a0b0d0b..797bb76 100644 --- a/site/src/components/BreaksList.tsx +++ b/site/src/components/BreaksList.tsx @@ -81,8 +81,7 @@ export const BreaksList = ({ breaks, breakProcessesMap }: BreaksListProps) => { if (!query) return true; if (caseInsensitiveIncludes(data.location.id, query)) return true; - if (data.description.find((d) => caseInsensitiveIncludes(d, query))) - return true; + if (caseInsensitiveIncludes(data.description, query)) return true; if (version === "2") return !!data.wcag2!.find( @@ -217,47 +216,45 @@ export const BreaksList = ({ breaks, breakProcessesMap }: BreaksListProps) => { /> )} - {brk.description.map((description) => ( -
- - {brk.href} - - :{" "} - - {brk.discussionItems && - (brk.discussionItems.length === 1 ? ( +
+ + {brk.href} + + :{" "} + + {brk.discussionItems && + (brk.discussionItems.length === 1 ? ( +
+ + Discussion item: + {" "} + +
+ ) : ( + <>
- Discussion item: - {" "} - + Discussion items: +
- ) : ( - <> -
- - Discussion items: - -
- - - ))} -
- ))} + + + ))} + ))} diff --git a/site/src/components/Carousel.astro b/site/src/components/Carousel.astro index 82bdc2f..4d16b09 100644 --- a/site/src/components/Carousel.astro +++ b/site/src/components/Carousel.astro @@ -46,9 +46,15 @@ const collectionMap = { * @break * wcag2: 2.2.2 * wcag3: No visual motion - * description: - * - The carousel does not include controls to stop moving and updating. - * - The promotional video at the bottom of the home page loops infinitely and does not have controls to pause. + * description: | + * The carousel does not include controls to stop moving and updating. + */ +/** + * @break + * wcag2: 2.2.2 + * wcag3: No visual motion + * description: | + * The promotional video at the bottom of the home page loops infinitely and does not have controls to pause. */ }
diff --git a/site/src/components/Header.astro b/site/src/components/Header.astro index 5869943..80302c7 100644 --- a/site/src/components/Header.astro +++ b/site/src/components/Header.astro @@ -23,9 +23,14 @@ const { searchMode } = Astro.props; * @break * wcag2: 1.4.10 * wcag3: Text reflow supported - * description: - * - When zoomed, the header text moves off the background. - * - At 400% zoom, the cookie notice occupies more than the full screen and cannot be scrolled. + * description: When zoomed, the header text moves off the background. + */ + /** + * @break + * wcag2: 1.4.10 + * wcag3: Text reflow supported + * description: | + * At 400% zoom, the cookie notice occupies more than the full screen and cannot be scrolled. */ }
diff --git a/site/src/content.config.ts b/site/src/content.config.ts index e94183f..e53d246 100644 --- a/site/src/content.config.ts +++ b/site/src/content.config.ts @@ -184,7 +184,8 @@ export const collections = { // in order for typings for references and transforms to work schema: z .object({ - description: singleOrArray(z.string()).transform(transformToArray), + title: z.string().optional(), + description: z.string(), discussionItems: z.array(z.string()).nonempty().optional(), href: z.string().regex(/^(\/|#|$)/), location: reference("breakSections"), diff --git a/site/src/pages/museum/collections/index.astro b/site/src/pages/museum/collections/index.astro index 6217647..13f84dd 100644 --- a/site/src/pages/museum/collections/index.astro +++ b/site/src/pages/museum/collections/index.astro @@ -82,12 +82,24 @@ const headerNavLinks = filterNavTreeLinks( * @break * wcag2: 2.4.3 * wcag3: Focus order meaningful - * description: - * - The collection links have explicit tabindex attributes, causing them to come before anything else in the page. - * - The links in the "See More" section are not included in the explicit order, meaning focus tabs to each collection link, - * then header items, then the "See More" links, then the footer. - * - The explicit tab order is optimized specifically for the widest layout, - * making it incorrect even within the collections list on narrower viewports. + * description: | + * The collection links have explicit tabindex attributes, causing them to come before anything else in the page. + */ +/** + * @break + * wcag2: 2.4.3 + * wcag3: Focus order meaningful + * description: | + * The links in the "See More" section are not included in the explicit order, meaning focus tabs to each collection link, + * then header items, then the "See More" links, then the footer. + */ +/** + * @break + * wcag2: 2.4.3 + * wcag3: Focus order meaningful + * description: | + * The explicit tab order is optimized specifically for the widest layout, + * making it incorrect even within the collections list on narrower viewports. */ --- diff --git a/site/src/pages/museum/early-home-computers-event.astro b/site/src/pages/museum/early-home-computers-event.astro index 9ae2dc7..432a0dd 100644 --- a/site/src/pages/museum/early-home-computers-event.astro +++ b/site/src/pages/museum/early-home-computers-event.astro @@ -108,10 +108,19 @@ import vic20 from "@/assets/images/exhibits/early-home-computers/vic20.webp"; * href: "#zx81" * wcag2: 1.4.11 * wcag3: Interactive element contrast sufficient - * description: - * - The links in the small text in the cards are the same color as non-link text - * and have underlines that have a contrast of less than 3:1 with the page background. - * - Scrollbar color contrast is less than 3:1 in browsers that support styling scrollbars. + * description: | + * The links in the small text in the cards are the same color as non-link text + * and have underlines that have a contrast of less than 3:1 with the page background. + * discussionItems: + * - Does this fail WCAG 3 Control contrast? If not, what requirement does it fail? + */ + /** + * @break + * href: "#zx81" + * wcag2: 1.4.11 + * wcag3: Interactive element contrast sufficient + * description: | + * Scrollbar color contrast is less than 3:1 in browsers that support styling scrollbars. * discussionItems: * - Does this fail WCAG 3 Control contrast? If not, what requirement does it fail? */ diff --git a/site/src/pages/museum/gift-shop/[category]/[product].astro b/site/src/pages/museum/gift-shop/[category]/[product].astro index b2fd342..8ffe3a9 100644 --- a/site/src/pages/museum/gift-shop/[category]/[product].astro +++ b/site/src/pages/museum/gift-shop/[category]/[product].astro @@ -71,11 +71,16 @@ const { Content } = await render(product); /** * @break * wcag3: Focus placed - * description: - * - Upon entering an invalid quantity (e.g. 0), pressing add to cart, then dismissing the modal, - * focus is not restored to the add to cart button. - * - Upon entering an invalid quantity (e.g. 0), - * the modal that appears does not grab and trap focus. + * description: | + * Upon entering an invalid quantity (e.g. 0), pressing add to cart, then dismissing the modal, + * focus is not restored to the add to cart button. + */ + /** + * @break + * wcag3: Focus placed + * description: | + * Upon entering an invalid quantity (e.g. 0), + * the modal that appears does not grab and trap focus. * discussionItems: * - Focus placed does not seem to actually cover focus _into_ a modal, only returning from it? * What requirement would be relevant to failing to move focus inside a modal when it opens? diff --git a/site/src/pages/museum/gift-shop/checkout/payment.astro b/site/src/pages/museum/gift-shop/checkout/payment.astro index c350082..470a0a1 100644 --- a/site/src/pages/museum/gift-shop/checkout/payment.astro +++ b/site/src/pages/museum/gift-shop/checkout/payment.astro @@ -21,7 +21,7 @@ import ShopLayout from "@/layouts/ShopLayout.astro"; * wcag2: * - 3.3.4 * - 3.3.6 - * description: + * description: | * There is no confirmation step after entering payment information. */ } diff --git a/site/src/pages/museum/help.astro b/site/src/pages/museum/help.astro index 0e7e479..0b15402 100644 --- a/site/src/pages/museum/help.astro +++ b/site/src/pages/museum/help.astro @@ -15,14 +15,12 @@ import Layout from "@/layouts/Layout.astro"; /** * @break * wcag3: Common words used - * description: - * - No definitions are provided for uncommon words found in the page. + * description: No definitions are provided for uncommon words found in the page. */ /** * @break * wcag3: Non-literal language explained - * description: - * - No explanations are included for idioms and metaphors used on the page. + * description: No explanations are included for idioms and metaphors used on the page. */ /** * @break diff --git a/site/src/pages/museum/register.astro b/site/src/pages/museum/register.astro index 15035c8..a97d9c4 100644 --- a/site/src/pages/museum/register.astro +++ b/site/src/pages/museum/register.astro @@ -77,13 +77,17 @@ import Layout from "@/layouts/Layout.astro"; * @break * href: "#prove-youre-a-human" * wcag3: Interactive element contrast sufficient - * description: - * - The CAPTCHA field has an invisible text cursor/caret. - * - | - * The CAPTCHA field is initially empty and indicated only by a - * low-contrast underline, making its target area ambiguous. + * description: The CAPTCHA field has an invisible text cursor/caret. * discussionItems: - * - Does the invisible text cursor/caret fail INteractive element contrast? + * - Does the invisible text cursor/caret fail Interactive element contrast? + */ + /** + * @break + * href: "#prove-youre-a-human" + * wcag3: Interactive element contrast sufficient + * description: | + * The CAPTCHA field is initially empty and indicated only by a + * low-contrast underline, making its target area ambiguous. */ }