From acf1b231952675569ff1c54167463d0f72892633 Mon Sep 17 00:00:00 2001
From: Jen Breese-Kauth <jbreese@stanford.edu>
Date: Fri, 30 Aug 2024 19:25:58 +0000
Subject: [PATCH] added the border on checked

---
 .../filtering-table/branch-locations-filtering-table.tsx      | 4 ++--
 src/components/views/sul-people/sul-people-table-view.tsx     | 2 +-
 .../filtering-table/study-place-filtering-table.tsx           | 4 ++--
 3 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/src/components/views/sul-branch-locations/filtering-table/branch-locations-filtering-table.tsx b/src/components/views/sul-branch-locations/filtering-table/branch-locations-filtering-table.tsx
index ca059d4f..46914431 100644
--- a/src/components/views/sul-branch-locations/filtering-table/branch-locations-filtering-table.tsx
+++ b/src/components/views/sul-branch-locations/filtering-table/branch-locations-filtering-table.tsx
@@ -74,7 +74,7 @@ const BranchLocationFilteringTable = ({items}: Props) => {
               checked={!onlyOpenNow}
               onChange={showOpenAndClosed}
             />
-            <span className="flex items-center whitespace-nowrap rounded-l-full border border-r-0 border-black-80 p-9 pl-0 pr-20 text-18 text-black-80 no-underline group-hover:text-cardinal-red-dark group-hover:underline peer-checked:bg-[#979694] peer-checked:bg-opacity-20 peer-checked:pl-16 peer-checked:text-black peer-checked:transition-all peer-checked:ease-in-out peer-focus:border-2 peer-focus:border-black-80 peer-focus:bg-[#979694] peer-focus:bg-opacity-10 peer-focus:text-black peer-checked:[&_svg]:text-black">
+            <span className="flex items-center whitespace-nowrap rounded-l-full border border-r-0 border-black-80 p-9 pl-0 pr-20 text-18 text-black-80 no-underline group-hover:text-cardinal-red-dark group-hover:underline peer-checked:border-2 peer-checked:bg-[#979694] peer-checked:bg-opacity-20 peer-checked:pl-16 peer-checked:text-black peer-checked:transition-all peer-checked:ease-in-out peer-focus:border-2 peer-focus:border-black-80 peer-focus:bg-[#979694] peer-focus:bg-opacity-10 peer-focus:text-black peer-checked:[&_svg]:text-black">
               <CheckIcon width={20} className="text-transparent" />
               All locations
             </span>
@@ -87,7 +87,7 @@ const BranchLocationFilteringTable = ({items}: Props) => {
               checked={onlyOpenNow}
               onChange={showOnlyOpenNow}
             />
-            <span className="flex items-center whitespace-nowrap rounded-r-full border border-black-80 p-9 pr-20 text-18 text-black-80 no-underline group-hover:underline peer-checked:bg-[#979694] peer-checked:bg-opacity-20 peer-checked:pl-16 peer-checked:text-black peer-checked:transition-all peer-checked:ease-in-out peer-focus:border-2 peer-focus:border-black-80 peer-focus:bg-[#979694] peer-focus:bg-opacity-10 peer-focus:text-black peer-checked:[&_svg]:text-black">
+            <span className="flex items-center whitespace-nowrap rounded-r-full border border-black-80 p-9 pr-20 text-18 text-black-80 no-underline group-hover:underline peer-checked:border-2 peer-checked:bg-[#979694] peer-checked:bg-opacity-20 peer-checked:pl-16 peer-checked:text-black peer-checked:transition-all peer-checked:ease-in-out peer-focus:border-2 peer-focus:border-black-80 peer-focus:bg-[#979694] peer-focus:bg-opacity-10 peer-focus:text-black peer-checked:[&_svg]:text-black">
               <CheckIcon width={20} className="text-transparent" />
               Open now
             </span>
diff --git a/src/components/views/sul-people/sul-people-table-view.tsx b/src/components/views/sul-people/sul-people-table-view.tsx
index 853e6eb6..84b69f8c 100644
--- a/src/components/views/sul-people/sul-people-table-view.tsx
+++ b/src/components/views/sul-people/sul-people-table-view.tsx
@@ -254,7 +254,7 @@ const ToggleOption = ({
 
       <span
         className={twMerge(
-          "peer-focus:nounderline flex items-center border border-black-80 p-4 pr-32 text-18 leading-[30px] no-underline hover:text-cardinal-red-dark hover:underline peer-checked:bg-[#979694] peer-checked:bg-opacity-20 peer-checked:pl-16 peer-checked:text-black peer-checked:transition-all peer-checked:ease-in-out peer-focus:border-2 peer-focus:border-black-80 peer-focus:bg-[#979694] peer-focus:bg-opacity-10 peer-focus:text-black peer-focus:underline sm:whitespace-nowrap peer-checked:[&_svg]:text-black",
+          "peer-focus:nounderline flex items-center border border-black-80 p-4 pr-32 text-18 leading-[30px] no-underline hover:text-cardinal-red-dark hover:underline peer-checked:border-2 peer-checked:bg-[#979694] peer-checked:bg-opacity-20 peer-checked:pl-16 peer-checked:text-black peer-checked:transition-all peer-checked:ease-in-out peer-focus:border-2 peer-focus:border-black-80 peer-focus:bg-[#979694] peer-focus:bg-opacity-10 peer-focus:text-black peer-focus:underline sm:whitespace-nowrap peer-checked:[&_svg]:text-black",
           clsx({
             "rounded-l-full": first,
             "rounded-r-full": last,
diff --git a/src/components/views/sul-study-place/filtering-table/study-place-filtering-table.tsx b/src/components/views/sul-study-place/filtering-table/study-place-filtering-table.tsx
index f9ce0f91..1ab92236 100644
--- a/src/components/views/sul-study-place/filtering-table/study-place-filtering-table.tsx
+++ b/src/components/views/sul-study-place/filtering-table/study-place-filtering-table.tsx
@@ -120,7 +120,7 @@ const StudyPlaceFilteringTable = ({items}: Props) => {
                     onChange={showOpenAndClosed}
                     checked={!onlyOpenNow}
                   />
-                  <span className="flex items-center whitespace-nowrap rounded-l-full border border-r-0 border-black-80 p-9 pl-0 pr-20 text-18 text-black-80 no-underline group-hover:text-cardinal-red-dark group-hover:underline peer-checked:bg-[#979694] peer-checked:bg-opacity-20 peer-checked:pl-16 peer-checked:text-black peer-checked:transition-all peer-checked:ease-in-out peer-focus:border-2 peer-focus:border-black-80 peer-focus:bg-[#979694] peer-focus:bg-opacity-10 peer-focus:text-black peer-checked:[&_svg]:text-black">
+                  <span className="flex items-center whitespace-nowrap rounded-l-full border border-r-0 border-black-80 p-9 pl-0 pr-20 text-18 text-black-80 no-underline group-hover:text-cardinal-red-dark group-hover:underline peer-checked:border-2 peer-checked:bg-[#979694] peer-checked:bg-opacity-20 peer-checked:pl-16 peer-checked:text-black peer-checked:transition-all peer-checked:ease-in-out peer-focus:border-2 peer-focus:border-black-80 peer-focus:bg-[#979694] peer-focus:bg-opacity-10 peer-focus:text-black peer-checked:[&_svg]:text-black">
                     <CheckIcon width={20} className="text-transparent" />
                     All locations
                   </span>
@@ -134,7 +134,7 @@ const StudyPlaceFilteringTable = ({items}: Props) => {
                     onChange={showOnlyOpenNow}
                     checked={onlyOpenNow}
                   />
-                  <span className="flex items-center whitespace-nowrap rounded-r-full border border-black-80 p-9 pr-20 text-18 text-black-80 no-underline group-hover:text-cardinal-red-dark group-hover:underline peer-checked:bg-[#979694] peer-checked:bg-opacity-20 peer-checked:pl-16 peer-checked:text-black peer-checked:transition-all peer-checked:ease-in-out peer-focus:border-2 peer-focus:border-black-80 peer-focus:bg-[#979694] peer-focus:bg-opacity-10 peer-focus:text-black peer-checked:[&_svg]:text-black">
+                  <span className="flex items-center whitespace-nowrap rounded-r-full border border-black-80 p-9 pr-20 text-18 text-black-80 no-underline group-hover:text-cardinal-red-dark group-hover:underline peer-checked:border-2 peer-checked:bg-[#979694] peer-checked:bg-opacity-20 peer-checked:pl-16 peer-checked:text-black peer-checked:transition-all peer-checked:ease-in-out peer-focus:border-2 peer-focus:border-black-80 peer-focus:bg-[#979694] peer-focus:bg-opacity-10 peer-focus:text-black peer-checked:[&_svg]:text-black">
                     <CheckIcon width={20} className="text-transparent" />
                     Open now
                   </span>