added the border on checked

SU-SWS · Aug 30, 2024 · acf1b23 · acf1b23
1 parent 7431185
commit acf1b23
Show file tree

Hide file tree

Showing 3 changed files with 5 additions and 5 deletions.
diff --git a/...omponents/views/sul-branch-locations/filtering-table/branch-locations-filtering-table.tsx b/...omponents/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
@@ -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
@@ -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>