← Back to summary

https://www.lisresilience.org/connect/ FAIL

Score: 72/100 • Errors: 4 • Warnings: 2 • Notices: 0
Tests Passed: 27/33 • Response Time: 3187ms
Target: WCAG 2.2 Level AA • Settle Delay: 2000ms • Audit Profile: wcag • Run Profile: desktop
Tags Used: wcag2a, wcag2aa, wcag21a, wcag21aa, wcag22a, wcag22aa
Excluded Rules: none

Errors (4)

button-name critical
Buttons must have discernible text
Learn more
nodes: 1
target #locate-me
Fix any of the following: Element does not have inner text that is visible to screen readers aria-label attribute does not exist or is empty aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty Element has no title attribute Element does not have an implicit (wrapped) <label> Element does not have an explicit <label> Element's default semantics were not overridden with role="none" or role="presentation"
HTML snippet
<button id="locate-me" class="pointer-events-auto bg-white rounded-md absolute top-20 left-[10px] z-10 p-[3.5px] border-2" style="border-color: #C3BFBB">
color-contrast serious
Elements must meet minimum color contrast ratio thresholds
Learn more
nodes: 6
target .sm\:w-auto.flex-row.gap-4:nth-child(1) > .items-start.justify-center.flex-col > .text-rhMedium.mb-1.text-xs
Fix any of the following: Element has insufficient color contrast of 3.84 (foreground color: #76797a, background color: #ebf1f4, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 4.5:1
HTML snippet
<p class="text-xs mobile:text-sm font-roboto text-rhDark mb-1 text-rhMedium">Deb Abibou</p>
target .sm\:w-auto.flex-row.gap-4:nth-child(2) > .items-start.justify-center.flex-col > .text-rhMedium.mb-1.text-xs
Fix any of the following: Element has insufficient color contrast of 3.84 (foreground color: #76797a, background color: #ebf1f4, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 4.5:1
HTML snippet
<p class="text-xs mobile:text-sm font-roboto text-rhDark mb-1 text-rhMedium">Elizabeth Hornstein</p>
target .sm\:w-auto.flex-row.gap-4:nth-child(3) > .items-start.justify-center.flex-col > .text-rhMedium.mb-1.text-xs
Fix any of the following: Element has insufficient color contrast of 3.84 (foreground color: #76797a, background color: #ebf1f4, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 4.5:1
HTML snippet
<p class="text-xs mobile:text-sm font-roboto text-rhDark mb-1 text-rhMedium">Sara Powell</p>
target .sm\:w-auto.flex-row.gap-4:nth-child(4) > .items-start.justify-center.flex-col > .text-rhMedium.mb-1.text-xs
Fix any of the following: Element has insufficient color contrast of 3.84 (foreground color: #76797a, background color: #ebf1f4, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 4.5:1
HTML snippet
<p class="text-xs mobile:text-sm font-roboto text-rhDark mb-1 text-rhMedium">Sarah Schechter</p>
target .sm\:w-auto.flex-row.gap-4:nth-child(5) > .items-start.justify-center.flex-col > .text-rhMedium.mb-1.text-xs
Fix any of the following: Element has insufficient color contrast of 3.84 (foreground color: #76797a, background color: #ebf1f4, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 4.5:1
HTML snippet
<p class="text-xs mobile:text-sm font-roboto text-rhDark mb-1 text-rhMedium">Sarah Schaefer-Brown</p>
target .sm\:w-auto.flex-row.gap-4:nth-child(6) > .items-start.justify-center.flex-col > .text-rhMedium.mb-1.text-xs
Fix any of the following: Element has insufficient color contrast of 3.84 (foreground color: #76797a, background color: #ebf1f4, font size: 12.0pt (16px), font weight: normal). Expected contrast ratio of 4.5:1
HTML snippet
<p class="text-xs mobile:text-sm font-roboto text-rhDark mb-1 text-rhMedium">Ben Goldberg</p>
nested-interactive serious
Interactive controls must not be nested
Learn more
nodes: 1
target #locate-me
Fix any of the following: Element has focusable descendants
HTML snippet
<button id="locate-me" class="pointer-events-auto bg-white rounded-md absolute top-20 left-[10px] z-10 p-[3.5px] border-2" style="border-color: #C3BFBB">
target-size serious
All touch targets must be 24px large, or leave sufficient space
Learn more
nodes: 1
target #locate-me
Fix any of the following: Target has insufficient size because it is partially obscured (smallest space is 5.5px by 35px, should be at least 24px by 24px) Target has insufficient space to its closest neighbors. Safe clickable space has a diameter of 0px instead of at least 24px.
HTML snippet
<button id="locate-me" class="pointer-events-auto bg-white rounded-md absolute top-20 left-[10px] z-10 p-[3.5px] border-2" style="border-color: #C3BFBB">

Incomplete (manual review) (2)

aria-valid-attr-value critical
ARIA attributes must conform to valid values
Manual review required to confirm this issue.
Learn more
nodes: 1
target #search-btn
Fix all of the following: Unable to determine if aria-controls referenced ID exists on the page while using aria-haspopup: aria-controls="search-overlay"
HTML snippet
<button type="button" class="md:!flex gap-2 items-center h-[48px] min-h-[48px] font-roboto text-sm font-medium text-rhWhite px-4 py-3" @click="$store.searchOpen = true" id="search-btn" aria-haspopup="dialog" aria-controls="search-overlay">
color-contrast serious
Elements must meet minimum color contrast ratio thresholds
Manual review required to confirm this issue.
Learn more
nodes: 16
target .float-left.dropdown.overflow-hidden:nth-child(1) > .dropbtn.min-h-\[48px\][aria-haspopup="true"] > .inline-flex
Fix any of the following: Element's background color could not be determined due to a background image
HTML snippet
<span class="inline-flex items-center gap-2">
target .float-left.dropdown.overflow-hidden:nth-child(2) > .dropbtn.min-h-\[48px\][aria-haspopup="true"] > .inline-flex
Fix any of the following: Element's background color could not be determined due to a background image
HTML snippet
<span class="inline-flex items-center gap-2">
target .float-left.dropdown.overflow-hidden:nth-child(3) > .dropbtn.min-h-\[48px\][aria-haspopup="true"] > .inline-flex
Fix any of the following: Element's background color could not be determined due to a background image
HTML snippet
<span class="inline-flex items-center gap-2">
target .float-left.dropdown.overflow-hidden:nth-child(4) > .dropbtn.min-h-\[48px\][aria-haspopup="true"] > .inline-flex
Fix any of the following: Element's background color could not be determined due to a background image
HTML snippet
<span class="inline-flex items-center gap-2">
target #search-btn
Fix any of the following: Element's background color could not be determined due to a background image
HTML snippet
<button type="button" class="md:!flex gap-2 items-center h-[48px] min-h-[48px] font-roboto text-sm font-medium text-rhWhite px-4 py-3" @click="$store.searchOpen = true" id="search-btn" aria-haspopup="dialog" aria-controls="search-overlay">
target #suffolk-county-region > .pr-\[16px\].shadow-\[0_4px_24px_0_rgba\(0\,0\,0\,0\.40\)\].cursor-pointer > .w-max.px-\[24px\].py-\[16px\] > .text-rhTranslucentWhite.text-md
Fix any of the following: Element's background color could not be determined because it is overlapped by another element
HTML snippet
<span class="font-roboto text-rhTranslucentWhite font-medium text-md">Suffolk County</span>
target #nassau-county-region > .pr-\[16px\].shadow-\[0_4px_24px_0_rgba\(0\,0\,0\,0\.40\)\].cursor-pointer > .w-max.px-\[24px\].py-\[16px\] > .text-rhTranslucentWhite.text-md
Fix any of the following: Element's background color could not be determined because it is overlapped by another element
HTML snippet
<span class="font-roboto text-rhTranslucentWhite font-medium text-md">Nassau County</span>
target #bronx-queens-region > .pr-\[16px\].shadow-\[0_4px_24px_0_rgba\(0\,0\,0\,0\.40\)\].cursor-pointer > .w-max.px-\[24px\].py-\[16px\] > .text-rhTranslucentWhite.text-md
Fix any of the following: Element's background color could not be determined because it is overlapped by another element
HTML snippet
<span class="font-roboto text-rhTranslucentWhite font-medium text-md">Bronx &amp; Queens</span>
target #westchester-county-region > .pr-\[16px\].shadow-\[0_4px_24px_0_rgba\(0\,0\,0\,0\.40\)\].cursor-pointer > .w-max.px-\[24px\].py-\[16px\] > .text-rhTranslucentWhite.text-md
Fix any of the following: Element's background color could not be determined because it is overlapped by another element
HTML snippet
<span class="font-roboto text-rhTranslucentWhite font-medium text-md">Westchester County</span>
target #western-ct-region > .pr-\[16px\].shadow-\[0_4px_24px_0_rgba\(0\,0\,0\,0\.40\)\].cursor-pointer > .w-max.px-\[24px\].py-\[16px\] > .text-rhTranslucentWhite.text-md
Fix any of the following: Element's background color could not be determined because it is overlapped by another element
HTML snippet
<span class="font-roboto text-rhTranslucentWhite font-medium text-md">Western CT</span>
target #eastern-ct-region > .pr-\[16px\].shadow-\[0_4px_24px_0_rgba\(0\,0\,0\,0\.40\)\].cursor-pointer > .w-max.px-\[24px\].py-\[16px\] > .text-rhTranslucentWhite.text-md
Fix any of the following: Element's background color could not be determined because it is overlapped by another element
HTML snippet
<span class="font-roboto text-rhTranslucentWhite font-medium text-md">Eastern CT</span>
target .long-island-sound-map-label.text-center
Fix any of the following: Element's background color could not be determined because element contains an image node
HTML snippet
<div class="text-center long-island-sound-map-label">Long Island Sound</div>
target .leaflet-control-zoom-out > span
Fix any of the following: Element content contains only non-text characters
HTML snippet
<span aria-hidden="true">−</span>
target a[href$="leafletjs.com"]
Fix any of the following: Element's background color could not be determined because element contains an image node
HTML snippet
<a href="https://leafletjs.com">
target .top-\[20\%\] > .gap-4.items-start.flex-col > div:nth-child(1) > h3
Fix any of the following: Element's background color could not be determined due to a background image
HTML snippet
<h3 class="text-sm desktop:text-md font-roboto text-rhDark text-rhWhite">Learn more at
lispartnership.org</h3>
target .gap-4.items-start.flex-col > .gap-4.flex > .bg-rhTransparent1.hover\:bg-rhTransparent2.text-rhYellow
Fix any of the following: Element's background color could not be determined due to a background image
HTML snippet
<a id="" href="https://lispartnersh..." class="transition-all white..." target="_blank" rel="noopener noreferrer">