fix: p-calendar, p-button accessibility focus selection (#488)

* fix: p-calendar accessibility focus selection * fix: increase offset --------- Co-authored-by: kim.tran <[email protected]> Co-authored-by: SchettlerKoehler <[email protected]>
onecx · Sep 24, 2024 · d1c7c11 · d1c7c11
1 parent ff4c5a2
commit d1c7c11
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 5 deletions.
diff --git a/libs/portal-layout-styles/src/styles/primeng/sass/theme/extensions/_calendar.scss b/libs/portal-layout-styles/src/styles/primeng/sass/theme/extensions/_calendar.scss
@@ -76,7 +76,7 @@
     td {
       &.p-datepicker-today {
         > span {
-          box-shadow: 0 0 0 1px rgba($overlayColor, 0.38);
+          box-shadow: 0 0 0 0 rgba($overlayColor, 0.38);
         }
 
         &.p-highlight {

diff --git a/libs/portal-layout-styles/src/styles/primeng/sass/variables/theme/_theme_light.scss b/libs/portal-layout-styles/src/styles/primeng/sass/variables/theme/_theme_light.scss
@@ -48,8 +48,8 @@ $scaleLG: 1.25;
 
 //focus
 $focusOutlineColor: transparent;
-$focusOutline: 0 none;
-$focusOutlineOffset: 0;
+$focusOutline: 1px solid black;
+$focusOutlineOffset: 2px;
 $focusShadow: none;
 
 //action icons
@@ -311,8 +311,8 @@ $calendarCellDateHeight: 2.5rem;
 $calendarCellDateBorderRadius: 50%;
 $calendarCellDateBorder: 1px solid transparent;
 $calendarCellDateHoverBg: rgba(0, 0, 0, 0.04);
-$calendarCellDateTodayBg: #ffffff;
-$calendarCellDateTodayBorderColor: rgba(0, 0, 0, 12);
+$calendarCellDateTodayBg: #e2e8f0;
+$calendarCellDateTodayBorderColor: #ffffff;
 $calendarCellDateTodayTextColor: $textColor;
 
 $calendarButtonBarPadding: 1rem 0;