From 0f258cd3b931038a80b73f16d2a78e1e0d481da0 Mon Sep 17 00:00:00 2001
From: Caryl Wyatt <carylw@hathitrust.org>
Date: Fri, 10 May 2024 15:43:52 -0500
Subject: [PATCH 1/6] 1727483 add focus indicator to filter lists

---
 src/js/components/AdvancedSearchForm/index.svelte | 4 ++--
 src/scss/styles.scss                              | 2 ++
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/src/js/components/AdvancedSearchForm/index.svelte b/src/js/components/AdvancedSearchForm/index.svelte
index 2213eec..b82c893 100644
--- a/src/js/components/AdvancedSearchForm/index.svelte
+++ b/src/js/components/AdvancedSearchForm/index.svelte
@@ -649,7 +649,7 @@
         <fieldset class="mb-4">
           <legend class="fs-4 fw-bold">Language</legend>
 
-          <div>
+          <div class="advanced-search-list">
             <FilterableSelection
               --filterable-list-height="15rem"
               items={languageData.map((item) => ({
@@ -670,7 +670,7 @@
 
           <p>Select one or more options to narrow your results to items that match all of your format selections.</p>
 
-          <div>
+          <div class="advanced-search-list">
             <FilterableSelection
               --filterable-list-height="15rem"
               items={formatData.map((item) => ({
diff --git a/src/scss/styles.scss b/src/scss/styles.scss
index 0c3c359..399d5d8 100644
--- a/src/scss/styles.scss
+++ b/src/scss/styles.scss
@@ -369,6 +369,8 @@ textarea.form-control {
 }
 .was-validated .form-check-input:valid:focus, .form-check-input.is-valid:focus {
   box-shadow: var(--ht-focus-box-shadow);
+.advanced-search-list li.form-check:focus-within {
+    border: 2px solid var(--color-primary-600);
 }
 
 a:not(.btn,.list-group-item):has(i[aria-hidden]) {

From 95a36b09a5fe4f3e7027e60441dd068c82c0f38d Mon Sep 17 00:00:00 2001
From: Caryl Wyatt <carylw@hathitrust.org>
Date: Mon, 13 May 2024 14:42:21 -0500
Subject: [PATCH 2/6] 1727510: radio buttons unique ids for labels, fix legend
 text

---
 src/js/components/AdvancedSearchForm/index.svelte | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/js/components/AdvancedSearchForm/index.svelte b/src/js/components/AdvancedSearchForm/index.svelte
index b82c893..82ea50a 100644
--- a/src/js/components/AdvancedSearchForm/index.svelte
+++ b/src/js/components/AdvancedSearchForm/index.svelte
@@ -494,20 +494,20 @@
         {#each lookFors as value, idx}
           {#if idx > 0}
             <fieldset class="mb-3">
-              <legend class="visually-hidden">Boolean operator for field {idx - 1} and field {idx}</legend>
+              <legend class="visually-hidden">Boolean operator for field {idx} and field {idx + 1}</legend>
               <div class="d-flex gap-3 align-items-center justify-content-start">
                 {#each booleanOptions as option, bidx}
                   <div class="form-check">
                     <input
                       name="boolean-{idx}"
-                      id="boolean-{bidx}"
+                      id="boolean-{idx}_{bidx}"
                       type="radio"
                       class="form-check-input"
                       value={option.value}
                       checked={option.value == bools[idx]}
                       bind:group={bools[idx]}
                     />
-                    <label class="form-check-label text-uppercase" for="boolean-{bidx}">{option.value}</label>
+                    <label class="form-check-label text-uppercase" for="boolean-{idx}_{bidx}">{option.value}</label>
                   </div>
                 {/each}
               </div>

From 0164565b42b67b2b4f0cffd4ae0943ed1e187708 Mon Sep 17 00:00:00 2001
From: Caryl Wyatt <carylw@hathitrust.org>
Date: Mon, 13 May 2024 15:03:09 -0500
Subject: [PATCH 3/6] remove redundant checkbox role

---
 src/js/components/FeedbackFormCatalog/index.svelte | 13 +------------
 1 file changed, 1 insertion(+), 12 deletions(-)

diff --git a/src/js/components/FeedbackFormCatalog/index.svelte b/src/js/components/FeedbackFormCatalog/index.svelte
index 3a3ec99..88ac9a2 100644
--- a/src/js/components/FeedbackFormCatalog/index.svelte
+++ b/src/js/components/FeedbackFormCatalog/index.svelte
@@ -193,7 +193,6 @@
         <input
           class="form-check-input"
           type="checkbox"
-          role="checkbox"
           name="problems"
           value="Book doesn't match description"
           id="c1"
@@ -205,7 +204,6 @@
         <input
           class="form-check-input"
           type="checkbox"
-          role="checkbox"
           name="problems"
           value="Typo in metadata"
           id="c2"
@@ -214,22 +212,13 @@
         <label class="form-check-label" for="c2"> There is a typo in the metadata </label>
       </div>
       <div class="form-check">
-        <input
-          class="form-check-input"
-          type="checkbox"
-          role="checkbox"
-          name="problems"
-          value="Other"
-          id="c3"
-          bind:group={problems}
-        />
+        <input class="form-check-input" type="checkbox" name="problems" value="Other" id="c3" bind:group={problems} />
         <label class="form-check-label" for="c3"> Other (describe in description box) </label>
       </div>
       <div class="form-check">
         <input
           class="form-check-input"
           type="checkbox"
-          role="checkbox"
           name="problems"
           value="None"
           id="c4"

From d85c4626eace6a3ea9a62c188b0d2d376b277bc8 Mon Sep 17 00:00:00 2001
From: Caryl Wyatt <carylw@hathitrust.org>
Date: Mon, 13 May 2024 15:05:53 -0500
Subject: [PATCH 4/6] add closing bracket

---
 src/scss/styles.scss | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/scss/styles.scss b/src/scss/styles.scss
index 399d5d8..1ecd71f 100644
--- a/src/scss/styles.scss
+++ b/src/scss/styles.scss
@@ -369,6 +369,7 @@ textarea.form-control {
 }
 .was-validated .form-check-input:valid:focus, .form-check-input.is-valid:focus {
   box-shadow: var(--ht-focus-box-shadow);
+}
 .advanced-search-list li.form-check:focus-within {
     border: 2px solid var(--color-primary-600);
 }

From bbbbcd21fefc9da6bcc2eb56764c221dc1b8077d Mon Sep 17 00:00:00 2001
From: Caryl Wyatt <carylw@hathitrust.org>
Date: Mon, 13 May 2024 15:17:01 -0500
Subject: [PATCH 5/6] update form filter list to accessible orange

---
 src/js/components/FilterableSelection.svelte | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/js/components/FilterableSelection.svelte b/src/js/components/FilterableSelection.svelte
index fef4c92..2c6a626 100644
--- a/src/js/components/FilterableSelection.svelte
+++ b/src/js/components/FilterableSelection.svelte
@@ -142,7 +142,7 @@
   }
 
   input:checked + label {
-    background: var(--color-primary-500, '#000') !important;
+    background: var(--color-primary-600, '#000') !important;
     color: white !important;
   }
 

From e180f0981dc59690e75000cf5b4c280fde675d9d Mon Sep 17 00:00:00 2001
From: Caryl Wyatt <carylw@hathitrust.org>
Date: Mon, 13 May 2024 15:26:33 -0500
Subject: [PATCH 6/6] add focus style for selected list item

---
 src/scss/styles.scss | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/src/scss/styles.scss b/src/scss/styles.scss
index 1ecd71f..15e695e 100644
--- a/src/scss/styles.scss
+++ b/src/scss/styles.scss
@@ -373,6 +373,9 @@ textarea.form-control {
 .advanced-search-list li.form-check:focus-within {
     border: 2px solid var(--color-primary-600);
 }
+.advanced-search-list li.form-check:has(input:checked):focus-within {
+  border: 2px solid var(--color-neutral-800);
+}
 
 a:not(.btn,.list-group-item):has(i[aria-hidden]) {
   display: inline-flex;